*{box-sizing:border-box;margin:0;padding:0}:root{--color-bg:#1a1210;--color-bg-body:#2b1f14;--color-panel:#2a1c0f;--color-panel-gradient:linear-gradient(160deg, #3a2a1a, #2a1c0f);--color-panel-light:#3a2a1a;--color-border:#4a3520;--color-border-active:#7a5c3a;--color-border-highlight:#a0804e;--color-accent:#c4944a;--color-text:#d4b896;--color-text-bright:#ffe0a0;--color-text-input:#e8d4b0;--color-text-dim:#8a6a40;--color-text-header:#c4a060;--color-text-label:#b89868;--color-danger:#c44;--color-input-bg:#1f150c;--btn-gradient:linear-gradient(180deg, #3d2b1a, #2a1c0f);--btn-gradient-hover:linear-gradient(180deg, #4d3b2a, #3a2c1f);--btn-gradient-active:linear-gradient(180deg, #5c3a1a, #3d2200);--space-xs:4px;--space-sm:8px;--space-md:12px;--space-lg:16px;--space-xl:24px;--radius:3px;--radius-md:4px;--radius-lg:6px;--font-family:"Palatino Linotype", "Book Antiqua", Palatino, Georgia, serif;--font-size-xs:10px;--font-size-sm:11px;--font-size-base:13px;--font-size-md:14px;--font-size-lg:16px;--font-size-xl:18px;--shadow-panel:0 4px 12px #00000080;--shadow-dialog:0 8px 24px #0009;--shadow-glow:0 0 12px #c4944a66;--transition-fast:.15s ease;--transition-normal:.2s ease;--toolbar-width:52px;--panel-dock-width:300px;--bottom-bar-height:32px}html,body{background:var(--color-bg-body);width:100%;height:100%;font-family:var(--font-family);overflow:hidden}#grid-canvas{top:0;left:var(--toolbar-width);width:calc(100% - var(--toolbar-width));height:calc(100% - var(--bottom-bar-height));display:block;position:fixed}#toolbar{width:var(--toolbar-width);z-index:10;background:var(--color-panel-gradient);border-right:1px solid var(--color-border);flex-direction:column;align-items:center;height:100%;padding:8px 0;display:flex;position:fixed;top:0;left:0}.toolbar-group{flex-direction:column;align-items:center;gap:4px;padding:8px 0;display:flex}.toolbar-group+.toolbar-group{border-top:1px solid var(--color-border)}.toolbar-bottom{margin-top:auto}#toolbar button{background:var(--btn-gradient);width:36px;height:36px;color:var(--color-text);border:1px solid var(--color-border-active);border-radius:var(--radius-md);cursor:pointer;transition:background var(--transition-fast), box-shadow var(--transition-fast);justify-content:center;align-items:center;padding:0;font-size:16px;display:flex}#toolbar button:hover{background:var(--btn-gradient-hover);border-color:var(--color-border-highlight)}#toolbar button.active{background:var(--btn-gradient-active);border-color:var(--color-accent);box-shadow:var(--shadow-glow);color:var(--color-text-bright)}#toolbar button.hidden{display:none}#toolbar button:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}#panel-dock{width:var(--panel-dock-width);height:calc(100% - var(--bottom-bar-height));z-index:15;transition:transform var(--transition-normal);background:var(--color-panel-gradient);border-left:1px solid var(--color-border);position:fixed;top:0;right:0;overflow-y:auto;transform:translate(100%)}#panel-dock.open{transform:translate(0)}#panel-dock:before,#panel-dock:after{content:"";z-index:1;pointer-events:none;height:8px;display:block;position:sticky}#panel-dock:before{background:linear-gradient(#0000004d,#0000);top:0}#panel-dock:after{background:linear-gradient(#0000,#0000004d);bottom:0}.dock-panel{max-height:calc(100vh - var(--bottom-bar-height) - 16px);flex-direction:column;gap:8px;padding:10px 12px;display:flex}.dock-panel.hidden{display:none}#bottom-bar{bottom:0;left:var(--toolbar-width);height:var(--bottom-bar-height);z-index:10;border-top:1px solid var(--color-border);font-size:var(--font-size-sm);color:var(--color-text-dim);background:linear-gradient(#2a1c0f,#1a1008);align-items:center;gap:16px;padding:0 12px;display:flex;position:fixed;right:0}#bottom-bar-mode{color:var(--color-text-header);white-space:nowrap;font-weight:700}#bottom-bar-help{text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}#bottom-bar-coords{white-space:nowrap;font-family:monospace;font-size:var(--font-size-xs)}.panel-title{color:var(--color-text-header);letter-spacing:.5px;text-transform:uppercase;font-size:12px;font-weight:700}.panel-hint{color:var(--color-text-dim);border-top:1px solid var(--color-border);margin-top:2px;padding-top:6px;font-size:10px;font-style:italic}.token-form-header{align-items:center;gap:8px;display:flex}.token-form-header input{background:var(--color-input-bg);color:var(--color-text-input);border:1px solid var(--color-border-active);border-radius:var(--radius);flex:1;padding:6px 8px;font-family:inherit;font-size:15px;font-weight:700}.color-dot{border:2px solid var(--color-text-header);background:#f44;border-radius:50%;flex-shrink:0;width:18px;height:18px}.token-form-row{align-items:center;gap:10px;display:flex}.token-form-row label{color:var(--color-text-label);align-items:center;gap:4px;font-size:12px;display:flex}.token-form-row select,.token-form-row input{background:var(--color-input-bg);color:var(--color-text-input);border:1px solid var(--color-border-active);border-radius:var(--radius);padding:4px 6px;font-family:inherit;font-size:13px}.token-form-row select{width:80px}.token-form-row input[type=number]{width:42px}.library-btn{background:var(--color-panel);width:100%;color:var(--color-text-header);border:1px dashed var(--color-border-active);border-radius:var(--radius);cursor:pointer;transition:background var(--transition-fast), box-shadow var(--transition-fast);padding:6px;font-family:inherit;font-size:13px}.library-btn:hover{background:var(--color-panel-light);color:var(--color-text-bright);border-color:var(--color-border-highlight)}.aoe-shapes{gap:4px;display:flex}.aoe-shape-btn{background:var(--color-panel);color:var(--color-text-label);border:1px solid var(--color-border-active);border-radius:var(--radius);cursor:pointer;text-align:center;transition:background var(--transition-fast), box-shadow var(--transition-fast);flex:1;padding:8px 0;font-size:18px}.aoe-shape-btn:hover{background:var(--color-panel-light);color:var(--color-text-bright)}.aoe-shape-btn.active{background:var(--btn-gradient-active);color:var(--color-text-bright);border-color:var(--color-accent)}.panel-library-list{flex:1;min-height:0;padding:4px 0;overflow-y:auto}.panel-details{border-top:1px solid var(--color-border);color:var(--color-text-label);flex-shrink:0;margin-top:4px;padding-top:6px;font-size:12px}.panel-details label,.panel-details input,.panel-details select{font-size:11px}.panel-close{cursor:pointer;color:#888;z-index:1;font-size:14px;position:absolute;top:4px;right:8px}.panel-close:hover{color:var(--color-text)}.panel-library-list h4,.panel-group-header{color:var(--color-text-header);text-transform:uppercase;letter-spacing:.5px;margin:8px 0 4px;font-size:11px}.panel-library-list h4:first-child{margin-top:0}.creature-item{border-radius:var(--radius);cursor:pointer;color:var(--color-text);transition:background var(--transition-fast);align-items:center;gap:6px;padding:3px 6px;font-size:12px;display:flex}.creature-item:hover{background:var(--color-panel-light)}.creature-item.active{background:var(--color-border);border:1px solid var(--color-border-active);border-left:3px solid var(--color-accent);scroll-margin:8px}.creature-swatch{border:1px solid var(--color-border-active);border-radius:50%;flex-shrink:0;width:14px;height:14px}.obj-selected{color:var(--color-text);font-size:var(--font-size-md);padding:var(--space-xs) 0;align-items:center;gap:8px;display:flex}.panel-library-list .custom-section{border-top:1px solid var(--color-border);margin-top:8px;padding-top:8px}#btn-add-custom-creature,#btn-add-custom-tile{width:100%;color:var(--color-text-label);border:1px dashed var(--color-border);border-radius:var(--radius);cursor:pointer;opacity:.7;background:0 0;margin-top:6px;padding:3px;font-family:inherit;font-size:11px}#btn-add-custom-creature:hover,#btn-add-custom-tile:hover{background:var(--color-panel-light);color:var(--color-text-bright);opacity:1}#obstacle-list .obstacle-item{border-radius:var(--radius);cursor:pointer;color:var(--color-text-header);transition:background var(--transition-fast);align-items:center;gap:8px;padding:5px 8px;font-size:13px;display:flex}#obstacle-list .obstacle-item:hover{background:var(--color-panel-light)}#obstacle-list .obstacle-item.active{background:var(--color-border);color:var(--color-text-bright);border:1px solid var(--color-border-active)}#obstacle-list .obs-swatch{border-radius:var(--radius);flex-shrink:0;width:14px;height:14px}#file-menu{z-index:25;background:var(--color-panel-gradient);border:1px solid var(--color-border-active);border-radius:var(--radius-md);min-width:180px;box-shadow:var(--shadow-panel);padding:4px 0;position:fixed;top:8px;left:56px}#file-menu.hidden{display:none}.file-menu-section{border-bottom:1px solid var(--color-border);padding:4px 0}.file-menu-section:last-child{border-bottom:none}.file-menu-section:empty{display:none}.file-menu-item{color:var(--color-text);cursor:pointer;padding:5px 14px;font-size:13px}.file-menu-item:hover{background:var(--color-border);color:var(--color-text-bright)}.file-menu-label{color:var(--color-text-dim);padding:4px 14px 2px;font-size:11px;font-style:italic}#tooltip{background:var(--color-panel);border:1px solid var(--color-border-active);border-radius:var(--radius);color:var(--color-text-input);pointer-events:none;z-index:30;white-space:nowrap;opacity:0;padding:4px 8px;font-size:12px;transition:opacity .1s;display:none;position:fixed}#tooltip.visible{opacity:1;display:block}#tooltip strong{color:var(--color-text-bright)}#dialog-backdrop{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:40;background:#0f0a05b3;position:fixed;inset:0}.dialog-sheet{opacity:0;background:var(--color-panel-gradient);border:2px solid var(--color-border-active);border-radius:var(--radius-lg);z-index:50;min-width:240px;max-width:400px;box-shadow:var(--shadow-dialog);animation:dialog-in var(--transition-normal) forwards;padding:0 16px 16px;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)scale(.95)}.dialog-sheet.hidden,.dialog-sheet[style*="display: none"]{animation:none;display:none}@keyframes dialog-in{to{opacity:1;transform:translate(-50%,-50%)scale(1)}}.dialog-header{border-bottom:2px solid var(--color-accent);justify-content:space-between;align-items:center;margin-bottom:12px;padding:12px 0 8px;display:flex}.dialog-header h4{color:var(--color-text-bright);margin:0;font-size:14px}.dialog-close{cursor:pointer;color:#aaa;font-size:16px;line-height:1}.dialog-close:hover{color:#fff}.dialog-sheet label{color:var(--color-text-header);justify-content:space-between;align-items:center;margin-bottom:8px;font-size:13px;display:flex}.dialog-sheet input,.dialog-sheet select{background:var(--color-input-bg);color:var(--color-text-input);border:1px solid var(--color-border-active);border-radius:var(--radius);padding:4px 8px;font-family:inherit;font-size:13px}.dialog-sheet input[type=color]{cursor:pointer;width:40px;height:28px;padding:2px}.dialog-sheet input[type=number]{width:60px}#save-dialog input{width:100%;margin-bottom:8px;padding:6px 8px;font-size:14px}.edit-dialog-actions{gap:8px;margin-top:12px;display:flex}.btn-primary,.edit-dialog-actions button:first-child{border-radius:var(--radius);border:1px solid var(--color-accent);background:var(--btn-gradient-active);color:var(--color-text-bright);cursor:pointer;transition:background var(--transition-fast), box-shadow var(--transition-fast);flex:1;padding:6px;font-family:inherit;font-size:13px}.btn-secondary,.edit-dialog-actions button:last-child{border-radius:var(--radius);border:1px solid var(--color-border-active);background:var(--color-panel);color:var(--color-text-label);cursor:pointer;transition:background var(--transition-fast), box-shadow var(--transition-fast);flex:1;padding:6px;font-family:inherit;font-size:13px}#help-dialog{max-width:420px;max-height:80vh;overflow-y:auto}#help-dialog .help-content{padding:10px 14px}#help-dialog details{border-bottom:1px solid var(--color-border);margin-bottom:4px;padding-bottom:4px}#help-dialog details:last-child{border-bottom:none}#help-dialog details[open]{margin-bottom:6px;padding-bottom:6px}#help-dialog summary{cursor:pointer;color:var(--color-text-header);padding:4px 0;font-size:13px;font-weight:700}#help-dialog p{color:var(--color-text);margin:2px 0 2px 6px;font-size:12.5px;line-height:1.5}#help-dialog .help-overview p{margin:4px 0;font-size:12px}#help-dialog kbd{background:var(--color-border);border:1px solid var(--color-border-active);border-radius:var(--radius);color:var(--color-text-input);padding:1px 4px;font-family:inherit;font-size:11px}#open-dialog{max-height:60vh;overflow-y:auto}#open-list{margin:8px 0}.open-item{color:var(--color-text);cursor:pointer;border-radius:var(--radius);padding:6px 10px;font-size:13px}.open-item:hover{background:var(--color-border);color:var(--color-text-bright)}#context-menu{z-index:10002;background:var(--color-panel-gradient);border:1px solid var(--color-border-active);border-radius:var(--radius-md);min-width:160px;box-shadow:var(--shadow-panel);padding:4px 0;position:fixed}#context-menu.hidden{display:none}#context-menu button{width:100%;color:var(--color-text);text-align:left;cursor:pointer;background:0 0;border:none;padding:6px 14px;font-family:inherit;font-size:13px;display:block}#context-menu button:hover{background:var(--color-border);color:var(--color-text-bright)}#context-menu .ctx-separator{border-top:1px solid #5a4020;margin:3px 0}#damage-dialog{z-index:250;background:var(--color-panel);border:1px solid var(--color-border-active);border-radius:var(--radius-md);align-items:center;gap:8px;padding:6px 10px;display:flex;position:fixed}#damage-dialog.hidden{display:none}#dmg-label{color:var(--color-text-header);white-space:nowrap;font-size:13px}#dmg-input{background:var(--color-input-bg);width:50px;color:var(--color-text-input);border:1px solid var(--color-border-active);border-radius:var(--radius);padding:4px 6px;font-family:inherit;font-size:14px}#dmg-ok{color:#fcc;border-radius:var(--radius);cursor:pointer;background:linear-gradient(#8b2020,#5a1010);border:1px solid #a33;padding:4px 10px;font-family:inherit;font-size:13px}.initiative-bar{bottom:0;left:var(--toolbar-width);border-top:1px solid var(--color-border-active);color:var(--color-text);z-index:200;pointer-events:auto;background:linear-gradient(#2a1c0f,#1a1008);align-items:center;gap:4px;padding:8px 12px 6px;font-size:14px;display:flex;position:fixed;right:0;overflow-x:auto}.initiative-bar.hidden{display:none}.init-round{white-space:nowrap;margin-right:8px;font-weight:700}.init-card{border-radius:var(--radius-md);white-space:nowrap;cursor:context-menu;background:#ffffff0d;border:1px solid #5a4020;flex-direction:column;justify-content:center;align-items:center;min-width:48px;height:60px;padding:4px 8px;transition:transform .2s,box-shadow .2s;display:flex;position:relative;overflow:hidden}.init-card.active{background:#ffc83226;border-color:#ffc61a;animation:2s ease-in-out infinite pulse-ring;transform:scale(1.12);box-shadow:0 0 12px #ffc83280}.init-card.dead{opacity:.6;filter:grayscale(.5);border-style:dashed;border-color:#444}.init-card.delayed{border-style:dashed;font-style:italic}.init-token-dot{border:2px solid #ffffff4d;border-radius:50%;width:20px;height:20px;margin-bottom:2px}.init-token-dot.diamond{border-radius:3px;width:16px;height:16px;transform:rotate(45deg)}.init-name{text-overflow:ellipsis;max-width:64px;font-size:11px;overflow:hidden}.init-badges{opacity:.85;font-size:10px}.init-ini{background:#000000b3;border-radius:8px;padding:1px 4px;font-size:9px;line-height:1.2;position:absolute;top:-5px;right:-5px}.init-btn{background:var(--btn-gradient);color:var(--color-text);border:1px solid var(--color-border-active);border-radius:var(--radius);cursor:pointer;margin-left:auto;padding:4px 10px;font-size:16px}.init-btn:hover{border-color:var(--color-border-highlight)}.combat-start-dialog{background:var(--color-panel);border:2px solid var(--color-border-active);z-index:10001;min-width:300px;max-height:80vh;color:var(--color-text);border-radius:8px;padding:16px;font-family:inherit;position:fixed;top:50%;left:50%;overflow-y:auto;transform:translate(-50%,-50%)}.combat-start-dialog h4{color:var(--color-text-bright);margin-bottom:12px}.combat-init-list{flex-direction:column;gap:6px;margin-bottom:12px;display:flex}.combat-init-row{align-items:center;gap:8px;display:flex}.combat-init-name{flex:1}.combat-init-input{width:50px;color:var(--color-text);border-radius:var(--radius);text-align:center;background:#1a1008;border:1px solid #5a4020;padding:3px 6px}#nav-controls{z-index:10;-webkit-user-select:none;user-select:none;transition:right var(--transition-normal);flex-direction:column;align-items:center;gap:8px;display:flex;position:fixed;bottom:56px;right:16px}body:has(#panel-dock.open) #nav-controls{right:calc(var(--panel-dock-width) + 16px)}#compass{border:2px solid var(--color-border-active);cursor:grab;background:radial-gradient(circle,#3a2a1a,#2a1c0f);border-radius:50%;justify-content:center;align-items:center;width:48px;height:48px;display:flex;box-shadow:0 2px 8px #0006}#compass:hover{border-color:var(--color-accent)}#compass-needle{color:#c33;text-shadow:0 0 4px #c8323280;font-size:16px;font-weight:700;transition:transform .2s}#zoom-control{flex-direction:column;align-items:center;gap:4px;display:flex}.zoom-btn{background:var(--btn-gradient);border:2px solid var(--color-border-active);border-radius:var(--radius);width:28px;height:28px;color:var(--color-text);cursor:pointer;touch-action:none;justify-content:center;align-items:center;font-size:16px;font-weight:700;line-height:1;display:flex}.zoom-btn:hover{border-color:var(--color-accent);background:var(--btn-gradient-hover)}.zoom-track{background:var(--color-input-bg);border:1px solid var(--color-border-active);border-radius:var(--radius-md);cursor:pointer;touch-action:none;width:8px;height:120px;position:relative}.zoom-thumb{background:var(--color-accent);border-radius:var(--radius);cursor:grab;touch-action:none;width:18px;height:10px;margin-top:-5px;position:absolute;left:-5px}.zoom-thumb:hover{background:#e0b060}#admin-overlay{z-index:100;background:linear-gradient(160deg,#2a1c0f,#1a1008);flex-direction:column;display:flex;position:fixed;inset:0;overflow:hidden}#admin-overlay.hidden{display:none}.admin-header{border-bottom:1px solid var(--color-border);justify-content:space-between;align-items:center;padding:12px 20px;display:flex}.admin-header h2{color:var(--color-text-bright);margin:0;font-size:18px}#admin-close{border:1px solid var(--color-border-active);color:var(--color-text);border-radius:var(--radius-md);cursor:pointer;background:0 0;width:32px;height:32px;font-size:18px;line-height:1}#admin-close:hover{background:var(--color-panel-light);color:var(--color-text-bright)}.admin-tabs{border-bottom:1px solid var(--color-border);gap:0;padding:0 20px;display:flex}.admin-tab{color:var(--color-text-label);cursor:pointer;background:0 0;border:none;border-bottom:2px solid #0000;padding:10px 16px;font-family:inherit;font-size:14px}.admin-tab:hover{color:var(--color-text-bright)}.admin-tab.active{color:var(--color-text-bright);border-bottom-color:var(--color-accent)}.admin-content{flex:1;padding:16px 20px;overflow-y:auto}.admin-tab-panel{display:block}.admin-tab-panel.hidden{display:none}.admin-footer{border-top:1px solid var(--color-border);gap:8px;padding:12px 20px;display:flex}.admin-footer button{background:var(--btn-gradient);color:var(--color-text);border:1px solid var(--color-border-active);border-radius:var(--radius);cursor:pointer;padding:8px 14px;font-family:inherit;font-size:13px}.admin-footer button:hover{background:var(--btn-gradient-hover);border-color:var(--color-border-highlight);color:var(--color-text-bright)}.admin-table{border-collapse:collapse;width:100%;font-size:13px}.admin-table th{text-align:left;color:var(--color-text-header);text-transform:uppercase;letter-spacing:.5px;border-bottom:1px solid var(--color-border);padding:6px 8px;font-size:11px}.admin-table td{color:var(--color-text);border-bottom:1px solid var(--color-panel);padding:5px 8px}.admin-table tr:hover td{background:var(--color-panel-light)}.admin-table input,.admin-table select{background:var(--color-input-bg);color:var(--color-text-input);border:1px solid var(--color-border-active);border-radius:var(--radius);padding:3px 6px;font-family:inherit;font-size:12px}.admin-table input[type=color]{cursor:pointer;width:28px;height:22px;padding:1px}.admin-table input[type=number]{width:50px}.admin-table input[type=text]{width:120px}.admin-table .btn-del{color:#844;cursor:pointer;background:0 0;border:none;font-size:14px}.admin-table .btn-del:hover{color:#f44}.admin-add-btn{background:var(--color-panel);color:var(--color-text-header);border:1px dashed var(--color-border-active);border-radius:var(--radius);cursor:pointer;margin-top:10px;padding:8px 14px;font-family:inherit;font-size:13px}.admin-add-btn:hover{background:var(--color-panel-light);color:var(--color-text-bright)}.admin-map-item{border-bottom:1px solid var(--color-panel);color:var(--color-text);align-items:center;gap:10px;padding:8px 10px;font-size:13px;display:flex}.admin-map-item:hover{background:var(--color-panel-light)}.admin-map-item input{background:var(--color-input-bg);color:var(--color-text-input);border:1px solid var(--color-border-active);border-radius:var(--radius);flex:1;padding:4px 8px;font-family:inherit;font-size:13px}.admin-map-item button{color:#844;cursor:pointer;background:0 0;border:none;font-size:14px}.admin-map-item button:hover{color:#f44}.admin-filter{gap:8px;margin-bottom:10px;display:flex}.admin-filter input[type=text]{background:var(--color-input-bg);color:var(--color-text-input);border:1px solid var(--color-border-active);border-radius:var(--radius);flex:1;padding:6px 10px;font-family:inherit;font-size:13px}.admin-filter select{background:var(--color-input-bg);color:var(--color-text-input);border:1px solid var(--color-border-active);border-radius:var(--radius);padding:6px 8px;font-family:inherit;font-size:13px}#admin-prompt-dialog{z-index:110;background:#0f0a05b3;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}#admin-prompt-dialog.hidden{display:none}.admin-prompt-inner{background:var(--color-panel-gradient);border:2px solid var(--color-border-active);border-radius:var(--radius-lg);min-width:280px;box-shadow:var(--shadow-dialog);padding:16px}.admin-prompt-inner h4{color:var(--color-text-bright);margin:0 0 12px;font-size:14px}.admin-prompt-inner input{background:var(--color-input-bg);width:100%;color:var(--color-text-input);border:1px solid var(--color-border-active);border-radius:var(--radius);padding:8px 10px;font-family:inherit;font-size:14px}body.display-mode{background:#000}body.display-mode #toolbar,body.display-mode #panel-dock,body.display-mode #bottom-bar,body.display-mode #dialog-backdrop,body.display-mode #save-dialog,body.display-mode #confirm-dialog,body.display-mode #open-dialog,body.display-mode #help-dialog,body.display-mode #compass,body.display-mode #zoom-control,body.display-mode .zoom-controls,body.display-mode .nav-controls{display:none!important}body.display-mode #grid-canvas{width:100%;height:100%;left:0;box-shadow:inset 0 0 80px 40px #000000b3}body.display-mode .initiative-bar{background:linear-gradient(#0000 0%,#0009 30%,#1a1008 100%);height:auto;padding:10px 16px;font-size:18px;font-weight:700;left:0}body.display-mode .init-card{min-width:60px;padding:8px 12px}body.display-mode .init-token-dot{width:28px;height:28px}body.display-mode .init-name{max-width:80px;font-size:14px}body.display-mode .init-ini{display:none}body.display-mode .init-card.active{border-width:2px;border-color:var(--color-accent);animation:2s ease-in-out infinite pulse-ring;box-shadow:0 0 16px #ffc83299}@keyframes pulse-ring{0%,to{box-shadow:0 0 8px #ffc83266}50%{box-shadow:0 0 20px #ffc832cc}}#btn-beamer{position:relative}#btn-beamer.connected:after{content:"";background:#1ae65e;border-radius:50%;width:8px;height:8px;position:absolute;top:3px;right:3px}#btn-viewport-link.unlinked{color:#e46767;box-shadow:0 0 4px 1px #d92626;border-color:#d92626!important}#display-wait{color:var(--color-text);font-size:2rem;font-family:var(--font-family);z-index:10000;background:#000;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.display-controls{z-index:10001;flex-direction:column;align-items:center;gap:8px;display:flex;position:fixed;bottom:80px;right:16px}.display-controls.disabled{opacity:.35;pointer-events:none}.display-compass{border:2px solid var(--color-border-active);cursor:grab;background:radial-gradient(circle,#3a2a1a,#2a1c0f);border-radius:50%;justify-content:center;align-items:center;width:48px;height:48px;display:flex;box-shadow:0 2px 8px #0006}.display-compass:hover{border-color:var(--color-accent)}.display-compass .compass-needle{color:#c33;text-shadow:0 0 4px #c8323280;font-size:16px;font-weight:700;transition:transform .2s}.display-zoom{flex-direction:column;align-items:center;gap:4px;display:flex}.display-zoom button{background:var(--btn-gradient);border:2px solid var(--color-border-active);border-radius:var(--radius);width:28px;height:28px;color:var(--color-text);cursor:pointer;justify-content:center;align-items:center;font-size:16px;font-weight:700;display:flex}.display-zoom button:hover{border-color:var(--color-accent)}button{transition:background var(--transition-fast), box-shadow var(--transition-fast)}button:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}.hidden{display:none}