:root{--bg: #e8efe9;--bg-deep: #d4e0d6;--ink: #1a2420;--muted: #5a6b62;--accent: #0f6b4c;--accent-2: #c45c26;--panel: rgba(255, 252, 248, .92);--line: rgba(26, 36, 32, .12);--shadow: 0 18px 50px rgba(26, 36, 32, .12);--font: "DM Sans", system-ui, sans-serif;--display: "Fraunces", Georgia, serif}*{box-sizing:border-box}html,body,#root{margin:0;height:100%;font-family:var(--font);color:var(--ink);background:var(--bg)}button,input{font:inherit}a{color:var(--accent);text-decoration:none}.center-screen{min-height:100%;display:grid;place-items:center;padding:24px}.auth-shell{min-height:100%;display:grid;place-items:center;padding:32px 20px;background:radial-gradient(ellipse 80% 60% at 10% 20%,rgba(15,107,76,.18),transparent 55%),radial-gradient(ellipse 70% 50% at 90% 80%,rgba(196,92,38,.14),transparent 50%),linear-gradient(160deg,#eef4ef,#dfe9e1 45%,#f3ebe3)}.auth-card{width:min(420px,100%);background:var(--panel);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--line);border-radius:28px;padding:36px 32px 28px;box-shadow:var(--shadow);animation:rise .6s ease both}@keyframes rise{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}.brand{font-family:var(--display);font-size:2.6rem;line-height:1;margin:0 0 8px;letter-spacing:-.03em;color:var(--ink)}.brand-with-mark{display:inline-flex;align-items:center;justify-content:center;gap:8px}.brand-word{white-space:nowrap;letter-spacing:-.03em}.brand span,.brand-word>span{color:var(--accent)}a.brand,a.brand-mini{color:var(--ink)}.auth-card p{margin:0 0 24px;color:var(--muted)}.auth-card form{display:grid;gap:12px}.auth-card label{display:grid;gap:6px;font-size:.9rem;color:var(--muted)}.auth-card input{border:1px solid var(--line);border-radius:12px;padding:12px 14px;background:#fff;color:var(--ink)}.auth-card input:focus{outline:2px solid rgba(15,107,76,.35);border-color:var(--accent)}.btn{border:none;border-radius:12px;padding:12px 16px;cursor:pointer;background:var(--accent);color:#fff;font-weight:600;transition:transform .15s ease,background .15s ease}.btn:hover{transform:translateY(-1px);background:#0c5a40}.btn.secondary{background:transparent;color:var(--ink);border:1px solid var(--line)}.btn.danger{background:#b33a2b}.error{color:#b33a2b;font-size:.9rem;margin:0}.auth-switch{margin-top:18px;text-align:center;color:var(--muted);font-size:.95rem}.boards-page{min-height:100%;padding:28px 24px 48px;background:linear-gradient(180deg,rgba(255,255,255,.35),transparent 180px),radial-gradient(circle at 80% 0%,rgba(15,107,76,.12),transparent 40%),var(--bg)}.boards-header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:28px;max-width:1100px;margin-inline:auto}.boards-header h1{font-family:var(--display);font-size:2rem;margin:0}.boards-header .meta{color:var(--muted);font-size:.95rem}.boards-actions{display:flex;gap:10px;flex-wrap:wrap}.boards-grid{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}.board-card{background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:18px;cursor:pointer;transition:transform .18s ease,box-shadow .18s ease;text-align:left;width:100%;color:inherit}.board-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}.board-card h3{margin:0 0 8px;font-size:1.1rem}.board-card .date{color:var(--muted);font-size:.85rem}.board-card .row{display:flex;justify-content:space-between;align-items:center;margin-top:14px}.board-shell{height:100%;display:grid;grid-template-rows:auto 1fr;overflow:hidden}.board-top{display:flex;align-items:center;gap:12px;padding:10px 14px;background:#fffcf8f0;border-bottom:1px solid var(--line);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:5}.board-top .brand-mini{font-family:var(--display);font-weight:700;font-size:1.15rem;margin-right:4px;color:var(--ink);display:inline-flex;align-items:center;gap:6px}.board-top .brand-mini .brand-word>span{color:var(--accent)}.brand-mark{width:28px;height:28px;display:block;flex-shrink:0;object-fit:contain}.brand-with-mark .brand-mark{width:40px;height:40px}.board-top input.title{border:none;background:transparent;font-weight:600;font-size:1rem;min-width:160px;flex:1;max-width:360px;padding:6px 8px;border-radius:8px}.board-top input.title:focus{outline:2px solid rgba(15,107,76,.25);background:#fff}.board-top .spacer{flex:1}.presence{display:flex;gap:6px;align-items:center;color:var(--muted);font-size:.85rem}.board-body{position:relative;overflow:hidden;background:#f4f7f4}.menu-wrap{position:relative}.dropdown{position:absolute;right:0;top:calc(100% + 6px);z-index:20;min-width:140px;background:#fffcf8fa;border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);padding:6px;display:flex;flex-direction:column;gap:2px}.dropdown.wide{min-width:260px}.dropdown button{border:none;background:transparent;text-align:left;padding:8px 10px;border-radius:8px;cursor:pointer;font:inherit}.dropdown button:hover{background:#0f6b4c1a}.presence-row{display:flex;align-items:center;gap:6px;padding:4px 6px;font-size:.85rem}.presence-row span{flex:1}.presence-row button{padding:4px 6px!important;font-size:.75rem!important}.toast{position:absolute;top:58px;left:50%;transform:translate(-50%);z-index:30;display:flex;gap:8px;align-items:center;padding:10px 14px;background:#fffcf8fa;border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow)}.swatches{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.swatch{width:28px;height:28px;border-radius:8px;border:2px solid transparent;cursor:pointer}.swatch.active{border-color:var(--ink)}.emoji-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:4px}.emoji-grid button{border:1px solid var(--line);background:#fff;border-radius:8px;font-size:1.2rem;cursor:pointer;padding:4px}.emoji-grid button.active{border-color:var(--accent);background:#0f6b4c1a}.shape-pick{border:1px solid var(--line);background:#fff;border-radius:8px;padding:6px 8px;text-align:left;cursor:pointer;font:inherit;font-size:.85rem}.shape-pick.active{border-color:var(--accent);background:#0f6b4c1a}.fmt-row{display:flex;gap:4px}.fmt-row button{flex:1;border:1px solid var(--line);background:#fff;border-radius:8px;padding:6px;cursor:pointer;font-weight:700}.fmt-row button.active{background:var(--accent);color:#fff;border-color:var(--accent)}.text-fmt .tool-opt select{width:100%;padding:6px;border-radius:8px;border:1px solid var(--line)}.google-btn{display:block;text-align:center;margin-bottom:14px;background:#fff;color:var(--ink);border:1px solid var(--line);text-decoration:none}.google-btn:hover{background:#f5f5f5}.toolbar{position:absolute;left:14px;top:50%;transform:translateY(-50%);z-index:4;display:flex;flex-direction:column;gap:6px;padding:8px;background:#fffcf8f2;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow);animation:slideIn .45s ease both}@keyframes slideIn{0%{opacity:0;transform:translate(-8px,-50%)}to{opacity:1;transform:translateY(-50%)}}.tool-btn{width:42px;height:42px;border-radius:12px;border:none;background:transparent;cursor:pointer;color:var(--ink);display:grid;place-items:center;transition:background .15s ease,color .15s ease}.tool-btn:hover{background:#0f6b4c1a}.tool-btn.active{background:var(--accent);color:#fff}.tool-btn svg{width:20px;height:20px}.tool-btn:disabled{opacity:.35;cursor:default}.toolbar-hist{display:flex;flex-direction:column;gap:4px;margin-top:6px;padding-top:8px;border-top:1px solid var(--line)}.toolbar-more-wrap{position:relative;z-index:6}.toolbar-more-menu{position:absolute;left:calc(100% + 12px);top:0;transform:none;z-index:12;min-width:200px;max-width:min(260px,calc(100vw - 96px));max-height:min(60vh,420px);overflow:auto;padding:8px;display:flex;flex-direction:column;gap:2px;background:#fffcf8fa;border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow)}.toolbar-more-menu button{display:flex;align-items:center;gap:10px;width:100%;border:none;background:transparent;text-align:left;padding:10px 12px;border-radius:10px;cursor:pointer;color:var(--ink);font:inherit;font-size:.9rem}.toolbar-more-menu button:hover{background:#0f6b4c1a}.toolbar-more-menu button.active{background:#0f6b4c24}.toolbar-more-icon{display:grid;place-items:center;width:22px;height:22px;flex-shrink:0}.toolbar-more-icon svg{width:18px;height:18px}.tool-ctx-menu,.tool-options{position:absolute;left:72px;top:50%;transform:translateY(-50%);z-index:8;width:220px;max-height:min(70vh,480px);overflow:auto;padding:12px 14px;background:#fffcf8f7;border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:10px;animation:rise .25s ease both}.tool-ctx-menu.anchored{transform:none!important;right:auto;bottom:auto;max-width:min(280px,calc(100% - 16px));max-height:min(70vh,calc(100% - 16px))}.avatar.photo-av{object-fit:cover;padding:0;border-radius:50%}.avatar-upload-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px}.recaptcha-wrap{margin:8px 0;min-height:78px}.tool-opt select{width:100%;height:34px;border:1px solid var(--line);border-radius:10px;background:#fff;padding:0 8px}.tool-options-title{font-weight:700;font-size:.9rem}.tool-opt{display:grid;gap:6px;font-size:.78rem;color:var(--muted)}.tool-opt input[type=color]{width:100%;height:34px;border:1px solid var(--line);border-radius:10px;background:#fff;cursor:pointer;padding:2px}.tool-opt input[type=range]{width:100%;accent-color:var(--accent)}.brush-preview{align-self:center;border-radius:50%;margin-top:2px;box-shadow:0 0 0 1px #1a242014}.brush-preview.eraser{background:#fff;border:2px dashed rgba(26,36,32,.35)}.canvas-wrap{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden}.canvas-wrap canvas{display:block}.youtube-overlay{position:absolute;z-index:5;pointer-events:none;overflow:hidden;border-radius:6px;box-shadow:0 0 0 1px #0003;background:#111}.youtube-frame{width:100%;height:100%;pointer-events:none;background:#111}.youtube-frame iframe{display:block;border:0;pointer-events:none;background:#000}.youtube-play-btn{pointer-events:auto;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:52px;height:52px;border:none;border-radius:50%;background:#000000a6;color:#fff;font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:5}.youtube-play-btn[hidden]{display:none!important}.youtube-play-btn:hover{background:#c80000d9}.youtube-seek{pointer-events:auto;position:absolute;left:8px;right:8px;bottom:8px;z-index:6;display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:10px;background:#000000b8;color:#fff}.youtube-seek[hidden]{display:none!important}.youtube-seek-play{flex:0 0 auto;width:28px;height:28px;border:none;border-radius:50%;background:#ffffff26;color:#fff;cursor:pointer;font-size:11px;display:grid;place-items:center}.youtube-seek-play:hover{background:#c80000d9}.youtube-seek-range{flex:1 1 auto;min-width:0;accent-color:#ff0033;cursor:pointer}.youtube-seek-time{flex:0 0 auto;font-size:11px;font-variant-numeric:tabular-nums;opacity:.9;min-width:4.5em;text-align:right}.table-ctx{position:absolute;z-index:8;min-width:220px;max-width:min(280px,calc(100% - 8px));max-height:min(70vh,calc(100% - 8px));overflow:auto;background:#fffcf8fa;border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);padding:6px;display:flex;flex-direction:column;gap:2px}.table-ctx-caption{font-size:11px;color:var(--muted);font-weight:600;padding:6px 10px 4px}.table-ctx button{border:none;background:transparent;text-align:left;padding:8px 10px;border-radius:8px;cursor:pointer;color:var(--ink);font:inherit;font-size:.9rem}.table-ctx button:hover:not(:disabled){background:#0f6b4c1a}.table-ctx button:disabled{opacity:.4;cursor:default}.cell-editor{position:absolute;z-index:7;margin:0;padding:8px;border:2px solid var(--accent);border-radius:4px;background:#fff;color:var(--ink);font:14px DM Sans,sans-serif;resize:none;outline:none;box-shadow:var(--shadow);line-height:1.3}.remote-cursors{pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;z-index:3}.remote-cursor{position:absolute;transform:translate(-2px,-2px);will-change:left,top;contain:layout style}.remote-cursor .dot{width:10px;height:10px;border-radius:50%;background:var(--accent-2);box-shadow:0 0 0 2px #fff}.remote-cursor .label{margin-top:4px;font-size:11px;background:var(--ink);color:#fff;padding:2px 6px;border-radius:6px;white-space:nowrap}.empty-hint{max-width:1100px;margin:40px auto;color:var(--muted);text-align:center}.ok-hint{max-width:720px;margin:12px auto;color:var(--accent);text-align:center}.settings-page .settings-card,.settings-card{max-width:520px;margin:16px auto;padding:20px 22px;background:var(--panel);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:12px}.settings-card.compact{margin:0;flex:1}.settings-card h2{margin:0;font-family:var(--display);font-size:1.25rem}.settings-card input,.settings-card select,.title-input{width:100%;height:40px;border:1px solid var(--line);border-radius:10px;padding:0 12px;background:#fff}.title-input{font-size:1.35rem;font-weight:700;font-family:var(--display);height:48px}.class-actions{max-width:1100px;margin:0 auto 24px;padding:0 20px;display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}.class-columns{max-width:1100px;margin:0 auto;padding:0 20px 40px;display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px}.class-columns .settings-card{max-width:none;margin:0}.avatar-row{display:flex;align-items:center;gap:14px}.avatar{width:64px;height:64px;border-radius:50%;object-fit:cover;border:1px solid var(--line)}.avatar.sm{width:44px;height:44px}.avatar.xs{width:28px;height:28px;font-size:.85rem}.avatar.emoji-av{font-size:1.4rem;line-height:1}.avatar.sm.emoji-av{font-size:1.25rem}.member-name{display:inline-flex;align-items:center;gap:8px}.board-actions{display:flex;align-items:center;gap:8px}.btn.chip{border-radius:999px;padding:6px 12px;font-size:.85rem;background:#0f6b4c14;border:1px solid var(--line);color:var(--ink)}.btn.icon-menu{width:40px;padding:0;font-size:1.35rem;line-height:1}.lock-fab{position:absolute;z-index:6;width:36px;height:36px;border-radius:10px;border:1px solid var(--line);background:#fffcf8f5;color:var(--ink);display:grid;place-items:center;cursor:pointer;box-shadow:var(--shadow)}.lock-fab.locked{background:var(--accent);color:#fff;border-color:transparent}.zoom-widget{position:absolute;right:16px;bottom:16px;z-index:6;display:flex;align-items:center;gap:2px;padding:4px;background:#fffcf8f5;border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow)}.zoom-btn,.zoom-pct{border:none;background:transparent;color:var(--ink);cursor:pointer;font:inherit;height:32px;min-width:32px;border-radius:8px}.zoom-pct{min-width:52px;font-weight:700;font-variant-numeric:tabular-nums}.zoom-btn:hover,.zoom-pct:hover{background:#0f6b4c1a}.zoom-sep{width:1px;height:20px;background:var(--line);margin:0 2px}.board-nav{position:absolute;right:16px;bottom:60px;z-index:7;width:180px;height:120px;background:#fffcf8f7;border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);overflow:hidden;cursor:crosshair}.board-nav-svg{width:100%;height:100%;display:block}.eraser-cursor-layer{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:5}.eraser-cursor-ring,.eraser-trail-dot{position:absolute;border-radius:50%;transform:translate(-50%,-50%);border:1.5px solid rgba(26,36,32,.55);background:#1a242014;pointer-events:none}.eraser-trail-dot{border:none;background:#1a242033}.sticky-label{position:absolute;z-index:3;pointer-events:none;overflow:hidden;white-space:pre-wrap;word-break:break-word;line-height:1.35;box-sizing:border-box}.cell-editor.sticky-editor{background:transparent;border:1px dashed rgba(26,36,32,.25);resize:none;overflow:auto;font:16px/1.35 DM Sans,Noto Sans,sans-serif;color:#1a2420;padding:0;box-shadow:none}.cell-editor{resize:none;overflow:auto!important}.board-shell:fullscreen,.board-shell:-webkit-full-screen{width:100vw;height:100vh;background:var(--bg, #f4f7f4)}.avatar.placeholder{display:grid;place-items:center;background:#0f6b4c1f;font-weight:700;color:var(--accent)}.boards-brand-row{display:flex;align-items:center;gap:14px}.file-btn{display:inline-flex;cursor:pointer}.member-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.member-list li{display:flex;justify-content:space-between;align-items:center;gap:8px}.attach-row{display:flex;gap:8px}.attach-row select{flex:1}.boards-grid.tight{margin-top:12px}.board-card.static{cursor:default;display:flex;justify-content:space-between;align-items:center;gap:8px}.board-card-title{font-weight:700}.board-card-meta{color:var(--muted);font-size:.85rem;margin-top:6px}.linkish{background:none;border:none;padding:0;cursor:pointer;color:var(--accent);font:inherit;font-weight:700;text-align:left}@media(max-width:640px){.boards-header{flex-direction:column;align-items:flex-start}.toolbar{left:50%;top:auto;bottom:14px;transform:translate(-50%);flex-direction:row}@keyframes slideIn{0%{opacity:0;transform:translate(-50%,8px)}to{opacity:1;transform:translate(-50%)}}.tool-options,.tool-ctx-menu{left:50%;top:auto;bottom:72px;transform:translate(-50%);width:min(280px,calc(100vw - 24px))}.toolbar-hist{flex-direction:row;margin-top:0;margin-left:6px;padding-top:0;padding-left:8px;border-top:none;border-left:1px solid var(--line)}.toolbar-more-menu{left:50%;right:auto;top:auto;bottom:calc(100% + 10px);transform:translate(-50%);min-width:220px}}