:root{--md-primary: #f7c231;--md-on-primary: #2b1d00;--md-primary-container: #ffe9a8;--md-on-primary-container: #2b1d00;--md-secondary-container: #f3e6c6;--md-on-secondary-container: #3a2f0f;--md-surface: #fffbf2;--md-surface-container-low: #faf3e2;--md-surface-container: #f5edd8;--md-surface-container-high: #efe4c8;--md-on-surface: #1d1b16;--md-on-surface-variant: #4c4736;--md-outline: #7d7666;--md-outline-variant: #d0c6a8;--md-error: #b3261e;--md-on-error: #ffffff;--md-scrim: rgba(0, 0, 0, .32);--md-elev-1: 0 1px 2px rgba(0, 0, 0, .3), 0 1px 3px 1px rgba(0, 0, 0, .15);--md-elev-2: 0 1px 2px rgba(0, 0, 0, .3), 0 2px 6px 2px rgba(0, 0, 0, .15);--md-elev-3: 0 4px 8px 3px rgba(0, 0, 0, .15), 0 1px 3px rgba(0, 0, 0, .3);--md-shape-xs: 4px;--md-shape-s: 8px;--md-shape-m: 12px;--md-shape-l: 16px;--md-shape-xl: 28px;--md-shape-full: 999px;--md-ease-standard: cubic-bezier(.2, 0, 0, 1);--md-dur-short: .15s;--md-dur-medium: .3s;--dock-height: 28dvh;--dock-min-height: 240px;--patreon-btn-bg: #121212;--patreon-btn-fg: #ffffff;--owner-link-color: #2c2a1e;--supporter-gradient: linear-gradient(90deg, #c2680d, #2b1d00)}@media(prefers-color-scheme:dark){:root{--md-primary: #f7c231;--md-on-primary: #2b1d00;--md-primary-container: #6b5000;--md-on-primary-container: #ffe9a8;--md-secondary-container: #4c4526;--md-on-secondary-container: #f3e6c6;--md-surface: #16140e;--md-surface-container-low: #1d1b13;--md-surface-container: #211f16;--md-surface-container-high: #2c2a1e;--md-on-surface: #e9e4d4;--md-on-surface-variant: #d0c6a8;--md-outline: #999076;--md-outline-variant: #4c4736;--patreon-btn-bg: #ffffff;--patreon-btn-fg: #121212;--owner-link-color: var(--md-primary);--supporter-gradient: linear-gradient(90deg, #ffe9a8, #c2680d)}}:root[data-theme=dark]{--md-primary: #f7c231;--md-on-primary: #2b1d00;--md-primary-container: #6b5000;--md-on-primary-container: #ffe9a8;--md-secondary-container: #4c4526;--md-on-secondary-container: #f3e6c6;--md-surface: #16140e;--md-surface-container-low: #1d1b13;--md-surface-container: #211f16;--md-surface-container-high: #2c2a1e;--md-on-surface: #e9e4d4;--md-on-surface-variant: #d0c6a8;--md-outline: #999076;--md-outline-variant: #4c4736;--patreon-btn-bg: #ffffff;--patreon-btn-fg: #121212;--owner-link-color: var(--md-primary);--supporter-gradient: linear-gradient(90deg, #ffe9a8, #c2680d)}:root[data-theme=light]{--md-primary: #f7c231;--md-on-primary: #2b1d00;--md-primary-container: #ffe9a8;--md-on-primary-container: #2b1d00;--md-secondary-container: #f3e6c6;--md-on-secondary-container: #3a2f0f;--md-surface: #fffbf2;--md-surface-container-low: #faf3e2;--md-surface-container: #f5edd8;--md-surface-container-high: #efe4c8;--md-on-surface: #1d1b16;--md-on-surface-variant: #4c4736;--md-outline: #7d7666;--md-outline-variant: #d0c6a8;--patreon-btn-bg: #121212;--patreon-btn-fg: #ffffff;--owner-link-color: #2c2a1e;--supporter-gradient: linear-gradient(90deg, #c2680d, #2b1d00)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;height:100%;overflow:hidden;overscroll-behavior:none;font-family:Roboto,system-ui,-apple-system,Segoe UI,sans-serif;color:var(--md-on-surface);background:var(--md-surface)}#app{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column}#stage{position:relative;flex:1;min-height:0}.not-found{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;font-size:18px;color:var(--md-on-surface-variant)}.not-found[hidden]{display:none}.canvas{display:block;width:100%;height:100%;touch-action:none;cursor:default}.canvas.panning{cursor:grabbing}.canvas.armed{cursor:crosshair}#topbar{position:absolute;top:calc(12px + env(safe-area-inset-top));left:calc(12px + env(safe-area-inset-left));right:calc(12px + env(safe-area-inset-right));display:flex;gap:8px;align-items:center;pointer-events:none}.status{display:none}.status[data-state=spectator]{pointer-events:auto;display:inline-flex;align-items:center;gap:8px;background:var(--md-surface-container-high);border-radius:var(--md-shape-full);padding:8px 14px;font-size:13px;color:var(--md-on-surface-variant)}.status .dot{width:8px;height:8px;border-radius:50%;background:#ef6c00}.topbar-pill-slot:empty{display:none}#topbar .icon-btn,#topbar .pill{pointer-events:auto}#settings-entry{background:var(--md-surface-container-high)}.dock-shell{z-index:25;background:var(--md-surface-container);border-top-left-radius:var(--md-shape-l);border-top-right-radius:var(--md-shape-l);box-shadow:var(--md-elev-3);display:flex;flex-direction:column;transition:height var(--md-dur-medium) var(--md-ease-standard);height:calc(72px + env(safe-area-inset-bottom));overflow:hidden;padding-bottom:env(safe-area-inset-bottom)}#dock.dock-shell{position:fixed;left:0;right:0;bottom:0}.canvas-modal-card .dock-shell{position:absolute;left:0;right:0;bottom:0}.dock-shell.expanded{height:calc(max(var(--dock-height),var(--dock-min-height)) + env(safe-area-inset-bottom))}.dock-bar{display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding:10px 12px;min-height:72px;flex:0 0 auto}.handle{width:32px;height:4px;border-radius:var(--md-shape-full);background:var(--md-outline-variant);position:absolute;top:6px;left:50%;transform:translate(-50%)}.recents{display:flex;gap:4px;flex:0 1 auto;min-width:0;overflow-x:auto;scrollbar-width:none;padding-left:4px;padding-top:4px;padding-bottom:4px}.recents::-webkit-scrollbar{display:none}.emoji-btn{flex:0 0 auto;width:44px;height:44px;border:none;border-radius:var(--md-shape-m);background:transparent;cursor:pointer;padding:4px;display:grid;place-items:center;place-content:center;transition:background var(--md-dur-short) var(--md-ease-standard);-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.emoji-btn:hover{background:var(--md-surface-container-high)}.emoji-btn[aria-pressed=true]{background:var(--md-primary-container);outline:2px solid var(--md-primary)}.emoji-btn.paid{position:relative;filter:grayscale(1);opacity:.45;cursor:not-allowed}.emoji-btn.paid:after{content:"🔒";position:absolute;right:2px;bottom:0;font-size:11px;filter:none}.emoji-sprite{width:36px;height:36px;image-rendering:auto}.pill{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;gap:6px;background:var(--md-primary);border-radius:var(--md-shape-full);padding:10px 16px;font-size:14px;font-variant-numeric:tabular-nums;color:var(--md-on-primary)}.pill:has(>span[hidden]){width:44px;height:44px;padding:0}.pill strong{color:var(--md-on-primary);font-size:19px}.btn{flex:0 0 auto;border:none;border-radius:var(--md-shape-full);padding:10px 20px;font-size:14px;font-weight:500;font-family:inherit;cursor:pointer;background:var(--md-primary);color:var(--md-on-primary);transition:filter var(--md-dur-short) var(--md-ease-standard)}.btn:disabled{background:var(--md-surface-container-high);color:var(--md-on-surface-variant);cursor:default;opacity:.6}.btn:not(:disabled):hover{filter:brightness(1.08)}.btn.tonal{background:var(--md-secondary-container);color:var(--md-on-secondary-container)}.icon-btn{flex:0 0 auto;width:44px;height:44px;border:none;border-radius:var(--md-shape-full);background:transparent;color:var(--md-on-surface-variant);display:grid;place-items:center;cursor:pointer}.icon-btn:hover{background:var(--md-surface-container-high)}.icon-btn[aria-pressed=true]{background:var(--md-primary-container);color:var(--md-on-primary-container);outline:2px solid var(--md-primary)}.icon-btn svg,.field-icon svg,.category svg,.icon-inline svg{width:20px;height:20px;stroke:currentColor}.icon-inline{display:inline-flex;vertical-align:middle;margin-right:4px}.icon-inline svg{width:16px;height:16px}.category svg{width:22px;height:22px}.dock-body{flex:1;min-height:0;display:flex;flex-direction:column;padding:0 12px 12px}.dock-body-controls{display:flex;align-items:center;gap:8px;flex:0 0 auto;padding-bottom:8px}.dock-body-controls:empty{display:none}.dock-body-controls .search-field{flex:1;min-width:0}.dock-body-row{flex:1;min-height:0;display:flex;flex-direction:row;gap:8px}.search-field{display:flex;align-items:center;gap:8px;background:var(--md-surface-container-high);border-radius:var(--md-shape-full);padding:0 16px;height:48px;flex:1 1 200px;min-width:0}.field-icon{display:flex;flex:0 0 auto;color:var(--md-on-surface-variant)}.search-field input{flex:1;border:none;background:transparent;outline:none;font:inherit;font-size:15px;color:var(--md-on-surface)}.categories{display:flex;flex-direction:column;gap:2px;flex:0 0 auto;overflow-y:auto;scrollbar-width:none;padding-right:6px;border-right:1px solid var(--md-outline-variant)}.categories::-webkit-scrollbar,.recents::-webkit-scrollbar{display:none}.category{flex:0 0 auto;width:40px;height:36px;border:none;background:transparent;color:var(--md-on-surface-variant);border-radius:var(--md-shape-s);cursor:pointer;display:grid;place-items:center;padding:0;transition:background var(--md-dur-short) var(--md-ease-standard)}.category:hover{background:var(--md-surface-container-high)}.category[aria-selected=true]{background:var(--md-secondary-container);color:var(--md-on-secondary-container)}html[data-shell=mobile] .dock-bar{row-gap:6px;padding:8px 10px;min-height:0}html[data-shell=mobile] .recents{flex:1 1 0}html[data-shell=mobile] .btn{padding:9px 14px}html[data-shell=mobile] .canvas-modal-card{width:100vw;height:100dvh;border-radius:0}.emoji-grid{flex:1;min-height:0;overflow-y:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(48px,1fr));gap:2px;align-content:start;padding-left:4px;padding-top:4px}.eraser-slot{flex:0 0 auto}.owner-panel{position:fixed;left:calc(12px + env(safe-area-inset-left));right:calc(12px + env(safe-area-inset-right));max-width:360px;z-index:24;display:flex;align-items:center;gap:12px;background:var(--md-surface-container-high);border-radius:var(--md-shape-l);box-shadow:var(--md-elev-2);padding:10px 12px;transform:translateY(calc(100% + 12px));transition:transform var(--md-dur-medium) var(--md-ease-standard),opacity var(--md-dur-short) var(--md-ease-standard);opacity:0;visibility:hidden;pointer-events:none}.canvas-modal-card .owner-panel{position:absolute}.owner-panel.visible{transform:translateY(0);opacity:1;visibility:visible;pointer-events:auto}.owner-panel-avatar{flex:0 0 auto;width:36px;height:36px;border-radius:50%;background:var(--md-surface-container-high);border:1px solid var(--md-outline-variant);display:grid;place-items:center;font-size:18px}.owner-panel-info{flex:1;min-width:0}.owner-panel-name{font-size:14px;font-weight:500;color:var(--md-on-surface);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.owner-panel-link{font-size:12px;color:var(--owner-link-color);text-decoration:none}.owner-panel-link:hover{text-decoration:underline}.tone-popup{position:absolute;display:flex;gap:4px;background:var(--md-surface-container-high);border-radius:var(--md-shape-m);padding:6px;box-shadow:var(--md-elev-3);z-index:20}#snackbar{position:absolute;left:50%;bottom:16px;transform:translate(-50%) translateY(120%);background:#322f35;color:#f5eff7;border-radius:var(--md-shape-xs);padding:14px 16px;font-size:14px;box-shadow:var(--md-elev-3);transition:transform var(--md-dur-medium) var(--md-ease-standard),opacity var(--md-dur-short) var(--md-ease-standard);z-index:30;max-width:90vw;opacity:0;visibility:hidden;pointer-events:none}#snackbar.visible{transform:translate(-50%) translateY(0);opacity:1;visibility:visible}#snackbar.has-action{display:flex;align-items:center;gap:4px;padding-right:8px}.snackbar-action{pointer-events:auto;flex:0 0 auto;padding:6px 8px;border-radius:var(--md-shape-xs);color:#d0bcff;font-weight:600;text-decoration:none;white-space:nowrap}.snackbar-action:hover{background:#d0bcff1f}.topbar-spacer{flex:1}.identity{pointer-events:auto;display:flex;align-items:center;gap:8px}.signin-btn{background:var(--md-surface-container-high);color:var(--md-on-surface);border-radius:var(--md-shape-full);padding:8px 16px;font-size:13px;text-decoration:none}.signin-btn{background:var(--md-primary);color:var(--md-on-primary);font-weight:500}.modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:40;display:grid;place-items:center;background:var(--md-scrim)}.modal[hidden]{display:none}.modal-card{width:min(420px,calc(100vw - 32px));background:var(--md-surface-container-low);border-radius:var(--md-shape-xl);padding:24px}.modal-card h2{margin:0 0 8px;font-size:22px;font-weight:500}.modal-card p{margin:0 0 20px;font-size:14px;line-height:1.5;color:var(--md-on-surface-variant)}.handle-field{display:flex;align-items:center;gap:4px;background:var(--md-surface-container-high);border-radius:var(--md-shape-s);padding:0 16px;height:52px;color:var(--md-on-surface-variant);font-size:17px}.handle-field input{flex:1;min-width:0;border:none;background:transparent;outline:none;font:inherit;font-size:17px;color:var(--md-on-surface)}.handle-hint{min-height:20px;padding:6px 4px 0;font-size:13px;color:var(--md-on-surface-variant)}.handle-hint[data-state=ok]{color:#2e7d32}.handle-hint[data-state=bad]{color:var(--md-error)}.modal-card .btn{width:100%;margin-top:12px;padding:14px;font-size:15px}.legal-consent{margin:12px 0 0;font-size:12px;line-height:1.5;color:var(--md-on-surface-variant);text-align:center}.legal-consent a{color:var(--md-on-surface-variant);text-decoration:underline}.supporter-badge{margin-left:4px;font-weight:600;font-size:.85em;background:var(--supporter-gradient);background-clip:text;-webkit-background-clip:text;color:transparent;-webkit-text-fill-color:transparent}.canvas-modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:40;display:grid;place-items:center;background:var(--md-scrim)}.canvas-modal[hidden]{display:none}.canvas-modal-card{position:relative;width:min(1100px,90vw);height:90dvh;background:var(--md-surface);border-radius:var(--md-shape-xl);overflow:hidden}html[data-shell=desktop] #personal-modal .canvas-modal-card{width:min(1600px,94vw);height:94dvh}.canvas-modal-stage{position:absolute;top:0;right:0;bottom:0;left:0}.canvas-modal-close{position:absolute;top:calc(12px + env(safe-area-inset-top));right:calc(12px + env(safe-area-inset-right));z-index:45;background:var(--md-surface-container-high)}.canvas-modal-share,.canvas-modal-info{position:absolute;top:calc(64px + env(safe-area-inset-top));right:calc(12px + env(safe-area-inset-right));z-index:45;background:var(--md-surface-container-high)}#personal-modal .canvas-modal-info{top:calc(116px + env(safe-area-inset-top))}#info-modal{z-index:50}#info-modal .modal-card{max-height:calc(100dvh - 32px);overflow-y:auto}.canvas-modal-topbar{position:absolute;top:calc(12px + env(safe-area-inset-top));left:calc(12px + env(safe-area-inset-left));z-index:45}.canvas-modal-topbar:empty{display:none}body.modal-open #dock,body.modal-open #owner-panel{display:none}.account-modal-card{display:flex;flex-direction:column}.account-modal-scroll{flex:1;min-height:0;overflow-y:auto;padding:24px}.account-modal-scroll>*{max-width:480px;width:100%;margin-left:auto;margin-right:auto}.account-modal-scroll .account-logo{display:block;width:64px;height:64px;margin:0 auto 12px}.account-modal-scroll h1{font-size:20px;margin-top:8px;margin-bottom:16px}.account-modal-scroll h2{font-size:15px;font-weight:600;color:var(--md-on-surface-variant);margin-top:32px;margin-bottom:12px}.account-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px;margin-bottom:12px;background:var(--md-surface-container-low);border-radius:var(--md-shape-m)}.account-row[hidden]{display:none}.account-row p{margin:4px 0 0;font-size:13px;color:var(--md-on-surface-variant)}.patreon-cta-title{font-size:17px;font-weight:700}.patreon-cta-detail{font-weight:400}.patreon-btn{display:inline-flex;align-items:center;flex:0 0 auto;padding:10px 18px;border-radius:10px;background:var(--patreon-btn-bg);color:var(--patreon-btn-fg)}.patreon-btn svg{width:100px;height:auto;display:block}.theme-toggle{display:inline-flex;align-items:center;gap:6px}.segmented{display:inline-flex;background:var(--md-surface-container-high);border-radius:var(--md-shape-full);padding:3px;gap:2px}.segmented-btn{border:none;background:transparent;color:var(--md-on-surface-variant);font:inherit;font-size:13px;padding:6px 12px;border-radius:var(--md-shape-full);cursor:pointer}.segmented-btn[aria-pressed=true]{background:var(--md-primary);color:var(--md-on-primary)}.legal-links{display:flex;flex-direction:column;gap:8px;margin-top:24px;padding-top:16px;border-top:1px solid var(--md-outline-variant)}.legal-links a{display:flex;align-items:center;font-size:13px;color:var(--md-on-surface-variant);text-decoration:none}.legal-links a:hover{text-decoration:underline}