:root{--bg: #fff8e7;--ink: #2b2b3a;--muted: #6b6b7b;--card: #ffffff;--line: #ece3cf;--blue: #4dabf7;--orange: #ff922b;--green: #51cf66;--purple: #9775fa;--red: #ff6b6b;--yellow: #ffd43b;--radius: 28px;--tap: 88px;color-scheme:light}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{margin:0;height:100%}body{background:var(--bg);color:var(--ink);font-family:Nunito,Segoe UI Rounded,SF Pro Rounded,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-weight:700;font-size:20px;overscroll-behavior:none;user-select:none;-webkit-user-select:none;overflow:hidden}button,a.big-btn{font:inherit;color:inherit;border:0;cursor:pointer;touch-action:manipulation;text-decoration:none}button:disabled{opacity:.4}h1,h2{margin:0}input{user-select:text;-webkit-user-select:text}.home{height:100%;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 85% 10%,#fff3bf 0 120px,transparent 121px),linear-gradient(#d0ebff,var(--bg) 60%)}.tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;width:min(100%,980px)}@media (orientation: landscape) and (min-width: 900px){.tiles{grid-template-columns:repeat(4,minmax(0,1fr))}}.tile{aspect-ratio:1;border-radius:40px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:#fff;box-shadow:0 10px #00000026;transition:transform .08s}.tile:active,.big-btn:active,.round:active,.tool:active{transform:translateY(5px) scale(.97)}.tile-emoji{font-size:clamp(64px,11vw,110px);line-height:1}.tile-label{font-size:clamp(22px,2.6vw,32px);font-weight:900;text-shadow:0 2px 0 rgba(0,0,0,.15)}.blue{background:var(--blue)}.orange{background:var(--orange)}.green{background:var(--green)}.purple{background:var(--purple)}.red{background:var(--red);color:#fff}.gear{position:fixed;right:14px;bottom:14px;width:48px;height:48px;border-radius:50%;background:#fff9;font-size:24px;opacity:.6}.screen{height:100%;display:flex;flex-direction:column;overflow:hidden}.topbar{display:flex;align-items:center;gap:16px;padding:14px 16px;flex:none}.topbar h1{font-size:30px;font-weight:900;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.topbar-right{display:flex;gap:12px}.round{width:var(--tap);height:var(--tap);border-radius:50%;background:var(--card);font-size:40px;display:grid;place-items:center;box-shadow:0 6px #0000001f;flex:none}.big-btn{min-height:var(--tap);padding:0 30px;border-radius:999px;background:var(--card);font-size:24px;font-weight:800;display:inline-flex;align-items:center;justify-content:center;gap:10px;box-shadow:0 6px #0000001f}.big-btn.orange,.big-btn.green,.big-btn.blue{color:#fff}.row{display:flex;align-items:center}.row.center{justify-content:center}.gap{gap:16px}.wrap{flex-wrap:wrap}.stack{display:flex;flex-direction:column;gap:16px}.small{font-size:16px;font-weight:600;color:var(--muted)}.big-text{font-size:30px;margin:0}.label{margin:16px 0 8px;font-size:18px;color:var(--muted)}.error{color:#c92a2a}.empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:24px;gap:8px}.empty p{margin:0;font-size:26px}.empty .small{font-size:18px}.empty-emoji,.done-emoji{font-size:110px;line-height:1.1}.done-emoji{text-align:center;animation:pop .5s ease-out}@keyframes pop{0%{transform:scale(.2) rotate(-30deg)}70%{transform:scale(1.2) rotate(8deg)}to{transform:scale(1)}}.thumb-grid{flex:1;overflow-y:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px;padding:4px 16px 24px;align-content:start}.thumb{aspect-ratio:1;border-radius:24px;overflow:hidden;padding:0;background:#e9ecef;box-shadow:0 5px #0000001a}.thumb img,.ptile img{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}.viewer{height:100%;background:#111;position:relative;overflow:hidden}.viewer-img{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;touch-action:none}.viewer-img img{max-width:100%;max-height:100%;object-fit:contain;pointer-events:none}.viewer-home{position:absolute;top:16px;left:16px}.arrow{position:absolute;top:50%;margin-top:calc(var(--tap) / -2);opacity:.85}.arrow.left{left:16px}.arrow.right{right:16px}.viewer-draw{position:absolute;bottom:20px;left:50%;transform:translate(-50%)}.viewer-draw:active{transform:translate(-50%) translateY(5px)}.card-grid{flex:1;overflow-y:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px;padding:4px 16px 24px;align-content:start}.pick-card{background:var(--card);border-radius:var(--radius);padding:12px 12px 14px;display:flex;flex-direction:column;gap:10px;box-shadow:0 6px #0000001a;font-size:22px}.pick-card small{color:var(--muted)}.pick-img{width:100%;aspect-ratio:297 / 210;border-radius:16px;border:2px solid var(--line);background:#fff;object-fit:contain;display:block}.blank-sheet{background:#fff}.draw{height:100%;display:grid;grid-template-columns:104px minmax(0,1fr) 176px;background:#f1e9d6}.draw-tools,.draw-colors{display:flex;flex-direction:column;gap:10px;padding:10px;overflow-y:auto;align-items:center}.tool{width:84px;height:84px;flex:none;border-radius:24px;background:var(--card);font-size:42px;box-shadow:0 5px #0000001f}.tool.on{background:var(--yellow);outline:5px solid #f59f00}.tool.save{background:var(--green);margin-top:auto}.draw-stage{min-width:0;min-height:0;padding:12px 6px;display:flex}.sheet{width:100%;height:100%;touch-action:none;filter:drop-shadow(0 4px 10px rgba(0,0,0,.18))}.sheet .outline{pointer-events:none}.sheet .strokes path{pointer-events:stroke}.tool-pen .sheet{cursor:crosshair}.swatches{display:grid;grid-template-columns:repeat(2,66px);gap:10px}.swatch{width:66px;height:66px;border-radius:50%;border:4px solid rgba(0,0,0,.12)}.swatch.on{outline:6px solid var(--ink);outline-offset:2px;transform:scale(1.06)}.sizes{display:flex;gap:8px;margin-top:6px}.size{width:44px;height:66px;flex:none;border-radius:16px;background:var(--card);display:grid;place-items:center}.size span{border-radius:50%;border:2px solid rgba(0,0,0,.15);max-width:40px;max-height:40px}.size.on{outline:4px solid var(--ink)}@media (orientation: portrait){.draw{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr) auto}.draw-tools,.draw-colors{flex-direction:row;overflow-x:auto;overflow-y:hidden}.tool.save{margin-top:0;margin-left:auto}.swatches{grid-template-columns:repeat(7,58px)}.swatch{width:58px;height:58px}.sizes{margin:0 0 0 auto;flex-direction:column}.size{width:66px;height:40px}}.modal-bg{position:fixed;top:0;right:0;bottom:0;left:0;background:#1e1e3273;display:grid;place-items:center;padding:16px;z-index:10}.modal{background:var(--card);border-radius:36px;padding:28px;width:min(100%,640px);max-height:100%;overflow-y:auto;box-shadow:0 20px 60px #00000040}.modal h2{font-size:32px;text-align:center;margin-bottom:18px}.pin-dots{display:flex;justify-content:center;gap:18px;margin-bottom:20px}.pin-dots span{width:24px;height:24px;border-radius:50%;border:3px solid var(--ink)}.pin-dots span.on{background:var(--ink)}.pin-dots.wrong{animation:shake .35s}.pin-dots.wrong span{border-color:var(--red);background:var(--red)}@keyframes shake{25%{transform:translate(-12px)}75%{transform:translate(12px)}}.pin-grid{display:grid;grid-template-columns:repeat(3,96px);gap:14px;justify-content:center}.pin-grid button{height:84px;border-radius:24px;background:#f1f3f5;font-size:34px}.pin-cancel{color:var(--red)!important}.chips{display:flex;flex-wrap:wrap;gap:10px}.chips.pad{padding:0 16px 12px}.chip{min-height:52px;padding:0 20px;border-radius:999px;background:#f1f3f5;font-size:18px;display:inline-flex;align-items:center}.chip.big{min-height:68px;font-size:22px;padding:0 26px}.chip.on{background:var(--blue);color:#fff}.chip.static{min-height:40px}.text-in{width:100%;min-height:64px;border-radius:20px;border:3px solid var(--line);padding:0 18px;font:inherit;font-size:22px}.text-in.small{width:200px;min-height:52px;font-size:18px}.modal .row{margin-top:24px;flex-wrap:wrap}.drawing-view{flex:1;overflow-y:auto;display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:24px;padding:4px 16px 24px;align-items:start}@media (orientation: portrait){.drawing-view{grid-template-columns:1fr}}.sheet-preview{width:100%;background:#fff;border-radius:12px;box-shadow:0 6px 18px #00000026}.drawing-info{display:flex;flex-direction:column;gap:12px}.edit-box{background:var(--card);border-radius:var(--radius);padding:16px}.edit-box .row{margin-top:16px}.parent{-webkit-user-select:text;user-select:text}.parent-body{flex:1;overflow-y:auto;padding:0 16px 32px;display:flex;flex-direction:column;gap:16px;max-width:1000px;width:100%;margin:0 auto}.card{background:var(--card);border-radius:var(--radius);padding:20px;display:flex;flex-direction:column;gap:12px}.card h2{font-size:24px}.card .big-btn{min-height:64px;font-size:20px;align-self:flex-start}.progress .bar{height:14px;border-radius:7px;background:#f1f3f5;overflow:hidden}.progress .bar span{display:block;height:100%;background:var(--green);transition:width .2s}.toggle{display:flex;gap:14px;align-items:center;cursor:pointer;min-height:64px}.toggle input{position:absolute;opacity:0}.switch{width:64px;height:36px;border-radius:18px;background:#ced4da;position:relative;flex:none;transition:background .15s}.switch:after{content:"";position:absolute;top:4px;left:4px;width:28px;height:28px;border-radius:50%;background:#fff;transition:left .15s}.toggle input:checked+.switch{background:var(--green)}.toggle input:checked+.switch:after{left:32px}.ptile-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px}.ptile{aspect-ratio:1;border-radius:14px;overflow:hidden;padding:0;position:relative;background:#e9ecef}.ptile.hidden img{filter:grayscale(1) opacity(.45)}.ptile-tag{position:absolute;left:4px;bottom:4px;right:4px;font-size:13px;color:#fff;text-shadow:0 1px 2px #000;text-align:left}.ptile-src{position:absolute;top:4px;right:6px;font-size:13px;color:#fff;text-shadow:0 1px 2px #000}
