*{margin:0;padding:0;box-sizing:border-box}body{background:repeating-linear-gradient(0deg,#fff9eb00,#fff9eb00 1px,#e3dbcb08 1px,#e3dbcb08 2px),repeating-linear-gradient(90deg,#fff9eb00,#fff9eb00 1px,#e3dbcb08 1px,#e3dbcb08 2px),linear-gradient(135deg,#f5e6d3,#f9f3e9,#f0e4d0);min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px;position:relative;overflow-x:hidden}body:before{content:"";position:fixed;top:0;left:0;right:0;bottom:0;background-image:radial-gradient(circle at 20% 30%,rgba(0,0,0,.02) 0%,transparent 50%),radial-gradient(circle at 80% 70%,rgba(0,0,0,.015) 0%,transparent 50%),radial-gradient(circle at 40% 80%,rgba(0,0,0,.01) 0%,transparent 50%),radial-gradient(circle at 90% 20%,rgba(0,0,0,.02) 0%,transparent 50%),radial-gradient(circle at 10% 90%,rgba(0,0,0,.015) 0%,transparent 50%);pointer-events:none;z-index:1}.container{background:#f7f0e6;border-radius:16px;padding:60px 50px;box-shadow:0 1px 2px #0000000d,0 4px 8px #0000000a,0 10px 20px #00000008,inset 0 0 100px #fffdf54d;max-width:700px;width:100%;position:relative;z-index:2;transform:rotate(-.5deg);border:1px solid rgba(180,160,130,.1)}h1{font-family:Comic Sans MS,Marker Felt,Bradley Hand,cursive,sans-serif;font-size:3.5rem;margin-bottom:10px;color:#3a3226;text-align:center;font-weight:600;letter-spacing:1px;text-shadow:1px 1px 0px rgba(58,50,38,.1);transform:rotate(.5deg)}.subtitle{font-family:Comic Sans MS,Marker Felt,cursive,sans-serif;font-size:1.2rem;color:#6b5d52;text-align:center;margin-bottom:40px;font-style:italic}.label{font-family:Comic Sans MS,Marker Felt,cursive,sans-serif;font-size:1.1rem;color:#3a3226;margin-bottom:10px;font-style:italic}.instructions{color:#6b5d52;margin-bottom:30px;font-size:.95rem;line-height:1.8;font-family:Comic Sans MS,Marker Felt,cursive,sans-serif}.instructions small{color:#8b7d72;font-size:.85rem}.instructions code{background:#f5efe5;padding:2px 6px;border-radius:3px;font-family:Comic Sans MS,cursive,monospace;color:#5a4a3a;border:1px dashed #d4c4b4}.loading{text-align:center;padding:40px 20px;font-family:Comic Sans MS,Marker Felt,cursive,sans-serif}.loading p{color:#6b5d52;font-size:1.1rem}.hidden{display:none!important}.app{margin-top:20px}.input-container{position:relative;margin-bottom:20px}#expression{width:100%;padding:18px 140px 18px 18px;font-size:1.3rem;border:1px solid rgba(168,148,122,.2);border-radius:8px;outline:none;transition:all .3s;font-family:Comic Sans MS,Marker Felt,Bradley Hand,cursive,sans-serif;position:relative;z-index:2;background:#fffef9;color:#3a3226;font-weight:500;box-shadow:inset 0 1px 2px #00000005}#expression:focus{border-color:#7a6a544d;background:#fffef9;box-shadow:inset 0 1px 2px #00000005,0 0 0 3px #7a6a5414;transform:rotate(0)}#expression::placeholder{color:#b4a694;font-style:italic}.shuffle-btn{position:absolute;right:8px;top:50%;transform:translateY(-50%) rotate(-1deg);z-index:3;background:#fff9f0;border:2px solid #a8947a;font-family:Comic Sans MS,Marker Felt,cursive,sans-serif;font-size:.95rem;cursor:pointer;padding:10px 16px;border-radius:20px;transition:all .2s;box-shadow:0 2px 4px #0000001a;color:#3a3226}.shuffle-btn:hover{background:#fff;transform:translateY(-50%) rotate(1deg) scale(1.05);box-shadow:0 4px 8px #00000026}.shuffle-btn:active{transform:translateY(-50%) rotate(-2deg) scale(.98)}.validation-overlay{position:absolute;top:0;left:0;right:0;bottom:0;padding:18px 140px 18px 18px;font-size:1.3rem;font-family:Comic Sans MS,Marker Felt,Bradley Hand,cursive,sans-serif;font-weight:500;pointer-events:none;white-space:pre;overflow:hidden;z-index:3;color:transparent}.validation-overlay .invalid{color:#d9831f;text-decoration:underline wavy #d9831f;text-decoration-thickness:2px;text-underline-offset:3px}.result-container{margin-top:30px;padding:25px;background:#faf7f0;border-radius:4px;min-height:80px;border:2px dashed #c4b4a4;position:relative;transform:rotate(.3deg)}.computing{color:#7a6a54;font-style:italic;animation:pulse 1.5s ease-in-out infinite;font-family:Comic Sans MS,Marker Felt,cursive,sans-serif;font-size:1.1rem}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.result{font-size:2rem;color:#3a3226;font-weight:600;font-family:Comic Sans MS,Marker Felt,Bradley Hand,cursive,sans-serif;text-align:center}.result:before{content:"= ";color:#7a6a54;margin-right:8px}.error{color:#c44536;font-size:1rem;font-family:Comic Sans MS,Marker Felt,cursive,sans-serif;text-align:center}.container:before{content:"✨";position:absolute;top:15px;left:15px;font-size:1.5rem;opacity:.4;transform:rotate(-15deg)}.container:after{content:"✏️";position:absolute;bottom:15px;right:15px;font-size:1.5rem;opacity:.4;transform:rotate(15deg)}