:root{--bg:#f4f1ea;--surface:#fff;--surface-2:#efe9dd;--ink:#2c2c2c;--ink-soft:#5f5f5f;--line:#d8d1c4;--accent:#4a6d7c;--accent-ink:#fff;--danger:#b4553f;--focus:#2f6f8f;--font-scale:1;--tile-gap:10px;--tile-radius:16px;--tile-min:96px;--strip-h:84px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}:root[data-contrast=high]{--bg:#fff;--surface:#fff;--surface-2:#f0f0f0;--ink:#000;--ink-soft:#000;--line:#000;--accent:#003a5c;--focus:#003a5c}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{width:100%;height:100%;overflow:hidden}body{background:var(--bg);color:var(--ink);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;overscroll-behavior:none;touch-action:manipulation}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:none}img{-webkit-user-drag:none;-webkit-user-select:none;user-select:none;max-width:100%}@media (prefers-reduced-motion:reduce){:not(.tile-dwell){transition-duration:.01ms!important;animation-duration:.01ms!important}}:root[data-motion=reduced] :not(.tile-dwell){transition-duration:.01ms!important;animation-duration:.01ms!important}:focus-visible{outline:3px solid var(--focus);outline-offset:2px}.app-loading{height:100%;color:var(--ink-soft);place-items:center;font-size:1.1rem;display:grid}.screen{height:100%;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);background:var(--bg);flex-direction:column;display:flex}.strip{min-height:var(--strip-h);background:var(--surface);border-bottom:2px solid var(--line);align-items:stretch;gap:8px;padding:8px;display:flex}.strip-words{background:var(--surface-2);text-align:left;border-radius:12px;flex:1;align-items:center;gap:8px;min-width:0;padding:4px 8px;display:flex;overflow:auto hidden}.strip-hint{color:var(--ink-soft);font-size:calc(1rem * var(--font-scale));font-style:italic}.chip{background:var(--surface);border:2px solid color-mix(in srgb, var(--tile-color), black 38%);border-radius:10px;flex-direction:column;flex:none;justify-content:center;align-items:center;width:64px;padding:4px;display:inline-flex}.chip-symbol{justify-content:center;align-items:center;width:44px;height:44px;display:flex;overflow:hidden}.chip-symbol img{object-fit:contain;width:100%;height:100%}.chip-symbol span{font-size:30px}.chip-label{font-size:calc(.8rem * var(--font-scale));text-align:center;color:var(--ink);margin-top:2px;line-height:1.1}.strip-actions{align-items:stretch;gap:6px;display:flex}.strip-btn{background:var(--surface-2);border:2px solid var(--line);min-width:56px;color:var(--ink);border-radius:12px;padding:0 12px;font-size:1.3rem}.strip-btn:disabled{opacity:.4}.strip-speak{background:var(--accent);color:var(--accent-ink);border-color:var(--accent);flex-direction:column;justify-content:center;align-items:center;min-width:96px;font-weight:600;display:flex}.strip-speak-icon{font-size:1.1rem}.strip-speak-text{font-size:.85rem}.strip-btn:active{transform:scale(.96)}.topbar{background:var(--bg);justify-content:space-between;align-items:center;gap:8px;padding:6px 10px;display:flex}.topbar-left,.topbar-right{align-items:center;gap:10px;display:flex}.nav-btn{background:var(--surface);border:2px solid var(--line);min-height:44px;font-size:calc(.95rem * var(--font-scale));color:var(--ink);border-radius:12px;justify-content:center;align-items:center;gap:6px;padding:8px 14px;display:inline-flex}.nav-btn:active{transform:scale(.97)}.crumb{font-size:calc(1rem * var(--font-scale));color:var(--ink-soft);flex-wrap:wrap;align-items:center;min-width:0;display:flex}.crumb-part{align-items:center;display:inline-flex}.crumb-sep{color:var(--line);margin:0 4px}.crumb-link{color:var(--ink-soft);font-size:inherit;text-overflow:ellipsis;white-space:nowrap;border-radius:6px;max-width:28vw;padding:4px 2px;overflow:hidden}.crumb-link:not(:disabled){color:var(--accent);text-decoration:underline}.crumb-link:disabled{color:var(--ink);font-weight:600}.edit-badge-pill{color:#3f6a3a;background:#e7efe4;border:1px solid #b8d3af;border-radius:999px;padding:4px 12px;font-size:.85rem;font-weight:600}.lock-btn{background:var(--surface);border:2px solid var(--line);color:var(--ink);touch-action:none;border-radius:12px;padding:8px 14px;font-size:1.2rem}.lock-btn.is-unlocked{background:var(--accent);color:var(--accent-ink);border-color:var(--accent);font-size:.95rem;font-weight:600}.lock-hint{color:var(--ink-soft);background:var(--surface-2);border-radius:8px;padding:4px 8px;font-size:.8rem}.board{gap:var(--tile-gap);padding:var(--tile-gap);flex:1;min-height:0;display:flex}.core-bar{--core-col:clamp(58px, 8.5vw, 120px);grid-template-columns:repeat(var(--core-cols,2), var(--core-col));gap:var(--tile-gap);height:100%;min-height:0;padding-right:var(--tile-gap);border-right:2px dashed var(--line);display:grid}.tile-grid{gap:var(--tile-gap);flex:1;min-width:0;min-height:0;display:grid}.tile{background:color-mix(in srgb, var(--tile-color) 16%, var(--surface));border:3px solid color-mix(in srgb, var(--tile-color), black 38%);border-radius:var(--tile-radius);-webkit-user-select:none;user-select:none;flex-direction:column;justify-content:center;align-items:center;min-width:0;min-height:0;padding:6px;transition:transform 90ms,box-shadow 90ms;display:flex;position:relative;overflow:hidden;container-type:size}.tile.is-pressing{transform:scale(.96);box-shadow:inset 0 0 0 3px #00000014}.tile.is-active{box-shadow:0 0 0 4px color-mix(in srgb, var(--tile-color) 55%, transparent);animation:.22s tile-pop}@keyframes tile-pop{0%{transform:scale(1)}40%{transform:scale(1.05)}to{transform:scale(1)}}.tile-symbol{flex:auto;justify-content:center;align-items:center;width:100%;min-height:38%;padding:2px;display:flex;overflow:hidden}.tile-symbol img{object-fit:contain;width:100%;height:100%;min-height:0}.tile-emoji{font-size:clamp(28px,6vw,64px);line-height:1}.tile-label{font-size:min(calc(1rem * var(--font-scale)), calc(var(--cell-h,120px) * .2));font-size:min(calc(1rem * var(--font-scale)), 20cqh, 28cqw);text-align:center;color:var(--ink);overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;flex:none;max-width:100%;margin-top:4px;font-weight:600;line-height:1.25;display:-webkit-box;overflow:hidden}:root[data-contrast=high] .tile{background:#fff;border-width:4px}:root[data-contrast=high] .tile-label{font-weight:700}.tile.is-folder{background:color-mix(in srgb, var(--tile-color) 24%, var(--surface))}.tile-folder-corner{background:color-mix(in srgb, var(--tile-color), black 34%);border-radius:0 0 9px;width:46%;height:17px;position:absolute;top:0;left:0}:root[data-contrast=high] .tile-folder-corner{background:#000}.tile-dwell{background:var(--tile-color);transform-origin:0;width:100%;height:7px;transition-property:transform;transition-timing-function:linear;position:absolute;bottom:0;left:0;transform:scaleX(0)}.tile-dwell[data-filling=true]{transform:scaleX(1)}.tile-hole{border-radius:var(--tile-radius);border:2px dashed #0000}.tile-empty{border:3px dashed var(--line);color:var(--ink-soft);border-radius:var(--tile-radius);background:0 0;place-items:center;min-width:0;min-height:0;display:grid}.tile-empty-plus{color:var(--ink-soft);font-size:2.4rem}.tile.is-editing{cursor:pointer}.tile-edit-badge{color:#fff;background:#0009;border-radius:8px;place-items:center;width:26px;height:26px;font-size:.9rem;display:grid;position:absolute;top:4px;left:4px}.screen.editing .board{background:repeating-linear-gradient(45deg,#0000,#0000 12px,#4a6d7c0a 12px 24px);border-radius:12px}.modal-scrim{z-index:50;background:#14141473;place-items:center;padding:16px;display:grid;position:fixed;inset:0}.modal-card{background:var(--surface);border-radius:18px;width:100%;max-height:92vh;padding:22px;overflow:auto;box-shadow:0 20px 60px #0000004d}.modal-title{color:var(--ink);margin-bottom:14px;font-size:1.4rem}.modal-footer{justify-content:space-between;align-items:center;gap:10px;margin-top:20px;display:flex}.modal-footer-right{gap:10px;display:flex}.btn,.btn-primary,.btn-ghost,.btn-danger{border:2px solid var(--line);background:var(--surface-2);color:var(--ink);border-radius:12px;padding:12px 18px;font-size:1rem;font-weight:600}.btn-primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}.btn-ghost{background:0 0}.btn-danger{border-color:var(--danger);color:var(--danger);background:#f5e3df}.btn-danger-sm{border:2px solid var(--danger);min-height:44px;color:var(--danger);background:0 0;border-radius:10px;padding:6px 14px;font-weight:600}.btn:active,.btn-primary:active,.btn-danger:active{transform:scale(.98)}.editor-grid{grid-template-columns:260px 1fr;gap:20px;display:grid}.editor-preview{--tile-color:var(--accent);border:3px solid var(--tile-color);background:color-mix(in srgb, var(--tile-color) 16%, var(--surface));border-radius:16px;flex-direction:column;justify-content:center;align-items:center;height:170px;margin-bottom:14px;display:flex}.editor-preview .tile-symbol{flex:none;height:110px}.tile-emoji-muted{color:var(--ink-soft)}.field{margin-bottom:14px;display:block}.field>span{color:var(--ink-soft);margin-bottom:6px;font-size:.9rem;font-weight:600;display:block}.field input,.editor-search,.settings select,.set-row-control input[type=text],.set-row-control select,.add-page input{border:2px solid var(--line);background:var(--surface);width:100%;color:var(--ink);border-radius:10px;padding:10px 12px;font-size:1rem}.swatches{flex-wrap:wrap;gap:8px;display:flex}.swatch{border:3px solid #0000001f;border-radius:10px;width:38px;height:38px}.swatch.selected{border-color:var(--ink);box-shadow:0 0 0 2px var(--surface), 0 0 0 4px var(--ink)}.editor-tabs{gap:6px;margin-bottom:12px;display:flex}.editor-tab{border:2px solid var(--line);background:var(--surface-2);color:var(--ink-soft);border-radius:10px 10px 0 0;padding:8px 12px;font-size:.9rem}.editor-tab.active{background:var(--surface);color:var(--ink);border-bottom-color:var(--surface);font-weight:700}.editor-panel{min-height:120px}.symbol-picker{grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:8px;max-height:260px;margin-top:10px;padding:4px;display:grid;overflow:auto}.symbol-pick{aspect-ratio:1;border:2px solid var(--line);background:var(--surface);border-radius:10px;place-items:center;padding:4px;display:grid}.symbol-pick img{object-fit:contain;max-width:100%;max-height:100%}.symbol-pick.selected{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent)}.editor-photo .photo-preview{border:2px solid var(--line);border-radius:12px;max-width:160px;margin-top:12px}.editor-cats{margin-top:16px}.cat-checks{grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:6px;display:grid}.cat-check{background:var(--surface-2);border-radius:8px;align-items:center;gap:8px;padding:6px 8px;font-size:.95rem;display:flex}.cat-check input{width:20px;height:20px}.muted{color:var(--ink-soft);font-size:.9rem;line-height:1.4}.pin-dots{justify-content:center;gap:14px;margin:8px 0 16px;display:flex}.pin-dot{border:2px solid var(--ink-soft);border-radius:50%;width:18px;height:18px}.pin-dot.filled{background:var(--accent);border-color:var(--accent)}.pin-error .pin-dot{border-color:var(--danger)}.pin-error-text{color:var(--danger);text-align:center;margin-bottom:10px}.pin-pad{grid-template-columns:repeat(3,1fr);gap:10px;display:grid}.pin-key{border:2px solid var(--line);background:var(--surface-2);color:var(--ink);border-radius:12px;padding:18px 0;font-size:1.5rem}.pin-key:active{transform:scale(.97)}.pin-key-go{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}.pin-key-muted{color:var(--ink-soft)}.pin-cancel{width:100%;margin-top:14px}.settings{grid-template-columns:220px 1fr;gap:20px;min-height:420px;display:grid}.settings-nav{border-right:2px solid var(--line);flex-direction:column;gap:6px;padding-right:16px;display:flex}.settings-title{margin-bottom:10px;font-size:1.2rem}.settings-nav-btn{text-align:left;color:var(--ink);background:0 0;border-radius:10px;padding:12px 14px;font-size:1rem}.settings-nav-btn.active{background:var(--surface-2);font-weight:700}.settings-close{margin-top:auto}.settings-body h3{margin-bottom:14px;font-size:1.2rem}.set-row{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:16px;padding:12px 0;display:flex}.set-row-label{flex-direction:column;display:flex}.set-row-label small{color:var(--ink-soft);font-size:.8rem}.set-row-control{flex:none;justify-content:flex-end;min-width:200px;display:flex}.set-row-control input[type=range]{width:220px;height:44px}.set-msg{color:var(--accent);margin:8px 0}.set-note{background:var(--surface-2);border-radius:10px;margin:6px 0 14px;padding:10px 12px;line-height:1.45}.set-note strong{color:var(--ink)}.btn-row{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.set-hr{border:none;border-top:1px solid var(--line);margin:22px 0 16px}.segmented{border:2px solid var(--line);border-radius:12px;display:inline-flex;overflow:hidden}.segmented-btn{background:var(--surface);min-height:44px;color:var(--ink);border-right:2px solid var(--line);padding:8px 14px;font-size:.9rem;font-weight:600}.segmented-btn:last-child{border-right:none}.segmented-btn.active{background:var(--accent);color:var(--accent-ink)}.set-group{border:none;margin:0;padding:0}.set-group[disabled]{opacity:.45}.set-keys{background:var(--surface-2);border-radius:12px;margin-top:16px;padding:12px 14px;line-height:1.5}.toggle{background:var(--line);border-radius:999px;width:58px;height:32px;transition:background .12s;position:relative}.toggle:before{content:"";height:44px;position:absolute;top:50%;left:0;right:0;transform:translateY(-50%)}.toggle.on{background:var(--accent)}.toggle-knob{background:#fff;border-radius:50%;width:26px;height:26px;transition:transform .12s;position:absolute;top:3px;left:3px}.toggle.on .toggle-knob{transform:translate(26px)}.page-row{border-bottom:1px solid var(--line);align-items:center;gap:14px;padding:12px 0;display:flex}.page-row-name{flex-direction:column;flex:1;display:flex}.page-row-name small{color:var(--ink-soft);font-size:.8rem}.grid-stepper{align-items:center;gap:8px;display:flex}.grid-x{color:var(--ink-soft)}.stepper{align-items:center;gap:8px;display:inline-flex}.stepper button{border:2px solid var(--line);background:var(--surface-2);width:44px;height:44px;color:var(--ink);border-radius:10px;font-size:1.4rem}.stepper b{text-align:center;min-width:24px;font-size:1.1rem}.add-page{gap:10px;margin-top:16px;display:flex}.add-page input{flex:1}.scan-box{pointer-events:none;z-index:60;border-radius:var(--tile-radius);transition:left 90ms linear,top 90ms linear,width 90ms linear,height 90ms linear;position:fixed}:root[data-motion=reduced] .scan-box{transition:none}.scan-box-row{outline:3px dashed var(--accent);outline-offset:3px;background:color-mix(in srgb, var(--accent) 8%, transparent)}.scan-box-item{box-shadow:0 0 0 3px #fff,0 0 0 7px #14313c,0 0 0 10px #fff}.scan-exit{top:calc(6px + env(safe-area-inset-top));right:calc(6px + env(safe-area-inset-right));z-index:61;color:#fff;background:#2f3a3f;border-radius:12px;min-height:44px;padding:10px 16px;font-weight:700;position:fixed;box-shadow:0 6px 18px #0000004d}.toast{left:50%;bottom:calc(16px + env(safe-area-inset-bottom));z-index:40;color:#fff;background:#2f3a3f;border-radius:14px;align-items:center;gap:14px;max-width:min(92vw,520px);padding:12px 12px 12px 18px;animation:.16s ease-out toast-in;display:flex;position:fixed;transform:translate(-50%);box-shadow:0 10px 30px #00000059}@keyframes toast-in{0%{opacity:0;transform:translate(-50%,12px)}}.toast-text{flex:1;min-width:0;font-size:1rem;line-height:1.3}.toast-btn{color:#08222c;background:#7fb0c4;border-radius:10px;flex:none;padding:8px 18px;font-size:1rem;font-weight:700}.toast-btn:disabled{opacity:.6}.toast-close{color:#cdd6da;flex:none;padding:8px 6px;font-size:1rem}:root[data-contrast=high] .toast{background:#000;border:2px solid #fff}.trash-list{flex-direction:column;gap:8px;margin:10px 0 14px;list-style:none;display:flex}.trash-row{background:var(--surface-2);border:1px solid var(--line);border-radius:12px;align-items:center;gap:12px;padding:10px 12px;display:flex}.trash-info{flex-direction:column;flex:1;min-width:0;display:flex}.trash-info strong{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.trash-info small{color:var(--ink-soft)}.trash-row .btn{flex:none;padding:8px 16px}.size-note{border-radius:999px;margin-top:2px;padding:1px 7px;font-size:.75rem;font-weight:600;display:inline-block}.size-note.ok{color:#3f6a3a;background:#e7efe4}.size-note.warn{color:#8a6415;background:#faf0d8}.size-note.bad{color:#97402c;background:#f7e0da}@media (width<=720px){.nav-btn-text{display:none}.editor-grid,.settings{grid-template-columns:1fr}.settings-nav{border-right:none;border-bottom:2px solid var(--line);flex-flow:wrap;padding-bottom:12px;padding-right:0}.settings-close{margin-top:0}}
