@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@500&display=swap";:root,[data-theme=dark]{--surface-0: #0a0e17;--surface-1: #111827;--surface-2: #1e2536;--surface-3: #2a3349;--glass-bg: rgba(17, 24, 39, .72);--glass-bg-strong: rgba(17, 24, 39, .92);--border-subtle: rgba(148, 163, 184, .1);--border-strong: rgba(148, 163, 184, .18);--border-accent: rgba(99, 102, 241, .35);--text-primary: #f1f5f9;--text-secondary: #94a3b8;--text-muted: #64748b;--text-on-accent: #ffffff;--accent: #6366f1;--accent-hover: #818cf8;--accent-glow: rgba(99, 102, 241, .35);--accent-subtle: rgba(99, 102, 241, .12);--danger: #f43f5e;--danger-bg: rgba(244, 63, 94, .12);--success: #10b981;--success-bg: rgba(16, 185, 129, .1);--warning: #f59e0b;--warning-bg: rgba(245, 158, 11, .1);--info: #38bdf8;--canvas-bg: var(--surface-0);--canvas-grid: rgba(148, 163, 184, .15);--canvas-aurora-1: rgba(99, 102, 241, .08);--canvas-aurora-2: rgba(244, 63, 94, .05);--canvas-aurora-3: rgba(16, 185, 129, .04);--shadow-sm: 0 2px 8px rgba(0, 0, 0, .2);--shadow-md: 0 6px 20px rgba(0, 0, 0, .3), 0 2px 6px rgba(0, 0, 0, .2);--shadow-lg: 0 12px 40px rgba(0, 0, 0, .5), 0 4px 12px rgba(0, 0, 0, .25);--shadow-glow: 0 0 24px var(--accent-glow);--shadow-color-rgb: 0, 0, 0}[data-theme=light]{--surface-0: #f8fafc;--surface-1: #ffffff;--surface-2: #f1f5f9;--surface-3: #e2e8f0;--glass-bg: rgba(255, 255, 255, .78);--glass-bg-strong: rgba(255, 255, 255, .94);--border-subtle: rgba(15, 23, 42, .06);--border-strong: rgba(15, 23, 42, .12);--border-accent: rgba(79, 70, 229, .3);--text-primary: #0f172a;--text-secondary: #475569;--text-muted: #94a3b8;--text-on-accent: #ffffff;--accent: #4f46e5;--accent-hover: #6366f1;--accent-glow: rgba(79, 70, 229, .25);--accent-subtle: rgba(79, 70, 229, .08);--danger: #e11d48;--danger-bg: rgba(225, 29, 72, .08);--success: #059669;--success-bg: rgba(5, 150, 105, .08);--warning: #d97706;--warning-bg: rgba(217, 119, 6, .08);--info: #0284c7;--canvas-bg: #f8fafc;--canvas-grid: rgba(15, 23, 42, .08);--canvas-aurora-1: rgba(79, 70, 229, .05);--canvas-aurora-2: rgba(225, 29, 72, .03);--canvas-aurora-3: rgba(5, 150, 105, .025);--shadow-sm: 0 1px 3px rgba(15, 23, 42, .06), 0 1px 2px rgba(15, 23, 42, .04);--shadow-md: 0 4px 12px rgba(15, 23, 42, .08), 0 2px 4px rgba(15, 23, 42, .04);--shadow-lg: 0 12px 32px rgba(15, 23, 42, .1), 0 4px 8px rgba(15, 23, 42, .05);--shadow-glow: 0 0 24px var(--accent-glow);--shadow-color-rgb: 15, 23, 42}:root{--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 24px;--space-6: 32px;--space-7: 48px;--space-8: 64px;--radius-xs: 4px;--radius-sm: 6px;--radius-md: 10px;--radius-lg: 16px;--radius-xl: 20px;--radius-full: 9999px;--font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;--font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;--text-xs: 11px;--text-sm: 12px;--text-base: 14px;--text-md: 15px;--text-lg: 17px;--text-xl: 20px;--text-2xl: 24px;--text-3xl: 32px;--transition-fast: .14s cubic-bezier(.4, 0, .2, 1);--transition-smooth: .25s cubic-bezier(.4, 0, .2, 1);--transition-spring: .4s cubic-bezier(.16, 1, .3, 1);--transition-bounce: .5s cubic-bezier(.34, 1.56, .64, 1);--toolbar-width: 52px;--sidebar-width: 280px;--sidebar-width-mobile: 240px;--top-bar-height: 48px;--z-canvas: 1;--z-sticky: 30;--z-selection: 40;--z-laser: 45;--z-reactions: 50;--z-cursor: 50;--z-toolbar: 100;--z-topbar: 100;--z-sidebar: 100;--z-toasts: 200;--z-modal: 500}.theme-transitioning,.theme-transitioning *,.theme-transitioning *:before,.theme-transitioning *:after{transition:background-color var(--transition-smooth),color var(--transition-smooth),border-color var(--transition-smooth),box-shadow var(--transition-smooth)!important}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html,body,#root{width:100%;height:100%;overflow:hidden;background-color:var(--surface-0);color:var(--text-primary);font-family:var(--font-sans);font-size:var(--text-base);line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;font-feature-settings:"cv11","ss01","tnum"}button,input,textarea,select{font-family:inherit;font-size:inherit;color:inherit}button{background:none;border:none;cursor:pointer}.app-container{position:relative;width:100vw;height:100vh;overflow:hidden;background-color:var(--canvas-bg)}.app-container:before{content:"";position:absolute;top:-20%;right:-20%;bottom:-20%;left:-20%;z-index:0;background:radial-gradient(ellipse 60% 50% at 20% 20%,var(--canvas-aurora-1),transparent 60%),radial-gradient(ellipse 50% 40% at 80% 80%,var(--canvas-aurora-2),transparent 60%),radial-gradient(ellipse 40% 30% at 50% 50%,var(--canvas-aurora-3),transparent 60%);animation:aurora-drift 24s ease-in-out infinite alternate;pointer-events:none}@keyframes aurora-drift{0%{transform:translate(0) rotate(0)}50%{transform:translate(2%,-1%) rotate(1deg)}to{transform:translate(-1%,2%) rotate(-1deg)}}.canvas-viewport{position:absolute;top:0;right:0;bottom:0;left:0;background-color:var(--canvas-bg);background-image:radial-gradient(circle,var(--canvas-grid) 1px,transparent 1px);background-size:24px 24px;cursor:crosshair;z-index:var(--z-canvas);animation:grid-fade-in .6s ease;touch-action:none}@keyframes grid-fade-in{0%{opacity:0}to{opacity:1}}.canvas-viewport.panning{cursor:grab}.canvas-viewport.panning-active{cursor:grabbing}.toolbar{position:fixed;top:50%;left:var(--space-5);transform:translateY(-50%);z-index:var(--z-toolbar);display:flex;flex-direction:column;gap:2px;padding:var(--space-2);border-radius:var(--radius-lg);background:var(--glass-bg);backdrop-filter:blur(20px) saturate(150%);-webkit-backdrop-filter:blur(20px) saturate(150%);border:1px solid var(--border-subtle);box-shadow:var(--shadow-lg);animation:toolbar-enter .5s cubic-bezier(.34,1.56,.64,1)}@keyframes toolbar-enter{0%{opacity:0;transform:translateY(-50%) translate(-30px) scale(.9)}to{opacity:1;transform:translateY(-50%) translate(0) scale(1)}}.toolbar-section{display:flex;flex-direction:column;gap:2px;padding:var(--space-1) 0}.toolbar-section+.toolbar-section{border-top:1px solid var(--border-subtle);margin-top:2px}.toolbar-section-label{font-size:9px;text-transform:uppercase;letter-spacing:.1em;color:var(--text-muted);padding:2px 6px;-webkit-user-select:none;user-select:none;font-weight:600}.tool-btn{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:var(--radius-sm);background:transparent;color:var(--text-secondary);font-size:18px;cursor:pointer;transition:background var(--transition-fast),color var(--transition-fast),transform var(--transition-fast);position:relative;-webkit-user-select:none;user-select:none;overflow:hidden;min-width:44px;min-height:44px}.tool-btn:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at center,var(--accent-glow) 0%,transparent 70%);opacity:0;transform:scale(.5);transition:opacity .24s ease,transform .24s ease;pointer-events:none}.tool-btn:hover{background:var(--accent-subtle);color:var(--text-primary);transform:translateY(-1px)}.tool-btn:hover:before{opacity:.6;transform:scale(1.4)}.tool-btn:active{transform:translateY(0) scale(.95)}.tool-btn.active{background:linear-gradient(135deg,var(--accent),var(--accent-hover));color:var(--text-on-accent);box-shadow:var(--shadow-glow),inset 0 1px #fff3;animation:tool-activate .32s cubic-bezier(.34,1.56,.64,1)}@keyframes tool-activate{0%{transform:scale(.85)}60%{transform:scale(1.06)}to{transform:scale(1)}}.tool-btn.active:hover{background:linear-gradient(135deg,var(--accent-hover),var(--accent));filter:brightness(1.1)}.tool-btn .shortcut-hint{position:absolute;bottom:2px;right:4px;font-size:8px;color:var(--text-muted);opacity:.6;font-weight:700;font-family:var(--font-mono)}.tool-btn.active .shortcut-hint{color:#ffffffbf}.tool-btn:disabled{opacity:.35;cursor:not-allowed;pointer-events:none}.tool-icon{font-size:16px;font-weight:400;line-height:1}.font-btn{font-size:var(--text-sm)}.font-btn-bold{font-weight:700}.color-picker-row{display:flex;flex-wrap:wrap;gap:4px;padding:4px 6px;justify-content:center;max-width:44px}.color-swatch{width:18px;height:18px;border-radius:50%;border:2px solid transparent;cursor:pointer;transition:transform var(--transition-fast),box-shadow var(--transition-fast);position:relative;box-shadow:0 1px 3px rgba(var(--shadow-color-rgb),.4)}.color-swatch:hover{transform:scale(1.25) rotate(8deg);z-index:2}.color-swatch.active{border-color:var(--text-primary);box-shadow:0 0 0 2px var(--accent),0 0 12px var(--accent-glow);transform:scale(1.15)}.sidebar{position:fixed;top:var(--space-4);right:var(--space-4);bottom:var(--space-4);width:var(--sidebar-width);z-index:var(--z-sidebar);display:flex;flex-direction:column;border-radius:var(--radius-lg);background:var(--glass-bg);backdrop-filter:blur(20px) saturate(150%);-webkit-backdrop-filter:blur(20px) saturate(150%);border:1px solid var(--border-subtle);box-shadow:var(--shadow-lg);overflow:hidden;animation:sidebar-enter .5s cubic-bezier(.16,1,.3,1)}@keyframes sidebar-enter{0%{opacity:0;transform:translate(30px) scale(.97)}to{opacity:1;transform:translate(0) scale(1)}}.sidebar-header{padding:var(--space-4) var(--space-4) var(--space-3);border-bottom:1px solid var(--border-subtle);display:flex;flex-direction:column;gap:var(--space-1)}.sidebar-header h2{font-size:var(--text-md);font-weight:700;color:var(--text-primary);letter-spacing:-.01em;display:flex;align-items:center;gap:var(--space-2)}.sidebar-header .logo-mark{width:28px;height:28px;border-radius:var(--radius-sm);background:linear-gradient(135deg,var(--accent),var(--accent-hover));display:flex;align-items:center;justify-content:center;font-size:14px;box-shadow:var(--shadow-glow)}.sidebar-meta{font-size:var(--text-xs);color:var(--text-muted);display:flex;align-items:center;gap:var(--space-2)}.online-count-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--success);box-shadow:0 0 6px var(--success-bg);animation:pulse-dot 2s ease-in-out infinite}.online-count-dot.offline{background:var(--danger);box-shadow:0 0 6px var(--danger-bg)}.current-room-banner{padding:var(--space-3) var(--space-4);background:var(--accent-subtle);border-bottom:1px solid var(--border-accent);display:flex;flex-direction:column;gap:2px}.current-room-banner .label{font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:var(--text-muted);font-weight:600}.current-room-banner .name{font-size:var(--text-base);font-weight:600;color:var(--text-primary);display:flex;align-items:center;gap:var(--space-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sidebar-tabs{display:flex;gap:2px;padding:var(--space-2) var(--space-3);border-bottom:1px solid var(--border-subtle)}.sidebar-tab{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;padding:var(--space-2);border-radius:var(--radius-sm);background:transparent;color:var(--text-muted);font-size:var(--text-xs);font-weight:600;cursor:pointer;transition:all var(--transition-fast);position:relative;min-height:36px}.sidebar-tab:hover{background:var(--accent-subtle);color:var(--text-primary)}.sidebar-tab.active{background:var(--accent-subtle);color:var(--accent)}.sidebar-tab .tab-badge{display:inline-flex;align-items:center;justify-content:center;min-width:16px;height:16px;padding:0 4px;background:var(--danger);color:var(--text-on-accent);font-size:9px;font-weight:700;border-radius:var(--radius-full);margin-left:2px}.sidebar-tab.active .tab-badge{background:var(--accent-hover)}.sidebar-section{padding:var(--space-3);flex:1;overflow:hidden;display:flex;flex-direction:column;gap:var(--space-3);min-height:0}.sidebar-section-title{font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:var(--text-muted);font-weight:600;padding:0 var(--space-2)}.room-list{list-style:none;display:flex;flex-direction:column;gap:2px;flex:1;overflow-y:auto;padding-right:4px;min-height:0}.room-item{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);cursor:pointer;transition:background var(--transition-fast),color var(--transition-fast),transform var(--transition-fast);color:var(--text-secondary);font-size:var(--text-sm);position:relative;-webkit-user-select:none;user-select:none;min-height:36px}.room-item:hover{background:var(--accent-subtle);color:var(--text-primary);transform:translate(2px)}.room-item.active{background:linear-gradient(135deg,var(--accent),var(--accent-hover));color:var(--text-on-accent);box-shadow:0 4px 12px var(--accent-glow)}.room-item .room-icon{font-size:14px;opacity:.85;transition:transform var(--transition-bounce)}.room-item:hover .room-icon{transform:scale(1.15) rotate(-5deg)}.room-item.active .room-icon{opacity:1}.room-item .room-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500}.room-item .room-count{font-size:10px;opacity:.7;background:#ffffff1a;padding:2px 6px;border-radius:var(--radius-full);font-weight:600}.room-item.active .room-count{background:#ffffff40;opacity:1}.room-item .room-delete{background:none;border:none;color:var(--danger);cursor:pointer;font-size:12px;padding:var(--space-1) var(--space-2);border-radius:var(--radius-xs);transition:background var(--transition-fast),transform var(--transition-fast);opacity:.7;min-width:28px;min-height:28px}.room-item .room-delete:hover{background:var(--danger-bg);transform:scale(1.15);opacity:1}.presence-list{list-style:none;display:flex;flex-direction:column;gap:var(--space-1);flex:1;overflow-y:auto;padding-right:4px;min-height:0}.presence-user{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);transition:background var(--transition-fast),transform var(--transition-fast);min-height:44px}.presence-user:hover{background:var(--accent-subtle);transform:translate(-2px)}.presence-avatar{width:32px;height:32px;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;font-size:var(--text-xs);font-weight:700;color:var(--text-on-accent);flex-shrink:0;box-shadow:0 2px 6px rgba(var(--shadow-color-rgb),.3),inset 0 1px #fff3}.presence-avatar:after{content:"";position:absolute;bottom:-1px;right:-1px;width:10px;height:10px;border-radius:50%;background:var(--success);border:2px solid var(--surface-1);animation:pulse-dot 2s ease-in-out infinite}.presence-avatar{position:relative}.presence-name{font-size:var(--text-sm);color:var(--text-secondary);font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.presence-name .self-tag{font-size:10px;color:var(--success);margin-left:var(--space-2);font-weight:700}.presence-cursor-indicator{width:6px;height:6px;border-radius:50%;margin-left:auto;animation:pulse-dot 2s ease-in-out infinite}@keyframes pulse-dot{0%,to{opacity:.5;transform:scale(1)}50%{opacity:1;transform:scale(1.35)}}.create-room-btn{display:flex;align-items:center;justify-content:center;gap:var(--space-2);width:100%;padding:var(--space-3);border:1px dashed var(--border-accent);border-radius:var(--radius-sm);background:transparent;color:var(--accent);font-size:var(--text-sm);cursor:pointer;transition:all var(--transition-fast);font-weight:600;min-height:40px}.create-room-btn:hover{background:var(--accent-subtle);border-color:var(--accent);border-style:solid;transform:translateY(-1px)}.create-room-btn .plus{font-size:16px;font-weight:700;transition:transform var(--transition-bounce)}.create-room-btn:hover .plus{transform:rotate(180deg) scale(1.2)}.danger-btn{display:flex;align-items:center;justify-content:center;gap:var(--space-2);width:100%;padding:var(--space-2) var(--space-3);border:1px solid rgba(244,63,94,.3);border-radius:var(--radius-sm);background:var(--danger-bg);color:var(--danger);font-size:var(--text-xs);cursor:pointer;transition:all var(--transition-fast);font-weight:500;min-height:36px}.danger-btn:hover{background:var(--danger);color:var(--text-on-accent);border-color:var(--danger);transform:translateY(-1px)}.sidebar-section-actions{display:flex;flex-direction:column;gap:var(--space-2);flex-shrink:0}.theme-toggle{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:var(--radius-full);background:var(--glass-bg-strong);border:1px solid var(--border-subtle);color:var(--text-secondary);cursor:pointer;transition:all var(--transition-fast);position:relative;overflow:hidden}.theme-toggle:hover{background:var(--accent-subtle);color:var(--text-primary);transform:rotate(15deg)}.theme-toggle .icon{width:16px;height:16px;transition:transform var(--transition-bounce)}.theme-toggle:hover .icon{transform:scale(1.15)}.top-bar{position:fixed;top:var(--space-4);left:50%;transform:translate(-50%);z-index:var(--z-topbar);display:flex;align-items:center;gap:var(--space-3);padding:var(--space-2) var(--space-4);border-radius:var(--radius-xl);background:var(--glass-bg);backdrop-filter:blur(20px) saturate(150%);-webkit-backdrop-filter:blur(20px) saturate(150%);border:1px solid var(--border-subtle);box-shadow:var(--shadow-lg);animation:top-bar-enter .5s cubic-bezier(.16,1,.3,1)}@keyframes top-bar-enter{0%{opacity:0;transform:translate(-50%) translateY(-20px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.top-bar-logo{display:flex;align-items:center;gap:var(--space-2);font-size:var(--text-md);font-weight:800;letter-spacing:-.02em}.top-bar-logo .gradient-text{background:linear-gradient(135deg,var(--accent),var(--accent-hover));-webkit-background-clip:text;background-clip:text;color:transparent}.top-bar-divider{width:1px;height:20px;background:var(--border-subtle)}.top-bar-board-name{font-size:var(--text-sm);color:var(--text-secondary);font-weight:500;max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.top-bar-actions{display:flex;gap:var(--space-1)}.top-bar-btn{display:flex;align-items:center;justify-content:center;padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);background:transparent;color:var(--text-secondary);font-size:var(--text-sm);cursor:pointer;transition:all var(--transition-fast);gap:5px;font-weight:500;min-height:32px}.top-bar-btn:hover{background:var(--accent-subtle);color:var(--text-primary);transform:translateY(-1px)}.top-bar-btn.danger:hover{background:var(--danger-bg);color:var(--danger)}.connection-status{display:flex;align-items:center;gap:var(--space-2);font-size:var(--text-xs);font-weight:600;padding:var(--space-1) var(--space-2);border-radius:var(--radius-full);transition:all var(--transition-fast)}.connection-status.online{color:var(--success);background:var(--success-bg)}.connection-status.offline{color:var(--danger);background:var(--danger-bg)}.connection-status .status-dot{width:6px;height:6px;border-radius:50%;background:currentColor;animation:pulse-dot 1.6s ease-in-out infinite;box-shadow:0 0 6px currentColor}.zoom-indicator{position:fixed;bottom:var(--space-4);left:50%;transform:translate(-50%);z-index:var(--z-toolbar);display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);border-radius:var(--radius-xl);background:var(--glass-bg);backdrop-filter:blur(20px) saturate(150%);-webkit-backdrop-filter:blur(20px) saturate(150%);border:1px solid var(--border-subtle);box-shadow:var(--shadow-lg);font-size:var(--text-sm);color:var(--text-secondary);font-variant-numeric:tabular-nums;animation:zoom-indicator-enter .5s cubic-bezier(.16,1,.3,1)}@keyframes zoom-indicator-enter{0%{opacity:0;transform:translate(-50%) translateY(20px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.zoom-btn{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:var(--radius-sm);background:transparent;color:var(--text-secondary);font-size:16px;font-weight:600;cursor:pointer;transition:all var(--transition-fast)}.zoom-btn:hover{background:var(--accent-subtle);color:var(--text-primary);transform:scale(1.1)}.zoom-display{cursor:pointer;padding:2px var(--space-2);border-radius:var(--radius-xs);transition:background var(--transition-fast);min-width:50px;text-align:center;font-weight:600}.zoom-display:hover{background:var(--accent-subtle);color:var(--text-primary)}.remote-cursor{position:absolute;pointer-events:none;z-index:var(--z-cursor);transition:left 80ms linear,top 80ms linear;animation:cursor-appear .2s ease}@keyframes cursor-appear{0%{opacity:0;transform:scale(.6)}to{opacity:1;transform:scale(1)}}.remote-cursor-pointer{width:16px;height:20px;filter:drop-shadow(0 1px 3px rgba(var(--shadow-color-rgb),.4))}.remote-cursor-label{position:absolute;top:18px;left:10px;padding:2px var(--space-2);border-radius:var(--radius-xs);font-size:10px;font-weight:700;color:var(--text-on-accent);white-space:nowrap;pointer-events:none;box-shadow:var(--shadow-sm)}.text-input-overlay{position:absolute;z-index:60;min-width:100px;padding:var(--space-1) var(--space-2);border:2px solid var(--accent);border-radius:var(--radius-sm);background:var(--glass-bg-strong);color:var(--text-primary);font-size:var(--text-md);font-family:var(--font-sans);outline:none;resize:none;overflow:hidden;box-shadow:var(--shadow-glow);animation:text-input-pop .2s cubic-bezier(.34,1.56,.64,1)}@keyframes text-input-pop{0%{opacity:0;transform:scale(.85)}to{opacity:1;transform:scale(1)}}.sticky-note-layer{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:var(--z-sticky);overflow:hidden}.sticky-note{position:absolute;width:180px;min-height:140px;padding:14px 14px 22px;border-radius:var(--radius-xs);box-shadow:0 8px 20px rgba(var(--shadow-color-rgb),.35),0 2px 6px rgba(var(--shadow-color-rgb),.25),inset 0 1px #fff6;pointer-events:auto;transform-origin:top left;cursor:grab;transition:box-shadow .2s ease,filter .2s ease;font-size:var(--text-sm);color:#1f2937;line-height:1.5;-webkit-user-select:none;user-select:none;background-image:linear-gradient(180deg,rgba(255,255,255,.18),transparent 30%)}.sticky-note:before{content:"";position:absolute;top:-4px;left:50%;transform:translate(-50%);width:50px;height:8px;background:#0000002e;border-radius:2px;opacity:.5}.sticky-note:hover{box-shadow:0 14px 30px rgba(var(--shadow-color-rgb),.45),0 4px 10px rgba(var(--shadow-color-rgb),.3),inset 0 1px #ffffff80;filter:brightness(1.05)}.sticky-note.dragging{cursor:grabbing;box-shadow:0 20px 40px rgba(var(--shadow-color-rgb),.5),0 8px 16px rgba(var(--shadow-color-rgb),.35);z-index:100;transition:none}.sticky-note.selected{outline:2px solid var(--accent);outline-offset:3px;box-shadow:0 0 0 4px var(--accent-glow),0 14px 30px rgba(var(--shadow-color-rgb),.45),0 4px 10px rgba(var(--shadow-color-rgb),.3)}.sticky-note-text{width:100%;min-height:100px;border:none;background:transparent;outline:none;resize:none;color:inherit;font-family:inherit;font-size:var(--text-sm);line-height:1.5;font-weight:inherit;-webkit-user-select:text;user-select:text;cursor:text}.sticky-note-text::placeholder{color:#1f293766}.sticky-note-delete{position:absolute;top:-8px;right:-8px;width:22px;height:22px;border-radius:50%;background:var(--danger);color:var(--text-on-accent);border:2px solid var(--surface-1);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;cursor:pointer;opacity:0;transform:scale(.5);transition:all var(--transition-bounce);box-shadow:var(--shadow-sm)}.sticky-note:hover .sticky-note-delete,.sticky-note.selected .sticky-note-delete{opacity:1;transform:scale(1)}.sticky-note-delete:hover{transform:scale(1.15) rotate(90deg)}.sticky-note-color-picker{position:absolute;top:-34px;left:50%;transform:translate(-50%);display:flex;gap:4px;padding:4px var(--space-2);background:var(--glass-bg-strong);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:var(--radius-sm);border:1px solid var(--border-subtle);box-shadow:var(--shadow-md);opacity:0;pointer-events:none;transition:opacity var(--transition-fast),transform var(--transition-fast)}.sticky-note.selected .sticky-note-color-picker{opacity:1;pointer-events:auto;transform:translate(-50%) translateY(0)}.sticky-color-swatch{width:14px;height:14px;border-radius:50%;border:1.5px solid transparent;cursor:pointer;transition:transform var(--transition-fast)}.sticky-color-swatch:hover{transform:scale(1.25)}.sticky-color-swatch.active{border-color:var(--accent)}.chat-panel{display:flex;flex-direction:column;height:100%;overflow:hidden;min-height:0}.chat-messages{flex:1;overflow-y:auto;padding:var(--space-3);display:flex;flex-direction:column;gap:var(--space-3);scroll-behavior:smooth;min-height:0}.chat-message{display:flex;flex-direction:column;gap:var(--space-1);animation:chat-message-enter .3s cubic-bezier(.16,1,.3,1)}@keyframes chat-message-enter{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.chat-message-header{display:flex;align-items:center;gap:var(--space-2);font-size:var(--text-xs)}.chat-message-avatar{width:20px;height:20px;border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center;font-size:9px;font-weight:700;color:var(--text-on-accent);flex-shrink:0}.chat-message-username{font-weight:600;color:var(--text-secondary)}.chat-message-time{margin-left:auto;color:var(--text-muted);font-size:10px;font-variant-numeric:tabular-nums}.chat-message-bubble{background:var(--surface-2);border:1px solid var(--border-subtle);border-radius:var(--radius-md);padding:var(--space-2) var(--space-3);font-size:var(--text-sm);color:var(--text-primary);line-height:1.45;word-wrap:break-word;max-width:90%;margin-left:28px;box-shadow:var(--shadow-sm)}.chat-message-bubble.own{background:linear-gradient(135deg,var(--accent),var(--accent-hover));color:var(--text-on-accent);border:none;margin-left:auto;margin-right:0}.chat-message-bubble.stacked{margin-top:var(--space-1)}.chat-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:var(--space-2);color:var(--text-muted);font-size:var(--text-xs);text-align:center;padding:var(--space-5)}.chat-empty .empty-emoji{font-size:32px;opacity:.6;animation:logo-wiggle 4s ease-in-out infinite}.chat-input-container{padding:var(--space-3);border-top:1px solid var(--border-subtle);display:flex;gap:var(--space-2);background:var(--glass-bg-strong);flex-shrink:0}.chat-input{flex:1;padding:var(--space-2) var(--space-3);border:1px solid var(--border-subtle);border-radius:var(--radius-md);background:var(--surface-0);color:var(--text-primary);font-size:var(--text-sm);outline:none;transition:border-color var(--transition-fast),box-shadow var(--transition-fast);min-height:36px}.chat-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-subtle)}.chat-input::placeholder{color:var(--text-muted)}.chat-send-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:var(--radius-md);background:linear-gradient(135deg,var(--accent),var(--accent-hover));color:var(--text-on-accent);font-size:16px;cursor:pointer;transition:all var(--transition-fast);box-shadow:0 2px 6px var(--accent-glow)}.chat-send-btn:hover{transform:translateY(-1px) scale(1.05);box-shadow:0 4px 12px var(--accent-glow)}.chat-send-btn:active{transform:scale(.95)}.chat-send-btn:disabled{opacity:.4;cursor:not-allowed;transform:none}.reactions-layer{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:50;overflow:hidden}.reaction-burst{position:absolute;font-size:32px;-webkit-user-select:none;user-select:none;pointer-events:none;filter:drop-shadow(0 4px 8px rgba(var(--shadow-color-rgb),.4));will-change:transform,opacity}.reaction-emoji{display:inline-block}.reaction-burst .reaction-label{position:absolute;bottom:-16px;left:50%;transform:translate(-50%);font-size:10px;font-weight:700;color:var(--text-on-accent);padding:2px var(--space-2);border-radius:var(--radius-full);white-space:nowrap;box-shadow:0 1px 3px rgba(var(--shadow-color-rgb),.3)}.reactions-launcher{position:fixed;bottom:var(--space-4);z-index:var(--z-toolbar);display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);border-radius:var(--radius-xl);background:var(--glass-bg);backdrop-filter:blur(20px) saturate(150%);-webkit-backdrop-filter:blur(20px) saturate(150%);border:1px solid var(--border-subtle);box-shadow:var(--shadow-lg);animation:reactions-launcher-enter .5s cubic-bezier(.16,1,.3,1)}@keyframes reactions-launcher-enter{0%{opacity:0;transform:translateY(20px) scale(.9)}to{opacity:1;transform:translateY(0) scale(1)}}.reaction-btn{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:transparent;cursor:pointer;font-size:18px;transition:all var(--transition-bounce);position:relative;min-width:44px;min-height:44px}.reaction-btn:hover{background:var(--accent-subtle);transform:scale(1.35) rotate(-10deg)}.reaction-btn:active{transform:scale(.85)}.laser-layer{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:var(--z-laser);overflow:hidden}.laser-pointer{position:absolute;width:24px;height:24px;pointer-events:none;transform:translate(-50%,-50%)}.laser-pointer:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;background:radial-gradient(circle,var(--laser-color) 0%,transparent 70%);animation:laser-pulse 1s ease-in-out infinite}.laser-pointer:after{content:"";position:absolute;top:-10px;right:-10px;bottom:-10px;left:-10px;border-radius:50%;border:2px solid var(--laser-color);opacity:0;animation:laser-ring 1.4s ease-out infinite}@keyframes laser-pulse{0%,to{transform:scale(1);opacity:.95}50%{transform:scale(1.25);opacity:.7}}@keyframes laser-ring{0%{transform:scale(.5);opacity:.9}to{transform:scale(2.5);opacity:0}}.laser-label{position:absolute;top:18px;left:18px;padding:2px var(--space-2);border-radius:var(--radius-full);background:var(--laser-color);color:var(--text-on-accent);font-size:10px;font-weight:700;white-space:nowrap;box-shadow:0 2px 6px rgba(var(--shadow-color-rgb),.4)}.minimap{position:fixed;bottom:64px;z-index:99;width:200px;height:130px;border-radius:var(--radius-md);background:var(--glass-bg-strong);backdrop-filter:blur(20px) saturate(150%);-webkit-backdrop-filter:blur(20px) saturate(150%);border:1px solid var(--border-subtle);box-shadow:var(--shadow-lg);overflow:hidden;animation:minimap-enter .5s cubic-bezier(.16,1,.3,1);cursor:pointer;transition:transform var(--transition-fast),box-shadow var(--transition-fast)}.minimap:hover{transform:scale(1.04);box-shadow:var(--shadow-lg),0 0 0 2px var(--accent-glow)}@keyframes minimap-enter{0%{opacity:0;transform:translateY(20px) scale(.92)}to{opacity:1;transform:translateY(0) scale(1)}}.minimap canvas{display:block;width:100%;height:100%}.minimap-label{position:absolute;top:6px;left:8px;font-size:9px;text-transform:uppercase;letter-spacing:.1em;color:var(--text-muted);font-weight:700;pointer-events:none;z-index:2;text-shadow:0 1px 2px rgba(var(--shadow-color-rgb),.6)}.welcome-toast{position:fixed;bottom:var(--space-4);z-index:var(--z-toasts);max-width:320px;padding:var(--space-3) var(--space-4);border-radius:var(--radius-lg);background:var(--glass-bg-strong);-webkit-backdrop-filter:blur(20px) saturate(150%);backdrop-filter:blur(20px) saturate(150%);border:1px solid var(--border-accent);box-shadow:var(--shadow-lg),var(--shadow-glow);font-size:var(--text-sm);color:var(--text-secondary);line-height:1.6;animation:welcome-enter .6s cubic-bezier(.34,1.56,.64,1);left:max(80px,env(safe-area-inset-left,0px))}@keyframes welcome-enter{0%{opacity:0;transform:translateY(20px) scale(.92)}to{opacity:1;transform:translateY(0) scale(1)}}.welcome-toast h4{font-size:var(--text-sm);font-weight:700;color:var(--text-primary);margin-bottom:var(--space-1);display:flex;align-items:center;gap:var(--space-2)}.welcome-toast kbd{display:inline-block;padding:1px var(--space-2);font-family:var(--font-mono);font-size:10px;background:var(--surface-2);border:1px solid var(--border-subtle);border-bottom-width:2px;border-radius:var(--radius-xs);color:var(--text-primary);font-weight:600}.toast-stack{position:fixed;top:72px;left:50%;transform:translate(-50%);z-index:var(--z-toasts);display:flex;flex-direction:column;gap:var(--space-2);pointer-events:none;max-width:90vw}.toast{padding:var(--space-2) var(--space-4);border-radius:var(--radius-md);background:var(--glass-bg-strong);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid var(--border-subtle);box-shadow:var(--shadow-lg);font-size:var(--text-sm);font-weight:500;color:var(--text-primary);display:flex;align-items:center;gap:var(--space-2);pointer-events:auto;animation:toast-slide-in .3s cubic-bezier(.16,1,.3,1);max-width:480px}.toast.info{border-left:3px solid var(--info)}.toast.success{border-left:3px solid var(--success)}.toast.warning{border-left:3px solid var(--warning)}.toast.danger{border-left:3px solid var(--danger)}@keyframes toast-slide-in{0%{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:translateY(0)}}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--space-5) var(--space-3);gap:var(--space-2);color:var(--text-muted);font-size:var(--text-xs);text-align:center;flex:1}.empty-state-icon{font-size:28px;opacity:.5}::selection{background:var(--accent);color:var(--text-on-accent)}:focus{outline:none}:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:var(--radius-xs)}button:focus-visible,.tool-btn:focus-visible,.sidebar-tab:focus-visible{outline-offset:4px}[data-tooltip]{position:relative}[data-tooltip]:hover:after{content:attr(data-tooltip);position:absolute;left:calc(100% + 10px);top:50%;transform:translateY(-50%);padding:var(--space-1) var(--space-3);border-radius:var(--radius-sm);background:var(--surface-2);color:var(--text-primary);font-size:var(--text-xs);font-weight:500;white-space:nowrap;z-index:200;box-shadow:var(--shadow-md);border:1px solid var(--border-subtle);pointer-events:none;animation:tooltip-pop .18s cubic-bezier(.34,1.56,.64,1)}@keyframes tooltip-pop{0%{opacity:0;transform:translate(-4px,-50%) scale(.9)}to{opacity:1;transform:translateY(-50%) scale(1)}}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--text-muted);border-radius:3px;opacity:.5}::-webkit-scrollbar-thumb:hover{background:var(--text-secondary)}*{scrollbar-width:thin;scrollbar-color:var(--text-muted) transparent}@keyframes logo-wiggle{0%,90%,to{transform:rotate(0)}92%{transform:rotate(-12deg)}94%{transform:rotate(12deg)}96%{transform:rotate(-6deg)}98%{transform:rotate(6deg)}}@media (max-width: 1279px){.sidebar{width:260px}.minimap{width:180px;height:118px}}@media (max-width: 1023px){.sidebar{width:64px}.sidebar-header h2 .full-label,.sidebar-meta,.current-room-banner .label,.current-room-banner .name,.sidebar-section-title,.room-name,.room-count,.presence-name,.create-room-btn span:not(.plus),.danger-btn span,.sidebar-tab span:not(.tab-badge){display:none}.sidebar-header{align-items:center;padding:var(--space-3)}.sidebar-tabs{padding:var(--space-1)}.sidebar-tab{padding:var(--space-2);min-height:40px}.room-item{justify-content:center;padding:var(--space-2)}.minimap,.welcome-toast,.top-bar-board-name{display:none}.top-bar{gap:var(--space-2);padding:var(--space-2) var(--space-3)}}@media (max-width: 767px){:root{--sidebar-width: 100%}.sidebar{top:auto;right:0;bottom:0;left:0;width:100%;height:50vh;border-radius:var(--radius-lg) var(--radius-lg) 0 0;animation:drawer-slide-up .4s cubic-bezier(.16,1,.3,1)}@keyframes drawer-slide-up{0%{transform:translateY(100%)}to{transform:translateY(0)}}.toolbar{top:var(--space-3);bottom:auto;left:50%;right:auto;transform:translate(-50%);flex-direction:row;padding:var(--space-1);max-width:calc(100vw - var(--space-6));overflow-x:auto}.toolbar-section{flex-direction:row}.toolbar-section+.toolbar-section{border-top:none;border-left:1px solid var(--border-subtle);margin-top:0;margin-left:2px}.toolbar-section-label{display:none}.tool-btn{width:36px;height:36px;min-width:40px;min-height:40px}.color-picker-row{max-width:none;flex-direction:row}.reactions-launcher{bottom:auto;top:var(--space-3);right:var(--space-3)}.top-bar{top:var(--space-3);padding:var(--space-1) var(--space-3);gap:var(--space-2)}.top-bar-logo{font-size:var(--text-sm)}.top-bar-actions{gap:2px}.top-bar-btn{padding:var(--space-1) var(--space-2)}.toast-stack{top:60px}.zoom-indicator{bottom:var(--space-3)}.welcome-toast{bottom:80px;left:var(--space-3);right:var(--space-3);max-width:none}}@media (max-width: 639px){.top-bar-divider,.connection-status,.top-bar-actions .top-bar-btn .label{display:none}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}@media (prefers-contrast: more){:root,[data-theme=dark]{--border-subtle: rgba(148, 163, 184, .25);--border-strong: rgba(148, 163, 184, .45)}[data-theme=light]{--border-subtle: rgba(15, 23, 42, .15);--border-strong: rgba(15, 23, 42, .25)}}
