.notebook-overlay,.whiteboard-view,.lesson-whiteboard-content{--wb-surface-0: rgba(8, 8, 14, .98);--wb-surface-1: rgba(16, 16, 24, .94);--wb-surface-2: rgba(24, 24, 34, .92);--wb-surface-3: rgba(30, 30, 42, .88);--wb-glass: rgba(14, 14, 22, .82);--wb-glass-hover: rgba(22, 22, 34, .88);--wb-border: rgba(255, 255, 255, .07);--wb-border-hover: rgba(255, 255, 255, .16);--wb-border-accent: rgba(107, 138, 253, .4);--wb-border-accent-hover: rgba(107, 138, 253, .65);--wb-text-primary: #f0f0f5;--wb-text-secondary: #b4b4c0;--wb-text-muted: #6e6e82;--wb-accent: #6b8afd;--wb-accent-glow: rgba(107, 138, 253, .18);--wb-accent-hover: #85a0ff;--wb-warm: #f47d63;--wb-warm-glow: rgba(244, 125, 99, .15);--wb-danger: #f87171;--wb-success: #4ade80;--wb-shadow-sm: 0 2px 8px rgba(0, 0, 0, .24);--wb-shadow-md: 0 8px 24px rgba(0, 0, 0, .32);--wb-shadow-lg: 0 16px 48px rgba(0, 0, 0, .4);--wb-shadow-xl: 0 24px 64px rgba(0, 0, 0, .5);--wb-radius-sm: 8px;--wb-radius-md: 12px;--wb-radius-lg: 16px;--wb-radius-xl: 20px;--wb-radius-pill: 9999px;--wb-ease-out: cubic-bezier(.22, 1, .36, 1);--wb-ease-spring: cubic-bezier(.34, 1.56, .64, 1)}.notebook-overlay{position:absolute;inset:0;width:100%;height:100%;background:var(--wb-surface-0);z-index:2;display:flex;align-items:stretch;padding:20px 24px 24px;overflow:hidden}.whiteboard-learn-page{position:fixed;z-index:40}.notebook-overlay.whiteboard{padding:0}.notebook-btn{border:1px solid transparent;transition:border-color .2s var(--wb-ease-out),background .2s var(--wb-ease-out),transform .18s var(--wb-ease-out)}.notebook-btn:focus-visible{outline:2px solid var(--wb-accent);outline-offset:2px}.notebook-btn.active{border-color:var(--wb-border-accent);background:var(--wb-accent-glow)}.notebook-container{width:100%;max-width:none;height:100%;background:transparent;border:none;border-radius:0;box-shadow:none;display:flex;flex-direction:column;overflow:hidden;pointer-events:auto}.notebook-container.whiteboard{max-width:none;width:100%;border-radius:0;border:none;background:transparent;box-shadow:none;pointer-events:auto}.notebook-content{pointer-events:auto;flex:1;width:100%;padding:12px 24px 28px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.08) transparent}.notebook-content::-webkit-scrollbar{width:6px}.notebook-content::-webkit-scrollbar-track{background:transparent}.notebook-content::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:999px}.notebook-close-btn{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;border:1px solid var(--wb-border);background:var(--wb-glass);color:var(--wb-text-secondary);cursor:pointer;transition:all .22s var(--wb-ease-out);box-shadow:var(--wb-shadow-md);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);animation:slide-down .35s var(--wb-ease-out) .06s backwards;padding:0}.notebook-close-btn:hover{border-color:#f8717159;background:var(--wb-warm-glow);color:#fca5a5;transform:rotate(90deg) scale(1.08);box-shadow:var(--wb-shadow-md),0 0 24px #f871711f}.notebook-close-btn:focus-visible{outline:2px solid var(--wb-accent);outline-offset:2px}.notebook-overlay-close{position:absolute;top:20px;right:24px;z-index:3}@keyframes slide-down{0%{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-up{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes scale-in{0%{opacity:0;transform:scale(.94)}to{opacity:1;transform:scale(1)}}@keyframes card-appear{0%{opacity:0;transform:translateY(16px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}.notebook-gallery{display:flex;flex-direction:column;gap:20px;width:100%;animation:fade-in .4s var(--wb-ease-out)}.lesson-whiteboard-content .notebook-gallery{flex:1 1 auto;min-height:0;padding:12px 16px 20px;overflow-y:auto}.lesson-whiteboard-content .notebook-gallery-controls{flex-shrink:0;gap:8px;flex-wrap:wrap}.lesson-whiteboard-content .notebook-search-wrap{min-width:0;max-width:none;flex:1 1 auto;width:auto}.lesson-whiteboard-content .notebook-new-btn{padding:8px 12px;font-size:.8rem;flex-shrink:0}.lesson-whiteboard-content .notebook-gallery-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px;align-content:start}.lesson-whiteboard-content .notebook-card-title{font-size:.85rem}.notebook-gallery-controls{display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding-bottom:8px}.notebook-new-btn{display:inline-flex;align-items:center;gap:5px;min-height:36px;padding:0 16px;border-radius:var(--wb-radius-pill);border:none;background:#f0f4ff;color:#0a0f1a;font-size:13px;font-weight:700;font-family:Inter,sans-serif;letter-spacing:.01em;cursor:pointer;box-shadow:0 8px 22px -16px #e0eaff80;transition:transform .18s var(--wb-ease-out),box-shadow .18s var(--wb-ease-out),background-color .18s var(--wb-ease-out);flex-shrink:0}.notebook-new-btn:hover{transform:translateY(-1px);background:#fff;box-shadow:0 12px 26px -14px #e0eaffa6}.notebook-new-btn:focus-visible{outline:none;box-shadow:0 0 0 2px #6b8afd66,0 8px 22px -16px #e0eaff80}.notebook-new-btn:active{transform:translateY(0);box-shadow:0 4px 14px -10px #e0eaff66}.notebook-search-wrap{display:flex;align-items:center;gap:6px;width:200px;min-height:36px;padding:0 10px;border-radius:10px;border:1px solid rgba(255,255,255,.08);background:#ffffff0a;flex-shrink:1;position:relative;transition:border-color .22s var(--wb-ease-out),background .22s var(--wb-ease-out),box-shadow .22s var(--wb-ease-out),width .28s var(--wb-ease-out)}.notebook-search-wrap:focus-within{border-color:#ffffff2e;background:#ffffff0f;box-shadow:0 0 0 1px #ffffff14;width:280px}.notebook-search-icon{flex-shrink:0;color:#5e6e86;transition:color .18s ease}.notebook-search-wrap:focus-within .notebook-search-icon{color:#8a9ab8}.notebook-search-input{flex:1;min-width:0;width:100%;border:none;background:transparent;color:#dde4f0;font-size:13px;font-family:Inter,sans-serif;line-height:1.4;outline:none}.notebook-search-input::-moz-placeholder{color:#4a5568}.notebook-search-input::placeholder{color:#4a5568}.notebook-search-clear{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;flex-shrink:0;border:none;border-radius:6px;background:#ffffff0f;color:#6b7a90;font-size:14px;line-height:1;cursor:pointer;transition:background-color .15s ease,color .15s ease}.notebook-search-clear:hover{background:#ffffff1a;color:#c0cee6}.notebook-gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:18px}@media(max-width:720px){.notebook-overlay{padding:max(10px,env(safe-area-inset-top)) 10px max(10px,env(safe-area-inset-bottom))}.notebook-overlay-close{top:14px;right:14px}.notebook-gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:480px){.notebook-content{padding-inline:6px}.notebook-gallery-controls{align-items:stretch}.notebook-gallery-controls>*{min-width:0}.notebook-gallery-grid{grid-template-columns:minmax(0,1fr);gap:14px}.notebook-empty-state{padding-block:48px}}.notebook-empty-state{padding:80px 12px;text-align:center;color:var(--wb-text-secondary);animation:fade-in .5s var(--wb-ease-out)}.notebook-empty-state h2{font-family:Space Grotesk,sans-serif;font-size:1.2rem;font-weight:600;margin-bottom:8px;color:var(--wb-text-primary);text-shadow:0 2px 12px rgba(0,0,0,.6);letter-spacing:-.01em}.notebook-empty-state p{font-size:.88rem;color:var(--wb-text-muted)}.notebook-card{position:relative;display:flex;flex-direction:column;border-radius:var(--wb-radius-xl);border:1px solid var(--wb-border);background:linear-gradient(180deg,#ffffff08,#ffffff03),var(--wb-surface-2);overflow:hidden;cursor:pointer;transform:translateZ(0);backface-visibility:hidden;will-change:transform,box-shadow,border-color;transition:transform .24s var(--wb-ease-out),box-shadow .28s var(--wb-ease-out),border-color .22s var(--wb-ease-out);aspect-ratio:1 / 1;animation:card-appear .4s var(--wb-ease-out) backwards}.notebook-card:nth-child(1){animation-delay:.02s}.notebook-card:nth-child(2){animation-delay:.06s}.notebook-card:nth-child(3){animation-delay:.1s}.notebook-card:nth-child(4){animation-delay:.14s}.notebook-card:nth-child(5){animation-delay:.18s}.notebook-card:nth-child(6){animation-delay:.22s}.notebook-card:hover,.notebook-card:focus-visible{transform:translate3d(0,-6px,0) scale(1.02);border-color:var(--wb-border-accent-hover);box-shadow:0 24px 48px #0006,0 0 0 1px #6b8afd26,0 12px 24px #6b8afd14}.notebook-card:focus-visible{outline:2px solid var(--wb-accent);outline-offset:2px}.notebook-card-thumbnail{position:relative;width:100%;height:100%;background:var(--wb-surface-1);overflow:hidden}.notebook-card-thumbnail img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;display:block;transform:translateZ(0) scale(1);will-change:transform,filter;transition:transform .32s var(--wb-ease-out),filter .32s var(--wb-ease-out)}.notebook-card:hover .notebook-card-thumbnail img,.notebook-card:focus-visible .notebook-card-thumbnail img{transform:scale(1.06);filter:saturate(1.08) brightness(1.06)}.notebook-card-placeholder{width:100%;height:100%;background:radial-gradient(ellipse at 30% 20%,rgba(107,138,253,.14),transparent 60%),radial-gradient(ellipse at 70% 80%,rgba(244,125,99,.08),transparent 50%),linear-gradient(160deg,#14141e99,#0a0a10e6);transform:translateZ(0) scale(1);will-change:transform,filter;transition:transform .32s var(--wb-ease-out),filter .32s var(--wb-ease-out)}.notebook-card:hover .notebook-card-placeholder,.notebook-card:focus-visible .notebook-card-placeholder{transform:scale(1.04);filter:brightness(1.08)}.notebook-card-body{position:absolute;bottom:0;left:0;right:0;padding:28px 18px 18px;display:flex;flex-direction:column;gap:5px;background:linear-gradient(to top,rgba(0,0,0,.94) 0%,rgba(0,0,0,.7) 55%,transparent);z-index:1}.notebook-card-title{font-family:Inter,sans-serif;font-size:1rem;font-weight:600;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-shadow:0 1px 8px rgba(0,0,0,.7);letter-spacing:-.01em}.notebook-card-meta{font-size:.72rem;color:#fff9;font-family:Space Mono,monospace;letter-spacing:.02em}.notebook-card-menu{position:absolute;top:10px;right:10px;display:flex;flex-direction:column;align-items:flex-end;gap:8px;z-index:2}.notebook-card-menu-button{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:var(--wb-radius-md);border:1px solid rgba(255,255,255,.1);background:#0a0a10d9;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);color:var(--wb-text-secondary);cursor:pointer;transition:border-color .2s var(--wb-ease-out),background .2s var(--wb-ease-out),color .2s var(--wb-ease-out),transform .18s var(--wb-ease-out)}.notebook-card-menu-button:hover{border-color:var(--wb-border-accent);background:#6b8afd2e;color:#fff;transform:scale(1.06)}.notebook-card-menu-button:focus-visible{outline:2px solid var(--wb-accent);outline-offset:1px}.notebook-card-menu-dropdown{display:flex;flex-direction:column;gap:2px;min-width:156px;padding:6px;border-radius:var(--wb-radius-lg);border:1px solid var(--wb-border);background:var(--wb-surface-1);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);box-shadow:var(--wb-shadow-lg);animation:scale-in .15s var(--wb-ease-out)}.notebook-card-menu-item{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:var(--wb-radius-sm);border:none;background:transparent;color:var(--wb-text-secondary);cursor:pointer;text-align:left;font-size:.85rem;font-family:Inter,sans-serif;transition:background .15s,color .15s}.notebook-card-menu-item:hover{background:#ffffff14;color:#fff}.notebook-card-menu-item:focus-visible{outline:2px solid var(--wb-accent);outline-offset:-2px}.notebook-card-menu-item.danger{color:#fca5a5}.notebook-card-menu-item.danger:hover{background:#f871711f;color:#fca5a5}.whiteboard-view{position:relative;width:100%;height:100%;overflow:hidden;isolation:isolate;flex:1}.whiteboard-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;-moz-user-select:none;user-select:none;overscroll-behavior:none}.whiteboard-canvas-stack{position:absolute;inset:0;z-index:0}.whiteboard-canvas-committed{z-index:0;pointer-events:none}.whiteboard-canvas-draft{z-index:1}.whiteboard-floating-header{position:absolute;top:16px;left:16px;right:16px;display:flex;align-items:center;justify-content:space-between;gap:12px;pointer-events:none;z-index:3;animation:slide-down .35s var(--wb-ease-out)}.whiteboard-header-group{display:inline-flex;align-items:center;gap:10px;padding:8px 12px;border-radius:16px;border:1px solid var(--wb-border);background:var(--wb-glass);backdrop-filter:blur(24px) saturate(1.6);-webkit-backdrop-filter:blur(24px) saturate(1.6);box-shadow:var(--wb-shadow-md);pointer-events:auto;transition:box-shadow .22s var(--wb-ease-out)}.whiteboard-floating-header-actions{display:inline-flex;align-items:center;gap:10px;pointer-events:auto}.whiteboard-back-btn{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0 14px;border-radius:var(--wb-radius-pill);border:1px solid rgba(51,65,85,.8);background:#0f1624d1;color:#cbd5e1;font-size:.75rem;font-weight:600;font-family:Inter,sans-serif;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;transition:border-color .22s var(--wb-ease-out),background .22s var(--wb-ease-out),color .22s var(--wb-ease-out),transform .22s var(--wb-ease-out),box-shadow .22s var(--wb-ease-out)}.whiteboard-back-btn:hover{border-color:#475569f2;background:#162133eb;color:#f8fafc;transform:translateY(-1px);box-shadow:0 4px 12px #0003}.whiteboard-back-btn:focus-visible{outline:2px solid var(--wb-accent);outline-offset:2px}.whiteboard-back-btn-icon{justify-content:center;width:36px;min-width:36px;padding:0;gap:0}.whiteboard-title{display:inline-flex;align-items:center;justify-content:flex-start;color:var(--wb-text-primary);font-family:Inter,sans-serif;font-size:.95rem;font-weight:600;min-width:0;letter-spacing:-.01em}.whiteboard-title-button{display:inline-flex;align-items:center;gap:8px;border:none;background:transparent;color:var(--wb-text-primary);font-size:.95rem;font-weight:600;font-family:Inter,sans-serif;cursor:pointer;max-width:260px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:color .2s;border-radius:var(--wb-radius-sm);padding:2px 4px;margin:-2px -4px}.whiteboard-title-button:hover{color:#fff}.whiteboard-title-button:focus-visible{outline:2px solid var(--wb-accent);outline-offset:1px}.whiteboard-title-input{min-width:200px;max-width:320px;width:100%;padding:5px 12px;border-radius:var(--wb-radius-md);border:1px solid var(--wb-border-accent);background:#6b8afd14;color:var(--wb-text-primary);font-size:.95rem;font-weight:600;font-family:Inter,sans-serif;outline:none;text-align:center;box-shadow:0 0 0 3px #6b8afd1f}.whiteboard-save-indicator{display:none}.whiteboard-settings-btn{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:var(--wb-radius-md);border:1px solid var(--wb-border);background:var(--wb-glass);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);color:var(--wb-text-secondary);cursor:pointer;transition:border-color .2s var(--wb-ease-out),background .2s var(--wb-ease-out),color .2s var(--wb-ease-out),transform .18s var(--wb-ease-out)}.whiteboard-settings-btn:hover{border-color:var(--wb-border-accent);background:var(--wb-accent-glow);color:#fff;transform:scale(1.06)}.whiteboard-settings-btn:focus-visible{outline:2px solid var(--wb-accent);outline-offset:2px}.whiteboard-floating-action{pointer-events:auto;box-shadow:var(--wb-shadow-md);backdrop-filter:blur(20px) saturate(1.4);-webkit-backdrop-filter:blur(20px) saturate(1.4)}.whiteboard-toolbar-wrapper{position:absolute;left:50%;bottom:24px;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:10px;pointer-events:none;z-index:3}.whiteboard-ink-stack{position:relative;display:flex;justify-content:center}.whiteboard-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 16px;background:linear-gradient(180deg,#20202aeb,#1a1a22f5);border:1px solid var(--wb-border);border-radius:var(--wb-radius-pill);box-shadow:var(--wb-shadow-lg),0 0 0 1px #ffffff0a,inset 0 1px #ffffff0f;backdrop-filter:blur(24px) saturate(1.5);-webkit-backdrop-filter:blur(24px) saturate(1.5);pointer-events:auto;animation:slide-up .35s var(--wb-ease-out)}.toolbar-section{display:flex;align-items:center;gap:8px}.toolbar-btn{width:40px;height:40px;border-radius:var(--wb-radius-pill);display:inline-flex;align-items:center;justify-content:center;border:none;background:transparent;color:var(--wb-text-muted);cursor:pointer;transition:all .2s var(--wb-ease-out)}.toolbar-btn:hover{background:#ffffff1a;color:#fff}.toolbar-btn.active{background:#ffffff29;color:#fff;transform:translateY(-2px);box-shadow:0 6px 18px #00000059}.toolbar-btn:focus-visible{outline:2px solid var(--wb-accent);outline-offset:1px}.toolbar-btn.disabled{opacity:.35;cursor:not-allowed}.toolbar-divider{width:1px;height:26px;background:#ffffff1a}.toolbar-ink-btn{position:relative;gap:4px}.toolbar-ink-btn.open{box-shadow:0 0 0 2px #6b8afd59 inset,0 0 0 1px #6b8afd33;background:var(--wb-accent-glow)}.toolbar-ink-icon{width:18px;height:18px}.toolbar-ink-indicator{position:absolute;bottom:7px;right:7px;width:10px;height:10px;border-radius:50%;border:2px solid rgba(30,30,40,.9);box-shadow:0 0 0 1px #fff6,0 2px 6px #0000004d;transition:transform .18s var(--wb-ease-out)}.toolbar-ink-btn:hover .toolbar-ink-indicator,.toolbar-ink-btn.active .toolbar-ink-indicator{transform:scale(1.15)}.ink-toolbar-panel{position:relative;display:inline-flex;align-items:center;gap:8px;padding:8px 10px;border-radius:20px;background:linear-gradient(180deg,#282834f5,#181822fa);box-shadow:0 22px 56px #00000073,0 0 0 1px #ffffff0d,inset 0 1px #ffffff17;backdrop-filter:blur(32px) saturate(1.5);-webkit-backdrop-filter:blur(32px) saturate(1.5);pointer-events:auto;animation:ink-toolbar-enter .28s var(--wb-ease-out)}.ink-toolbar-panel:before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:linear-gradient(180deg,#ffffff24,#ffffff08);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}@keyframes ink-toolbar-enter{0%{opacity:0;transform:translateY(10px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}.ink-toolbar-section,.ink-toolbar-group{display:flex;align-items:center;gap:4px}.ink-toolbar-divider{width:1px;height:28px;border-radius:1px;background:#ffffff14}.ink-tool-btn{position:relative;width:42px;height:42px;border-radius:14px;display:inline-flex;align-items:center;justify-content:center;border:1px solid transparent;background:transparent;color:var(--wb-text-secondary);cursor:pointer;transition:background .2s var(--wb-ease-out),color .2s var(--wb-ease-out),border-color .2s var(--wb-ease-out),box-shadow .2s var(--wb-ease-out),transform .15s var(--wb-ease-spring)}.ink-tool-btn:hover{background:#ffffff17;color:var(--wb-text-primary);transform:translateY(-1px) scale(1.04)}.ink-tool-btn:focus-visible{outline:2px solid var(--wb-accent);outline-offset:2px}.ink-tool-btn.active{background:linear-gradient(180deg,#ffffff29,#ffffff12);color:#fff;box-shadow:inset 0 1px #ffffff1f,0 6px 18px #00000047}.ink-tool-btn.selected{border-color:currentColor;box-shadow:0 0 0 2px #ffffff1a,0 0 16px -2px currentColor,0 8px 22px #00000047}.ink-tool-btn.selected:after{content:"";position:absolute;bottom:5px;left:50%;transform:translate(-50%);width:5px;height:5px;border-radius:50%;background:currentColor;box-shadow:0 0 8px currentColor}.ink-toolbar-group .ink-tool-btn{filter:drop-shadow(0 0 1.5px rgba(255,255,255,.35))}.ink-pen-icon{width:22px;height:22px}.ink-pen-shell{stroke:currentColor;fill:currentColor}.ink-pen-grip{stroke:currentColor;stroke-linecap:round}.ink-pen-nib{fill:currentColor}.ink-pen-ink{stroke-linecap:round;stroke-linejoin:round}.pen-command-panel{display:flex;flex-direction:column;gap:14px;padding:14px 16px;border-radius:var(--wb-radius-lg);border:1px solid var(--wb-border);background:linear-gradient(180deg,#181820fa,#12121afc);box-shadow:var(--wb-shadow-lg),inset 0 1px #ffffff0f;backdrop-filter:blur(24px) saturate(1.5);-webkit-backdrop-filter:blur(24px) saturate(1.5);pointer-events:auto;position:absolute;left:50%;bottom:calc(100% + 14px);transform:translate(-50%);z-index:1;animation:scale-in .18s var(--wb-ease-out)}.pen-command-panel:after{content:none}.pen-command-header{display:flex;align-items:center;gap:10px}.pen-command-title{font-family:Inter,sans-serif;font-size:.85rem;font-weight:600;color:var(--wb-text-primary);letter-spacing:-.01em}.pen-command-close{margin-left:auto;width:28px;height:28px;border-radius:var(--wb-radius-sm);border:none;background:#ffffff0d;color:var(--wb-text-muted);font-size:.75rem;line-height:1;cursor:pointer;transition:background .2s,color .2s,transform .15s var(--wb-ease-out)}.pen-command-close:hover{background:var(--wb-warm-glow);color:#fecaca;transform:scale(1.06)}.pen-command-close:focus-visible{outline:2px solid var(--wb-accent);outline-offset:1px}.pen-command-preview{display:flex;align-items:center;justify-content:center;padding:6px 0 4px}.pen-command-preview-line{width:120px;min-height:2px;border-radius:999px;box-shadow:0 0 0 1px #ffffff1a}.pen-command-section{display:flex;flex-direction:column;gap:10px}.pen-command-label{font-size:.68rem;text-transform:uppercase;letter-spacing:.1em;color:var(--wb-text-muted);font-family:Inter,sans-serif;font-weight:600}.pen-command-swatches{display:flex;gap:8px}.pen-command-swatch{width:26px;height:26px;border-radius:50%;border:2px solid transparent;cursor:pointer;transition:transform .2s var(--wb-ease-out),border-color .2s var(--wb-ease-out),box-shadow .2s var(--wb-ease-out)}.pen-command-swatch:hover{transform:scale(1.12)}.pen-command-swatch:focus-visible{outline:2px solid var(--wb-accent);outline-offset:2px}.pen-command-swatch.selected{border-color:#ffffffe6;transform:scale(1.08);box-shadow:0 0 0 3px #ffffff1f}.pen-command-widths{display:flex;gap:10px}.pen-command-slider{display:flex;align-items:center;gap:10px}.pen-command-range{flex:1;width:100%;accent-color:var(--wb-accent)}.pen-command-value{min-width:32px;text-align:right;font-size:.75rem;color:var(--wb-text-muted);font-family:Space Mono,monospace}.pen-command-width{width:32px;height:32px;border-radius:50%;border:1px solid rgba(255,255,255,.1);background:#ffffff0a;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:border-color .2s,background .2s,transform .15s var(--wb-ease-out)}.pen-command-width:hover{transform:scale(1.08)}.pen-command-width:focus-visible{outline:2px solid var(--wb-accent);outline-offset:1px}.pen-command-width span{display:block;border-radius:50%;background:#fff}.pen-command-width.selected{border-color:#fff9;background:#ffffff1a}.whiteboard-calculator{--calc-border: rgba(255, 255, 255, .07);--calc-border-strong: rgba(255, 255, 255, .16);--calc-text: #f7f7fb;--calc-text-dim: rgba(230, 233, 241, .65);--calc-accent: #7ea2ff;--calc-warm: #f47d63;position:absolute;top:0;left:0;z-index:5;display:flex;flex-direction:column;overflow:hidden;min-width:300px;min-height:500px;border-radius:24px;border:1px solid var(--calc-border);background:radial-gradient(ellipse at 15% 5%,rgba(107,138,253,.12),transparent 50%),radial-gradient(ellipse at 85% 95%,rgba(244,125,99,.08),transparent 45%),linear-gradient(180deg,#1c1c26fa,#0e0e16fc);box-shadow:var(--wb-shadow-xl),0 0 0 1px #ffffff0a,inset 0 1px #ffffff0f;backdrop-filter:blur(24px) saturate(1.5);-webkit-backdrop-filter:blur(24px) saturate(1.5);pointer-events:auto;-webkit-user-select:none;-moz-user-select:none;user-select:none;animation:scale-in .25s var(--wb-ease-out)}.whiteboard-calculator.resizing{transition:none}.whiteboard-calculator.compact{min-height:500px}.calculator-display{margin:14px 14px 0;padding:14px 16px 12px;border-radius:20px;border:1px solid rgba(255,255,255,.06);background:linear-gradient(180deg,#0e0e16f5,#16161ef5);box-shadow:inset 0 1px #ffffff0a,inset 0 -1px 3px #0003;display:flex;flex-direction:column;gap:8px;cursor:grab;flex-shrink:0}.whiteboard-calculator.dragging .calculator-display{cursor:grabbing}.calculator-display-topbar,.calculator-result-shell{display:flex;align-items:center;justify-content:space-between;gap:12px}.calculator-display-meta{display:inline-flex;align-items:center;min-height:24px;min-width:0}.calculator-mode-label{font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#f0f3fa6b}.calculator-display-note{min-height:18px;padding-inline:2px;font-size:.72rem;color:#ffd1c7}.calculator-display-actions{display:inline-flex;align-items:center;gap:8px}.calculator-icon-button,.calculator-copy-icon{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border:none;border-radius:var(--wb-radius-pill);background:#ffffff0d;color:var(--calc-text-dim);cursor:pointer;transition:background .15s ease,color .15s ease,transform .12s var(--wb-ease-out)}.calculator-icon-button:hover,.calculator-copy-icon:hover{background:#ffffff1a;color:#fff}.calculator-icon-button:focus-visible,.calculator-copy-icon:focus-visible{outline:2px solid var(--wb-accent);outline-offset:1px}.calculator-icon-button:active,.calculator-copy-icon:active{transform:translateY(1px)}.calculator-expression-shell{display:flex;flex-direction:column;gap:8px}.calculator-readout{display:flex;flex-direction:column;align-items:stretch;gap:4px;min-width:0;cursor:text}.calculator-expression-input{width:100%;border:none;background:transparent;color:#f0f3fa94;padding:0;font-size:.88rem;line-height:1.2;font-family:Consolas,SFMono-Regular,Courier New,monospace;text-align:right;white-space:nowrap;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-ms-overflow-style:none}.calculator-expression-input:focus{outline:none}.calculator-expression-input::-webkit-scrollbar{display:none}.calculator-expression-input.is-empty{min-height:0;height:0;opacity:0;pointer-events:none}.calculator-expression-input.has-value{min-height:18px}.calculator-result-shell{display:flex;justify-content:flex-end;align-items:flex-end;flex-shrink:0}.calculator-result{min-height:44px;font-size:var(--calc-display-size, 50px);font-weight:700;line-height:1.1;color:#fff;white-space:nowrap;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-ms-overflow-style:none;text-align:right}.calculator-result::-webkit-scrollbar{display:none}.calculator-body{flex:1 1 auto;display:flex;flex-direction:column;gap:12px;min-height:0;padding:10px 14px 28px;overflow:hidden;scrollbar-width:none;-ms-overflow-style:none}.calculator-body::-webkit-scrollbar{display:none}.calculator-function-strip{display:flex;align-items:flex-start;gap:8px;min-height:54px;min-width:0;padding:4px 6px 6px 4px;border-radius:var(--wb-radius-lg);border:1px solid rgba(255,255,255,.05);background:#ffffff06;overflow:hidden}.calculator-function-scroll{display:flex;gap:8px;align-items:center;flex:1 1 auto;min-width:0;overflow-x:auto;overflow-y:hidden;padding:0 8px 6px 0;scrollbar-width:thin;scrollbar-color:rgba(107,138,253,.5) rgba(255,255,255,.06);scroll-behavior:smooth;overscroll-behavior-x:contain;touch-action:pan-x}.calculator-function-scroll::-webkit-scrollbar{display:block;height:8px}.calculator-function-scroll::-webkit-scrollbar-track{border-radius:999px;background:#ffffff0d}.calculator-function-scroll::-webkit-scrollbar-thumb{border-radius:999px;border:1px solid rgba(255,255,255,.06);background:linear-gradient(90deg,#6b8afda6,#6b8afd59)}.calculator-function-scroll::-webkit-scrollbar-thumb:hover{background:linear-gradient(90deg,#6b8afdcc,#6b8afd80)}.calculator-keypad{display:flex;flex-direction:column;gap:10px;flex:1 1 auto;min-height:0}.whiteboard-calculator.compact .calculator-body{gap:10px}.whiteboard-calculator.compact .calculator-keypad{flex:1 1 auto}.whiteboard-calculator.compact .calculator-grid{flex:1 1 auto;grid-template-rows:repeat(5,minmax(var(--calc-key-height, 52px),1fr))}.calculator-advanced-grid,.calculator-grid{display:grid;gap:10px}.calculator-advanced-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.calculator-grid{grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(5,minmax(var(--calc-key-height, 52px),1fr));flex:1 1 auto;min-height:0}.calculator-key{min-height:0;height:100%;display:inline-flex;align-items:center;justify-content:center;gap:6px;width:100%;padding:10px 8px;border-radius:16px;border:1px solid rgba(255,255,255,.06);background:linear-gradient(180deg,#ffffff0f,#ffffff05);color:var(--calc-text);font-size:1rem;font-weight:600;font-family:Inter,sans-serif;cursor:pointer;transition:border-color .15s ease,background .15s ease,transform .1s var(--wb-ease-out),box-shadow .15s ease}.calculator-key:hover{border-color:#ffffff2e;background:linear-gradient(180deg,#ffffff1a,#ffffff0d)}.calculator-key:focus-visible{outline:2px solid var(--wb-accent);outline-offset:1px}.calculator-key:active{transform:translateY(1px)}.calculator-key.operator{border-color:#6b8afd40;background:linear-gradient(180deg,#6b8afd2e,#5b84ff14)}.calculator-key.function,.calculator-key.quick,.calculator-key.inline{font-size:.82rem}.calculator-key.utility{color:#ffd1c7;border-color:#f47d632e}.calculator-key.secondary.inline{min-height:var(--calc-inline-key-height, 40px);height:var(--calc-inline-key-height, 40px);min-width:72px;padding-inline:12px;border-radius:var(--wb-radius-pill);background:#ffffff0a}.calculator-key.equals{border-color:#f47d636b;background:linear-gradient(135deg,#f47d63b3,#dc614485);color:#fff}.calc-icon{width:18px;height:18px;display:inline-block}.calc-power{display:inline-flex;align-items:flex-start;gap:1px}.calc-power-base{font-size:.86rem;line-height:1}.calc-power-exp{font-size:.62rem;line-height:1;margin-top:-2px}.calculator-angle-toggle{display:inline-flex;gap:8px;padding:0;border:none;background:transparent}.calculator-angle-toggle.inline{flex-shrink:0;margin-right:2px}.angle-btn{min-height:var(--calc-inline-key-height, 40px);height:var(--calc-inline-key-height, 40px);padding:0 12px;border-radius:var(--wb-radius-pill);border:1px solid rgba(255,255,255,.06);background:#ffffff0a;color:var(--calc-text-dim);font-size:.7rem;font-weight:700;font-family:Space Mono,monospace;letter-spacing:.04em;cursor:pointer;transition:all .18s var(--wb-ease-out)}.angle-btn.active{border-color:#6b8afd61;background:linear-gradient(180deg,#6b8afd33,#5b84ff1a);color:#fff}.angle-btn:focus-visible{outline:2px solid var(--wb-accent);outline-offset:1px}.calculator-settings-overlay{position:absolute;inset:0;display:flex;align-items:flex-end;padding:12px;background:#06060a99;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);animation:fade-in .2s ease-out}.calculator-settings-sheet{width:100%;max-height:100%;overflow:auto;scrollbar-width:none;-ms-overflow-style:none;border-radius:var(--wb-radius-xl);border:1px solid var(--calc-border);background:linear-gradient(180deg,#181c25fc,#101018fc);box-shadow:var(--wb-shadow-lg);animation:slide-up .25s var(--wb-ease-out)}.calculator-settings-sheet::-webkit-scrollbar{display:none}.calculator-settings-header{display:flex;align-items:center;justify-content:flex-end;padding:16px 16px 8px;color:var(--calc-text)}.calculator-settings-section{padding:0 16px 16px}.calculator-settings-section h3{margin:0 0 10px;font-size:.82rem;font-weight:700;color:#f6f8fd;font-family:Inter,sans-serif}.calculator-preset-grid,.calculator-block-list{display:grid;gap:10px}.calculator-preset-card{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:12px 14px;border-radius:14px;border:1px solid rgba(255,255,255,.06);background:#ffffff08;color:var(--calc-text);cursor:pointer;text-align:left;transition:border-color .18s,background .18s,transform .18s var(--wb-ease-out)}.calculator-preset-card:hover{border-color:#ffffff24;background:#ffffff0f;transform:translateY(-1px)}.calculator-preset-card.active{border-color:#6b8afd61;background:#6b8afd1a}.calculator-preset-card span,.calculator-block-toggle span{color:var(--calc-text-dim);font-size:.76rem;line-height:1.45}.calculator-block-toggle{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:center;padding:12px 14px;border-radius:14px;border:1px solid rgba(255,255,255,.06);background:#ffffff08}.calculator-block-toggle.checked{border-color:#6b8afd40;background:#6b8afd0f}.calculator-toggle-wrap{position:relative;display:inline-flex;align-items:center;justify-content:center;width:46px;height:28px}.calculator-toggle-input{position:absolute;inset:0;opacity:0;margin:0;cursor:pointer}.calculator-toggle-track{width:46px;height:28px;border-radius:999px;background:#ffffff14;border:1px solid rgba(255,255,255,.08);padding:3px;display:inline-flex;align-items:center;transition:background .18s ease,border-color .18s ease}.calculator-toggle-thumb{width:20px;height:20px;border-radius:999px;background:#f5f7fce0;box-shadow:0 2px 6px #00000040;transition:transform .18s ease,background .18s ease}.calculator-toggle-input:focus-visible+.calculator-toggle-track{border-color:#6b8afd80;box-shadow:0 0 0 3px #6b8afd2e}.calculator-toggle-input:checked+.calculator-toggle-track{background:#6b8afd3d;border-color:#6b8afd66}.calculator-toggle-input:checked+.calculator-toggle-track .calculator-toggle-thumb{transform:translate(18px);background:#fff}.calculator-resize-handle{position:absolute;right:10px;bottom:10px;width:18px;height:18px;border-radius:6px;border:1px solid rgba(255,255,255,.1);background:#ffffff0a;cursor:nwse-resize;transition:background .15s,border-color .15s}.calculator-resize-handle:hover{background:#ffffff14;border-color:#fff3}.calculator-resize-handle:before{content:"";position:absolute;right:4px;bottom:4px;width:7px;height:7px;border-right:1.5px solid rgba(255,255,255,.45);border-bottom:1.5px solid rgba(255,255,255,.45)}@media(max-width:640px){.whiteboard-calculator{min-width:260px;max-width:calc(100vw - 20px)}.calculator-display{margin:12px 12px 0}.calculator-body{padding:10px 12px 12px}}@media(max-width:380px){.whiteboard-calculator{min-width:240px;max-width:calc(100vw - 16px)}.calculator-display{margin:10px 10px 0}.calculator-body{padding:8px 10px 10px}.calculator-key{font-size:.92rem;padding:8px 6px;border-radius:12px}}.whiteboard-loading,.whiteboard-empty{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--wb-text-secondary);font-size:.9rem;text-align:center;pointer-events:none;z-index:2}.whiteboard-loading{pointer-events:auto}.settings-panel{position:absolute;top:60px;right:16px;z-index:4;display:flex;flex-direction:column;gap:14px;padding:16px 18px;border-radius:var(--wb-radius-lg);border:1px solid black;background:linear-gradient(180deg,#181820f7,#12121afc);box-shadow:var(--wb-shadow-lg),inset 0 1px #ffffff0f;backdrop-filter:blur(24px) saturate(1.5);-webkit-backdrop-filter:blur(24px) saturate(1.5);animation:scale-in .2s var(--wb-ease-out)}.settings-panel-section{display:flex;flex-direction:column;gap:10px}.settings-panel-label{font-size:.68rem;text-transform:uppercase;letter-spacing:.1em;color:var(--wb-text-muted);font-family:Inter,sans-serif;font-weight:600}.settings-panel-swatches{display:flex;gap:8px;flex-wrap:wrap}.settings-panel-swatch{width:28px;height:28px;border-radius:50%;border:2px solid transparent;cursor:pointer;transition:transform .2s var(--wb-ease-out),border-color .2s var(--wb-ease-out),box-shadow .2s var(--wb-ease-out)}.settings-panel-swatch:hover{transform:scale(1.12)}.settings-panel-swatch:focus-visible{outline:2px solid var(--wb-accent);outline-offset:2px}.settings-panel-swatch.selected{border-color:#ffffffe6;transform:scale(1.06);box-shadow:0 0 0 3px #ffffff1a}.settings-panel-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.settings-panel-grid--wide{grid-template-columns:repeat(3,minmax(0,1fr))}@media(max-width:420px){.settings-panel-grid--wide{grid-template-columns:repeat(2,minmax(0,1fr))}}.settings-panel-grid-btn{padding:8px 10px;border-radius:var(--wb-radius-md);border:1px solid rgba(255,255,255,.1);background:#ffffff0a;color:var(--wb-text-secondary);font-size:.75rem;font-family:Inter,sans-serif;font-weight:500;cursor:pointer;transition:border-color .2s var(--wb-ease-out),background .2s var(--wb-ease-out),color .2s var(--wb-ease-out),transform .15s var(--wb-ease-out)}.settings-panel-grid-btn:hover{border-color:#ffffff4d;background:#ffffff1a;color:#fff;transform:translateY(-1px)}.settings-panel-grid-btn:focus-visible{outline:2px solid var(--wb-accent);outline-offset:1px}.settings-panel-grid-btn.active{border-color:#ffffff8c;background:#ffffff29;color:#fff}.whiteboard-zoom-controls{position:absolute;bottom:24px;right:16px;display:flex;align-items:center;gap:8px;padding:6px 12px;background:linear-gradient(180deg,#20202aeb,#1a1a22f5);border:1px solid var(--wb-border);border-radius:var(--wb-radius-md);backdrop-filter:blur(20px) saturate(1.4);-webkit-backdrop-filter:blur(20px) saturate(1.4);box-shadow:var(--wb-shadow-md),inset 0 1px #ffffff0f;z-index:4}.whiteboard-zoom-btn{width:30px;height:30px;border-radius:var(--wb-radius-sm);border:none;background:transparent;color:var(--wb-text-secondary);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:background .2s var(--wb-ease-out),color .2s var(--wb-ease-out),transform .12s var(--wb-ease-out)}.whiteboard-zoom-btn:hover:not(:disabled){background:#ffffff1a;color:#fff}.whiteboard-zoom-btn:focus-visible:not(:disabled){outline:2px solid var(--wb-accent);outline-offset:1px}.whiteboard-zoom-btn:active:not(:disabled){transform:scale(.94)}.whiteboard-zoom-btn:disabled{opacity:.35;cursor:not-allowed}.zoom-level{font-size:.75rem;font-family:Space Mono,monospace;color:#ffffffc7;min-width:44px;text-align:center}.zoom-dropdown-container{position:relative}.zoom-dropdown-trigger{display:inline-flex;align-items:center;gap:4px;padding:4px 6px;border:none;background:transparent;color:#ffffffc7;font-size:.75rem;font-family:Space Mono,monospace;cursor:pointer;border-radius:6px;transition:background .2s}.zoom-dropdown-trigger:hover{background:#ffffff14}.zoom-dropdown-trigger:focus-visible{outline:2px solid var(--wb-accent);outline-offset:1px}.zoom-chevron{transition:transform .2s var(--wb-ease-out)}.zoom-chevron.open{transform:rotate(180deg)}.zoom-dropdown-menu{position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%);display:flex;flex-direction:column;gap:2px;padding:6px;background:var(--wb-surface-1);border:1px solid var(--wb-border);border-radius:var(--wb-radius-md);box-shadow:var(--wb-shadow-md);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);list-style:none;margin:0;min-width:80px;z-index:10;animation:scale-in .15s var(--wb-ease-out)}.zoom-dropdown-item{width:100%;padding:6px 12px;border:none;background:transparent;color:var(--wb-text-secondary);font-size:.75rem;font-family:Space Mono,monospace;text-align:center;cursor:pointer;border-radius:6px;transition:background .15s,color .15s}.zoom-dropdown-item:hover{background:#ffffff14;color:#fff}.zoom-dropdown-item:focus-visible{outline:2px solid var(--wb-accent);outline-offset:-1px}.zoom-dropdown-item.active{background:#6b8afd2e;color:var(--wb-accent)}.whiteboard-selection-actions{position:absolute;display:inline-flex;align-items:center;gap:6px;padding:6px;background:var(--wb-glass);border:1px solid var(--wb-border);border-radius:var(--wb-radius-md);box-shadow:var(--wb-shadow-md);backdrop-filter:blur(20px) saturate(1.4);-webkit-backdrop-filter:blur(20px) saturate(1.4);transform:translate(-50%,-100%);z-index:5;animation:scale-in .15s var(--wb-ease-out)}.whiteboard-selection-btn{width:30px;height:30px;border-radius:var(--wb-radius-sm);border:none;background:transparent;color:var(--wb-text-secondary);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:background .2s,color .2s,transform .12s var(--wb-ease-out)}.whiteboard-selection-btn:hover{background:#ffffff1a;color:#fff}.whiteboard-selection-btn:focus-visible{outline:2px solid var(--wb-accent);outline-offset:1px}.whiteboard-selection-btn.danger{color:#f87171d9}.whiteboard-selection-btn.danger:hover{background:#f871711f;color:#fecacaf2}.whiteboard-toast{position:absolute;left:16px;right:16px;bottom:72px;display:flex;justify-content:center;padding:12px 16px;border-radius:var(--wb-radius-pill);border:1px solid var(--wb-border);background:var(--wb-glass);backdrop-filter:blur(16px) saturate(1.3);-webkit-backdrop-filter:blur(16px) saturate(1.3);font-family:Inter,sans-serif;font-size:.82rem;color:var(--wb-text-secondary);letter-spacing:-.01em;pointer-events:none;z-index:4;box-shadow:var(--wb-shadow-md);animation:slide-up .25s var(--wb-ease-out)}.whiteboard-toast.error{border-color:#f8717147;background:#f871711a;color:#fecacaf0}.sync-indicator{display:flex;align-items:center}.sync-status{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:var(--wb-radius-sm);font-size:.72rem;font-family:Space Mono,monospace;border:1px solid var(--wb-border);background:#ffffff08;color:var(--wb-text-muted);transition:all .2s var(--wb-ease-out)}.sync-status.syncing{border-color:#6b8afd59;background:#6b8afd14;color:var(--wb-accent)}.sync-status.synced{border-color:#4ade8059;background:#4ade8014;color:var(--wb-success)}.sync-status.error{border-color:#f8717159;background:#f8717114;color:var(--wb-danger)}.sync-status.offline{border-color:#fbbf2459;background:#fbbf2414;color:#fbbf24}.sync-status.local-only{border-color:#ffffff0a;background:transparent;color:var(--wb-text-muted)}.sync-status.idle{border-color:#6b8afd33;background:#6b8afd0a;color:#6b8afdbf}.notebook-count-badge{display:inline-flex;align-items:center;padding:6px 12px;border-radius:var(--wb-radius-sm);font-size:.75rem;font-family:Space Mono,monospace;border:1px solid var(--wb-border);background:#ffffff08;color:var(--wb-text-muted)}.limit-modal-overlay{position:fixed;inset:0;background:#000000b3;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:100;animation:fade-in .2s ease-out}.limit-modal{background:radial-gradient(ellipse at 20% 10%,rgba(212,175,55,.06),transparent 50%),var(--wb-surface-1);border:1px solid var(--wb-border);border-radius:var(--wb-radius-xl);padding:32px;max-width:400px;width:90%;text-align:center;box-shadow:var(--wb-shadow-xl);animation:scale-in .25s var(--wb-ease-out)}.limit-modal-icon{display:inline-flex;align-items:center;justify-content:center;width:64px;height:64px;border-radius:50%;background:linear-gradient(135deg,#d4af372e,#d4af370a);color:#d4af37;margin-bottom:16px}.limit-modal h2{font-family:Inter,sans-serif;font-size:1.2rem;font-weight:700;color:var(--wb-text-primary);margin-bottom:12px;letter-spacing:-.01em}.limit-modal p{font-size:.9rem;color:var(--wb-text-secondary);line-height:1.5;margin-bottom:8px}.limit-modal p strong{color:#d4af37}.limit-modal-actions{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:20px}.limit-modal-cancel{padding:10px 20px;border-radius:var(--wb-radius-md);border:1px solid var(--wb-border);background:#ffffff0a;color:var(--wb-text-secondary);font-family:Inter,sans-serif;font-size:.85rem;font-weight:500;cursor:pointer;transition:all .2s var(--wb-ease-out)}.limit-modal-cancel:hover{border-color:var(--wb-border-hover);background:#ffffff14}.limit-modal-cancel:focus-visible{outline:2px solid var(--wb-accent);outline-offset:2px}.limit-modal-upgrade{padding:10px 24px;border-radius:var(--wb-radius-md);border:1px solid rgba(212,175,55,.45);background:linear-gradient(135deg,#d4af372e,#d4af3714);color:#d4af37;font-family:Inter,sans-serif;font-size:.85rem;font-weight:600;text-decoration:none;cursor:pointer;transition:all .2s var(--wb-ease-out)}.limit-modal-upgrade:hover{border-color:#d4af37a6;background:linear-gradient(135deg,#d4af3747,#d4af3724);transform:translateY(-1px);box-shadow:0 6px 20px #d4af3726}.limit-modal-upgrade:focus-visible{outline:2px solid #d4af37;outline-offset:2px}@media(max-width:720px){.whiteboard-floating-header{top:10px;left:10px;right:10px}.whiteboard-header-group{max-width:calc(100% - 52px)}.whiteboard-title-button{max-width:140px}.whiteboard-title-input{min-width:120px;max-width:100%}.whiteboard-floating-header-actions{flex-wrap:wrap;max-width:100%}.whiteboard-toolbar-wrapper{bottom:16px}.whiteboard-toolbar{flex-direction:column;gap:8px;padding:8px 10px;border-radius:14px}.toolbar-section{justify-content:center;gap:4px}.toolbar-btn{width:34px;height:34px}.toolbar-btn svg{width:15px;height:15px}.toolbar-divider{width:20px;height:1px}.whiteboard-zoom-controls{bottom:12px;right:12px;top:auto;padding:4px 8px;gap:2px}.whiteboard-zoom-btn{display:inline-flex;width:26px;height:26px}.whiteboard-zoom-btn svg{width:14px;height:14px}.zoom-level{min-width:36px;font-size:.7rem}.zoom-dropdown-menu{top:auto;bottom:calc(100% + 8px);max-height:200px;overflow-y:auto}.whiteboard-toast{inset:64px 10px auto}.ink-toolbar-panel{transform:scale(.96);flex-wrap:wrap;justify-content:center;padding:7px 9px;gap:6px;border-radius:16px}.ink-toolbar-divider{height:24px}.ink-tool-btn{width:38px;height:38px;border-radius:12px}.ink-pen-icon{width:20px;height:20px}.settings-panel{top:88px;left:10px;right:10px;max-height:calc(100vh - 110px);overflow-y:auto}.pen-command-panel{max-width:calc(100vw - 24px);overflow-x:auto}.whiteboard-selection-actions{max-width:calc(100vw - 20px)}}@media(prefers-reduced-motion:reduce){.notebook-card,.notebook-card-thumbnail img,.notebook-card-placeholder,.toolbar-btn,.ink-tool-btn,.calculator-key,.settings-panel-grid-btn,.whiteboard-back-btn,.whiteboard-settings-btn,.whiteboard-zoom-btn,.notebook-new-btn,.notebook-search-wrap,.notebook-close-btn,.pen-command-swatch,.settings-panel-swatch,.pen-command-close,.notebook-card-menu-button,.whiteboard-selection-btn,.zoom-dropdown-trigger,.limit-modal-upgrade,.zoom-chevron{transition-duration:.01ms!important;animation-duration:.01ms!important}}.notebook-overlay[data-theme=light]{--wb-surface-0: rgba(240, 243, 250, .98);--wb-surface-1: rgba(251, 252, 255, .96);--wb-surface-2: rgba(255, 255, 255, .88);--wb-surface-3: rgba(246, 249, 255, .82);--wb-glass: rgba(255, 255, 255, .8);--wb-glass-hover: rgba(255, 255, 255, .88);--wb-border: rgba(44, 60, 82, .12);--wb-border-hover: rgba(44, 60, 82, .22);--wb-border-accent: rgba(37, 99, 235, .32);--wb-border-accent-hover: rgba(37, 99, 235, .52);--wb-text-primary: #0f172a;--wb-text-secondary: #475569;--wb-text-muted: #94a3b8;--wb-accent: #2563eb;--wb-accent-glow: rgba(37, 99, 235, .12);--wb-accent-hover: #3b82f6;--wb-warm: #dc2626;--wb-warm-glow: rgba(220, 38, 38, .1);--wb-danger: #dc2626;--wb-success: #16a34a;--wb-shadow-sm: 0 2px 8px rgba(15, 23, 42, .08);--wb-shadow-md: 0 8px 24px rgba(15, 23, 42, .12);--wb-shadow-lg: 0 16px 48px rgba(15, 23, 42, .16);--wb-shadow-xl: 0 24px 64px rgba(15, 23, 42, .2)}.notebook-overlay[data-theme=light] .notebook-close-btn{border-color:#2c3c521f;background:#ffffffe0;color:#475569;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);box-shadow:0 4px 16px #0f172a14}.notebook-overlay[data-theme=light] .notebook-close-btn:hover{border-color:#dc26264d;background:#dc262614;color:#dc2626}.notebook-overlay[data-theme=light] .notebook-new-btn{background:#0f172a;color:#f8fafc;box-shadow:0 10px 24px -16px #0f172a59}.notebook-overlay[data-theme=light] .notebook-new-btn:hover{background:#1e293b;box-shadow:0 14px 30px -16px #0f172a73}.notebook-overlay[data-theme=light] .notebook-search-wrap{border-color:#2c3c521f;background:#ffffffd1}.notebook-overlay[data-theme=light] .notebook-search-wrap:focus-within{border-color:#2563eb5c;background:#fffffff5;box-shadow:0 0 0 1px #2563eb1f}.notebook-overlay[data-theme=light] .notebook-search-icon{color:#94a3b8}.notebook-overlay[data-theme=light] .notebook-search-wrap:focus-within .notebook-search-icon{color:#64748b}.notebook-overlay[data-theme=light] .notebook-search-input{color:#0f172a}.notebook-overlay[data-theme=light] .notebook-search-input::-moz-placeholder{color:#94a3b8}.notebook-overlay[data-theme=light] .notebook-search-input::placeholder{color:#94a3b8}.notebook-overlay[data-theme=light] .notebook-search-clear{background:#0f172a0f;color:#64748b}.notebook-overlay[data-theme=light] .notebook-search-clear:hover{background:#0f172a1a;color:#1e293b}.notebook-overlay[data-theme=light] .notebook-count-badge{border-color:#2c3c521a;background:#0f172a0a;color:#64748b}.notebook-overlay[data-theme=light] .notebook-card{background:#fffffff0;border-color:#2c3c521f;box-shadow:0 4px 16px #0f172a14,0 0 0 1px #0f172a0a}.notebook-overlay[data-theme=light] .notebook-card:hover,.notebook-overlay[data-theme=light] .notebook-card:focus-visible{border-color:#2563eb59;box-shadow:0 16px 40px #0f172a1f,0 0 0 1px #2563eb14}.notebook-overlay[data-theme=light] .notebook-card:focus-visible{outline:2px solid #2563eb;outline-offset:2px}.notebook-overlay[data-theme=light] .notebook-card-thumbnail{background:#f1f5f9}.notebook-overlay[data-theme=light] .notebook-card-thumbnail img{filter:brightness(.98) contrast(1.02)}.notebook-overlay[data-theme=light] .notebook-card-placeholder{background:radial-gradient(ellipse at 30% 20%,rgba(37,99,235,.1),transparent 60%),radial-gradient(ellipse at 70% 80%,rgba(220,38,38,.06),transparent 50%),linear-gradient(160deg,#f1f5f9,#e2e8f0)}.notebook-overlay[data-theme=light] .notebook-card-body{background:linear-gradient(to top,rgba(15,23,42,.82) 0%,rgba(15,23,42,.48) 45%,rgba(15,23,42,.12) 70%,transparent 100%)}.notebook-overlay[data-theme=light] .notebook-card-title{color:#f8fafc;text-shadow:0 1px 8px rgba(2,6,23,.45)}.notebook-overlay[data-theme=light] .notebook-card-meta{color:#f1f5f9cc}.notebook-overlay[data-theme=light] .notebook-card-menu-button{background:#ffffffe0;border-color:#2c3c521a;color:#64748b;backdrop-filter:blur(8px)}.notebook-overlay[data-theme=light] .notebook-card-menu-button:hover{border-color:#2563eb4d;background:#2563eb1a;color:#0f172a}.notebook-overlay[data-theme=light] .notebook-card-menu-dropdown{background:#fffffffa;border-color:#2c3c521f;box-shadow:0 14px 32px #0f172a24}.notebook-overlay[data-theme=light] .notebook-card-menu-item{color:#475569}.notebook-overlay[data-theme=light] .notebook-card-menu-item:hover{background:#2563eb14;color:#0f172a}.notebook-overlay[data-theme=light] .notebook-card-menu-item.danger{color:#dc2626}.notebook-overlay[data-theme=light] .notebook-card-menu-item.danger:hover{background:#dc262614}.notebook-overlay[data-theme=light] .notebook-empty-state{color:#64748b}.notebook-overlay[data-theme=light] .notebook-empty-state h2{color:#0f172a;text-shadow:none}.notebook-overlay[data-theme=light] .notebook-empty-state p{color:#94a3b8}.notebook-overlay[data-theme=light] .whiteboard-header-group{background:#ffffffd1;border-color:#2c3c521a;box-shadow:0 8px 24px #0f172a14;backdrop-filter:blur(24px) saturate(1.5)}.notebook-overlay[data-theme=light] .whiteboard-back-btn{border-color:#2c3c5224;background:#ffffffd1;color:#475569}.notebook-overlay[data-theme=light] .whiteboard-back-btn:hover{border-color:#2c3c523d;background:#fffffffa;color:#0f172a}.notebook-overlay[data-theme=light] .whiteboard-title,.notebook-overlay[data-theme=light] .whiteboard-title-button,.notebook-overlay[data-theme=light] .whiteboard-title-button:hover{color:#0f172a}.notebook-overlay[data-theme=light] .whiteboard-title-input{border-color:#2563eb4d;background:#ffffffeb;color:#0f172a;box-shadow:0 0 0 3px #2563eb1a}.notebook-overlay[data-theme=light] .whiteboard-settings-btn{background:#ffffffd1;border-color:#2c3c521a;color:#64748b}.notebook-overlay[data-theme=light] .whiteboard-settings-btn:hover{border-color:#2563eb47;background:#2563eb14;color:#0f172a}.notebook-overlay[data-theme=light] .whiteboard-toolbar{background:linear-gradient(180deg,#ffffffeb,#fafafcf5);border-color:#2c3c521a;box-shadow:0 16px 48px #0f172a1f,inset 0 1px #fffc}.notebook-overlay[data-theme=light] .toolbar-btn{color:#64748b}.notebook-overlay[data-theme=light] .toolbar-btn:hover{background:#2563eb14;color:#0f172a}.notebook-overlay[data-theme=light] .toolbar-btn.active{background:#2563eb24;color:#0f172a;box-shadow:0 4px 14px #0f172a14}.notebook-overlay[data-theme=light] .toolbar-divider{background:#2c3c521a}.notebook-overlay[data-theme=light] .toolbar-ink-btn.open{box-shadow:0 0 0 2px #2563eb4d inset;background:#2563eb14}.notebook-overlay[data-theme=light] .toolbar-ink-indicator{border-color:#fffc;box-shadow:0 0 0 1px #0f172a26}.notebook-overlay[data-theme=light] .ink-toolbar-panel{background:linear-gradient(180deg,#fffffffa,#fafafef5);box-shadow:0 22px 56px #0f172a29,0 0 0 1px #fff9,inset 0 1px #ffffffd9}.notebook-overlay[data-theme=light] .ink-toolbar-panel:before{background:linear-gradient(180deg,#0f172a1f,#0f172a0a)}.notebook-overlay[data-theme=light] .ink-toolbar-divider{background:#2c3c521a}.notebook-overlay[data-theme=light] .ink-tool-btn{color:#64748b;filter:drop-shadow(0 0 2px rgba(0,0,0,.12))}.notebook-overlay[data-theme=light] .ink-tool-btn:hover{background:#2563eb14;color:#0f172a}.notebook-overlay[data-theme=light] .ink-tool-btn.active{background:linear-gradient(180deg,#2563eb29,#2563eb14);color:#0f172a;box-shadow:inset 0 1px #ffffff80,0 6px 18px #0f172a1a}.notebook-overlay[data-theme=light] .ink-tool-btn.selected{border-color:currentColor;box-shadow:0 0 0 2px #2563eb2e,0 0 16px -2px currentColor,0 8px 22px #0f172a1a}.notebook-overlay[data-theme=light] .ink-tool-btn.selected:after{background:currentColor;box-shadow:0 0 8px currentColor}.notebook-overlay[data-theme=light] .pen-command-panel,.notebook-overlay[data-theme=light] .settings-panel{background:linear-gradient(180deg,#fffffff5,#fafafcfa);border-color:#000;box-shadow:0 16px 48px #0f172a24}.notebook-overlay[data-theme=light] .pen-command-title,.notebook-overlay[data-theme=light] .settings-panel-label{color:#0f172a}.notebook-overlay[data-theme=light] .pen-command-label{color:#94a3b8}.notebook-overlay[data-theme=light] .pen-command-close{background:#2c3c520f;color:#94a3b8}.notebook-overlay[data-theme=light] .pen-command-close:hover{background:#dc262614;color:#dc2626}.notebook-overlay[data-theme=light] .pen-command-preview-line{box-shadow:0 0 0 1px #2c3c5214}.notebook-overlay[data-theme=light] .settings-panel-grid-btn{border-color:#2c3c521a;background:#0f172a08;color:#475569}.notebook-overlay[data-theme=light] .settings-panel-grid-btn:hover{border-color:#2563eb3d;background:#2563eb0f;color:#0f172a}.notebook-overlay[data-theme=light] .settings-panel-grid-btn.active{border-color:#2563eb4d;background:#2563eb1a;color:#0f172a}.notebook-overlay[data-theme=light] .settings-panel-swatch.selected{border-color:#0f172acc;box-shadow:0 0 0 3px #0f172a1a}.notebook-overlay[data-theme=light] .whiteboard-zoom-controls{background:linear-gradient(180deg,#ffffffeb,#fafafcf5);border-color:#2c3c521a;box-shadow:0 8px 24px #0f172a14,inset 0 1px #fffc}.notebook-overlay[data-theme=light] .whiteboard-zoom-btn{color:#64748b}.notebook-overlay[data-theme=light] .whiteboard-zoom-btn:hover:not(:disabled){background:#2563eb14;color:#0f172a}.notebook-overlay[data-theme=light] .zoom-level,.notebook-overlay[data-theme=light] .zoom-dropdown-trigger{color:#475569}.notebook-overlay[data-theme=light] .zoom-dropdown-trigger:hover{background:#2563eb14}.notebook-overlay[data-theme=light] .zoom-dropdown-menu{background:#fffffffa;border-color:#2c3c521f;box-shadow:0 10px 28px #0f172a1f}.notebook-overlay[data-theme=light] .zoom-dropdown-item{color:#475569}.notebook-overlay[data-theme=light] .zoom-dropdown-item:hover{background:#2563eb14;color:#0f172a}.notebook-overlay[data-theme=light] .zoom-dropdown-item.active{background:#2563eb1f;color:#2563eb}.notebook-overlay[data-theme=light] .whiteboard-selection-actions{background:#ffffffe0;border-color:#2c3c521a;box-shadow:0 8px 20px #0f172a1a;backdrop-filter:blur(20px)}.notebook-overlay[data-theme=light] .whiteboard-selection-btn{color:#64748b}.notebook-overlay[data-theme=light] .whiteboard-selection-btn:hover{background:#2563eb14;color:#0f172a}.notebook-overlay[data-theme=light] .whiteboard-selection-btn.danger{color:#dc2626}.notebook-overlay[data-theme=light] .whiteboard-selection-btn.danger:hover{background:#dc262614}.notebook-overlay[data-theme=light] .whiteboard-toast{background:#ffffffeb;border-color:#2c3c521f;color:#475569;backdrop-filter:blur(16px)}.notebook-overlay[data-theme=light] .whiteboard-toast.error{border-color:#dc262633;background:#fef2f2f2;color:#991b1b}.notebook-overlay[data-theme=light] .limit-modal{background:radial-gradient(ellipse at 20% 10%,rgba(212,175,55,.04),transparent 50%),#fffffffa;box-shadow:0 24px 64px #0f172a29}.notebook-overlay[data-theme=light] .limit-modal h2{color:#0f172a}.notebook-overlay[data-theme=light] .limit-modal p{color:#475569}.notebook-overlay[data-theme=light] .limit-modal-cancel{border-color:#2c3c5224;background:#0f172a0a;color:#475569}.notebook-overlay[data-theme=light] .limit-modal-cancel:hover{border-color:#2c3c5238;background:#0f172a0f}.notebook-overlay[data-theme=light] .limit-modal-overlay{background:#0f172a66}.notebook-overlay[data-theme=light] .sync-status{border-color:#2c3c521a;background:#0f172a08;color:#94a3b8}.notebook-overlay[data-theme=light] .sync-status.syncing{border-color:#2563eb4d;background:#2563eb14;color:#2563eb}.notebook-overlay[data-theme=light] .sync-status.synced{border-color:#16a34a4d;background:#16a34a0f;color:#16a34a}.notebook-overlay[data-theme=light] .sync-status.error{border-color:#dc26264d;background:#dc26260f;color:#dc2626}.notebook-overlay[data-theme=light] .sync-status.offline{border-color:#d977064d;background:#d977060f;color:#d97706}.notebook-overlay[data-theme=light] .sync-status.idle{border-color:#2563eb2e;background:#2563eb0a;color:#2563eb99}.notebook-overlay[data-theme=light] .whiteboard-loading,.notebook-overlay[data-theme=light] .whiteboard-empty{color:#64748b}