:root{--ink: #282b37;--muted: #8d909d;--line: #e8e9ef;--paper: #fbfbfd;--purple: #6d5bd0;font-family:DM Sans,sans-serif;color:var(--ink);background:#f2f3f7}*{box-sizing:border-box}body{margin:0;min-width:1000px;background:#f3f4f8}button,input{font:inherit}button{cursor:pointer}.shell{max-width:1600px;height:100vh;min-height:700px;margin:auto;display:flex;flex-direction:column;background:var(--paper);overflow:hidden;box-shadow:0 0 50px #cdd0db55}.topbar{height:74px;padding:0 28px;display:flex;align-items:center;border-bottom:1px solid var(--line);background:#fff;flex-shrink:0}.brand{display:flex;align-items:center;gap:9px;color:var(--ink);text-decoration:none;font:700 25px Space Grotesk;letter-spacing:-1.2px}.brand-mark{display:grid;place-items:center;width:26px;height:26px;color:#fff;font-size:15px;background:var(--purple);border-radius:8px;box-shadow:4px 4px #e7e2ff}.room-meta{margin-left:52px;display:flex;gap:9px;align-items:center;font-size:13px;font-weight:600}.live-dot,.status-dot,.online-count i{width:7px;height:7px;border-radius:50%;background:#52b779;display:inline-block}.room-divider{color:#d3d4dc;margin:0 2px}.muted{color:var(--muted);font-weight:400}.top-actions{margin-left:auto;display:flex;align-items:center;gap:18px}.icon-button{border:0;background:none;color:#747888;padding:8px;display:grid;place-items:center}.share-button{display:flex;align-items:center;gap:8px;border:0;border-radius:9px;padding:10px 15px;color:#fff;background:var(--ink);font-size:13px;font-weight:600}.avatar-stack{display:flex;align-items:center;padding-left:4px}.avatar{display:grid;place-items:center;width:29px;height:29px;margin-left:-6px;border:2px solid white;border-radius:50%;font-size:11px;font-weight:700}.peach{background:#f7c7a6}.lavender{background:#d6cffb}.mint{background:#b7dfd0}.more{background:#eff0f5;color:#777b89}.workspace{flex:1;min-height:0;display:flex}.left-rail{width:88px;border-right:1px solid var(--line);background:#fff;padding:19px 10px;display:flex;flex-direction:column;justify-content:space-between}.tool-group{display:grid;gap:8px}.tool{width:66px;padding:9px 3px 8px;display:grid;justify-items:center;gap:5px;border:0;border-radius:9px;background:transparent;color:#9497a4;font-size:10px}.tool i{width:19px;font-size:17px}.tool.active{color:var(--purple);background:#f1effd;font-weight:600}.tool:hover{color:var(--purple);background:#f7f6fc}.canvas-wrap{position:relative;overflow:hidden;flex:1;background:#f8f8fb}.canvas-grid{position:absolute;inset:0;opacity:.46;background-image:radial-gradient(#d8d9e3 1px,transparent 1px);background-size:21px 21px}.canvas-label{position:absolute;top:24px;left:28px;z-index:1;color:#a4a6b1;font:10px DM Mono;letter-spacing:.5px}.canvas-label span{color:#c4c6cf;margin:0 5px}.canvas-hint{position:absolute;left:50%;bottom:19px;transform:translate(-50%);color:#adafba;font-size:10px}.canvas-hint span{padding:0 5px;color:#d1d2da}.zoom-control{position:absolute;z-index:5;right:24px;bottom:17px;display:flex;align-items:center;gap:15px;padding:5px 10px;background:#fff;border:1px solid #e6e7ed;border-radius:7px;box-shadow:0 3px 10px #c6c8d022;font:11px DM Mono;color:#828592}.zoom-control button{border:0;padding:2px 3px;background:none;color:#7b7e8d;font-size:17px;line-height:1}.canvas-wrap.drawing #draw-layer{cursor:crosshair}.canvas-wrap:not(.drawing) #draw-layer{pointer-events:none}#draw-layer{position:absolute;z-index:2;inset:0;width:100%;height:100%}#board{position:absolute;z-index:3;inset:0}.note-card{position:absolute;width:205px;min-height:162px;padding:13px 15px 14px;border-radius:3px;box-shadow:0 9px 18px #3b3e5312,0 2px 4px #3b3e5310;transform:rotate(-1.2deg);transition:box-shadow .15s,transform .15s;cursor:grab}.note-card:hover{box-shadow:0 13px 25px #3b3e5324;transform:rotate(0) translateY(-2px)}.note-card.dragging{cursor:grabbing;transform:rotate(0) scale(1.02);box-shadow:0 18px 30px #3b3e5330}.note-card.yellow{background:#fff2aa}.note-card.pink{background:#ffd9e5;transform:rotate(1.5deg)}.note-card.blue{background:#d3e6fb;transform:rotate(-2deg)}.note-card.green{background:#d9efdf}.note-top{height:13px;display:flex;justify-content:space-between;color:#b9a966}.delete-note{border:0;background:transparent;opacity:0;color:#777;padding:0}.note-card:hover .delete-note{opacity:.7}.grip{opacity:.5;font-size:14px;line-height:8px}.note-card h3{margin:8px 0;font:600 15px Space Grotesk;letter-spacing:-.3px;outline:none}.note-card p{margin:0;min-height:37px;color:#64636a;font-size:12px;line-height:1.45;outline:none}.note-card small{display:block;margin-top:12px;color:#aaa17a;font:9px DM Mono}.pink small{color:#af8995}.blue small{color:#8299b2}.board-image{position:absolute;max-height:180px;object-fit:cover;border:6px solid white;border-radius:2px;box-shadow:0 8px 17px #34374722;transform:rotate(3deg);cursor:grab}.board-image.dragging{cursor:grabbing}.chat-panel{width:290px;display:flex;flex-direction:column;border-left:1px solid var(--line);background:#fff}.chat-header{height:89px;padding:23px 21px 16px;border-bottom:1px solid #f0f0f4;display:flex;justify-content:space-between}.chat-header h2{margin:0;font:600 17px Space Grotesk}.chat-header p{margin:4px 0 0;color:#9c9eaa;font-size:11px}.online-count{padding-top:5px;color:#8d909d;font:10px DM Mono}.online-count i{margin-right:4px;width:6px;height:6px}.messages{padding:22px 18px;overflow-y:auto;flex:1}.message{display:flex;gap:10px;margin-bottom:23px}.chat-avatar{flex:0 0 27px;height:27px;display:grid;place-items:center;border-radius:50%;font-size:11px;font-weight:700;color:#5e6370}.message-body{min-width:0}.message-meta{display:flex;align-items:baseline;gap:7px}.message-meta strong{font-size:11px}.message-meta time{color:#b0b2bd;font:9px DM Mono}.message p{margin:5px 0 0;color:#6e707c;font-size:12px;line-height:1.45}.chat-form{display:flex;margin:0 16px 18px;padding:5px 6px 5px 12px;border:1px solid #e2e3ea;border-radius:9px}.chat-form:focus-within{border-color:#b9b1ed;box-shadow:0 0 0 3px #eeeafd}.chat-form input{min-width:0;flex:1;outline:0;border:0;font-size:11px}.chat-form input::placeholder{color:#b3b5c0}.chat-form button{border:0;color:#fff;background:var(--purple);width:27px;height:27px;border-radius:7px;display:grid;place-items:center}.footer{height:37px;flex-shrink:0;display:flex;align-items:center;padding:0 28px;border-top:1px solid var(--line);background:#fff;color:#9b9da8;font:10px DM Mono}.status-dot{width:5px;height:5px;margin-right:7px;vertical-align:1px}.footer-shortcuts{display:flex;gap:22px;margin:0 auto}.footer-shortcuts kbd{padding:2px 5px;border:1px solid #e4e5eb;border-radius:3px;color:#7e818e;background:#fafafd;font:9px DM Mono}.footer-brand i{color:var(--purple);font-size:13px;margin-left:4px}@media(max-width:1150px){.chat-panel{width:255px}.room-meta{margin-left:25px}.canvas-hint{display:none}}