:root{color:#f6f7f9;background:#0b0d11;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}button,input,textarea{font:inherit}button{border:1px solid #353a46;border-radius:8px;color:#f6f7f9;background:#1a1e27;cursor:pointer;transition:border-color .12s ease,background .12s ease}button:hover:not(:disabled){border-color:#646c7d;background:#222733}button:disabled{cursor:not-allowed;opacity:.45}input{width:100%;min-height:44px;border:1px solid #303541;border-radius:8px;outline:none;color:#f6f7f9;background:#11141a;padding:0 13px}textarea{width:100%;border:1px solid #303541;border-radius:8px;outline:none;color:#f6f7f9;background:#11141a;padding:10px 11px;resize:none}textarea:focus{border-color:#ff445d;box-shadow:0 0 0 3px #ff445d1f}input:focus{border-color:#ff445d;box-shadow:0 0 0 3px #ff445d1f}label{display:block;color:#c5c9d2;font-size:.86rem;font-weight:600;margin:0 0 7px}.primary{border-color:#ff445d;background:#e93650;font-weight:700}.primary:hover:not(:disabled){border-color:#ff5f75;background:#f2445d}.full-width{width:100%;min-height:44px;margin-top:14px}.home-page{display:grid;min-height:100vh;place-items:center;padding:24px;background:radial-gradient(circle at 50% 15%,rgb(233 54 80 / 13%),transparent 31rem),#0b0d11}.home-card{width:min(100%,410px);border:1px solid #282d37;border-radius:14px;background:#11141a;box-shadow:0 24px 80px #00000059;padding:34px}.brand-mark{display:grid;width:42px;height:42px;border-radius:12px;place-items:center;color:#fff;background:#e93650;font-size:.9rem}.home-card h1{margin:18px 0 4px;font-size:2rem;letter-spacing:-.04em}.muted{color:#9096a3;margin:0 0 28px}.inline-form{display:grid;grid-template-columns:1fr auto;gap:8px}.inline-form button{min-width:76px}.divider{display:flex;align-items:center;gap:12px;color:#747b89;font-size:.78rem;margin:25px 0;text-transform:uppercase}.divider:before,.divider:after{content:"";height:1px;background:#292e38;flex:1}.form-error,.player-error{color:#ff8495;font-size:.86rem;margin:12px 0 0}.room-page{min-height:100vh;background:#0b0d11}.room-header{display:flex;min-height:62px;border-bottom:1px solid #242832;align-items:center;justify-content:space-between;padding:0 22px}.brand{color:#fff;font-size:1.18rem;font-weight:800;letter-spacing:-.03em;text-decoration:none}.brand:before{content:"▶";display:inline-grid;width:28px;height:28px;border-radius:7px;place-items:center;color:#fff;background:#e93650;font-size:.57rem;margin-right:9px;vertical-align:2px}.room-meta{display:flex;align-items:center;gap:9px;color:#9da3b0;font-size:.85rem}.room-meta strong{color:#e7e9ed;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.connection-dot{width:7px;height:7px;border-radius:50%;background:#6d7380}.connection-dot.online{background:#43c783;box-shadow:0 0 0 3px #43c7831f}.small-button{min-height:32px;margin-left:8px;padding:0 11px;font-size:.8rem}.room-layout{display:grid;min-height:calc(100vh - 62px);grid-template-columns:minmax(0,1fr) 320px}.video-panel{align-self:start;min-width:0;padding:22px}.player-surface{--youtube-controls-height: 48px;position:relative;overflow:hidden;width:100%;aspect-ratio:16 / 9;border:1px solid #252a34;border-radius:10px 10px 0 0;background:#050607}.youtube-mount,.youtube-mount iframe{display:block;width:100%;height:100%}.drawing-canvas{position:absolute;z-index:2;inset:0;width:100%;height:100%;clip-path:inset(0 0 var(--youtube-controls-height) 0);pointer-events:none}.drawing-canvas.draw,.drawing-canvas.emoji{pointer-events:auto;touch-action:none}.drawing-canvas.draw{cursor:crosshair}.drawing-canvas.emoji{cursor:cell}.cursor-capture-layer{position:absolute;z-index:1;inset:0 0 var(--youtube-controls-height);cursor:default}.emoji-pointer-layer{position:absolute;z-index:4;inset:0;overflow:hidden;pointer-events:none}.emoji-pointer{position:absolute;display:grid;min-width:54px;justify-items:center;filter:drop-shadow(0 3px 7px rgb(0 0 0 / 70%));pointer-events:none;transform:translate(-50%,-50%);animation:emoji-pointer-pop 1.8s ease-out forwards}.emoji-pointer b{font-size:clamp(1.8rem,4vw,3.4rem);line-height:1}.emoji-pointer small{overflow:hidden;max-width:110px;border-radius:10px;color:#fff;background:#0a0c10c7;font-size:.65rem;margin-top:4px;padding:2px 6px;text-overflow:ellipsis;white-space:nowrap}@keyframes emoji-pointer-pop{0%{opacity:0;transform:translate(-50%,-25%) scale(.35)}18%{opacity:1;transform:translate(-50%,-50%) scale(1.2)}72%{opacity:1;transform:translate(-50%,-62%) scale(1)}to{opacity:0;transform:translate(-50%,-100%) scale(.8)}}.chat-reaction-layer{position:absolute;z-index:3;inset:0;overflow:hidden;pointer-events:none}.chat-reaction-track{position:absolute;right:0;left:0;display:flex;will-change:transform;animation-name:chat-reaction-travel;animation-timing-function:linear;animation-fill-mode:forwards}.chat-reaction{display:flex;overflow:hidden;max-width:min(70%,32rem);min-height:26px;border:1px solid rgb(255 255 255 / 12%);border-radius:999px;align-items:center;gap:6px;color:#f4f5f7;background:#080a0ec7;box-shadow:0 3px 12px #00000073;font-size:clamp(.7rem,1.25vw,.86rem);line-height:1;margin:0;padding:5px 9px;white-space:nowrap}.chat-reaction strong{color:#ff8b9b;flex:none;font-size:.9em}.chat-reaction span{overflow:hidden;text-overflow:ellipsis}@keyframes chat-reaction-travel{0%{opacity:0;transform:translate(68%)}6%{opacity:1}92%{opacity:1}to{opacity:0;transform:translate(-100%)}}.comic-reaction-position{position:absolute;width:max-content;max-width:min(46%,30rem);transform:translate(-50%,-50%)}.comic-reaction{--comic-background: #ffd84d;--comic-ink: #17120b;--comic-accent: #ff445d;display:grid;width:100%;min-width:118px;clip-path:polygon(4% 17%,13% 15%,10% 2%,24% 11%,33% 0,41% 10%,55% 3%,61% 13%,76% 5%,78% 17%,96% 15%,89% 31%,100% 41%,89% 51%,98% 67%,82% 68%,87% 86%,70% 79%,61% 100%,50% 86%,37% 97%,31% 82%,13% 91%,17% 72%,1% 67%,10% 51%,0 39%,12% 32%);place-items:center;color:var(--comic-ink);background:var(--comic-background);filter:drop-shadow(0 5px 0 rgb(0 0 0 / 55%)) drop-shadow(0 10px 16px rgb(0 0 0 / 45%));padding:clamp(16px,2.8vw,25px) clamp(20px,3.6vw,34px);text-align:center;animation-duration:var(--comic-duration);animation-fill-mode:forwards;animation-timing-function:ease-out}.comic-reaction small{max-width:100%;border-radius:999px;color:var(--comic-background);background:var(--comic-ink);font-size:clamp(.52rem,.9vw,.68rem);font-weight:800;letter-spacing:.04em;margin-bottom:4px;padding:3px 7px;text-overflow:ellipsis;text-transform:none;white-space:nowrap}.comic-reaction strong{display:-webkit-box;overflow:hidden;max-width:100%;color:var(--comic-ink);font-family:Impact,Haettenschweiler,Arial Narrow Bold,sans-serif;font-size:clamp(.95rem,2.25vw,1.5rem);font-weight:900;letter-spacing:.035em;line-height:.98;overflow-wrap:anywhere;text-shadow:1px 1px 0 var(--comic-accent);text-transform:uppercase;-webkit-box-orient:vertical;-webkit-line-clamp:3}.comic-size-0 strong{font-size:clamp(.88rem,2vw,1.3rem)}.comic-size-2 strong{font-size:clamp(1.02rem,2.55vw,1.68rem)}.comic-palette-1{--comic-background: #ff638b;--comic-ink: #fffaf5;--comic-accent: #462038}.comic-palette-2{--comic-background: #52dfe5;--comic-ink: #07151b;--comic-accent: #ff4d68}.comic-palette-3{--comic-background: #8d70ff;--comic-ink: #fff;--comic-accent: #2a194f}.comic-palette-4{--comic-background: #ff934f;--comic-ink: #1b0d06;--comic-accent: #fff074}.comic-effect-0{animation-name:comic-reaction-pop}.comic-effect-1{animation-name:comic-reaction-slam}.comic-effect-2{animation-name:comic-reaction-wobble}@keyframes comic-reaction-pop{0%{opacity:0;transform:rotate(var(--comic-rotation)) scale(.2)}12%{opacity:1;transform:rotate(var(--comic-rotation)) scale(1.18)}19%,82%{opacity:1;transform:rotate(var(--comic-rotation)) scale(1)}to{opacity:0;transform:rotate(var(--comic-rotation)) translateY(-10px) scale(.88)}}@keyframes comic-reaction-slam{0%{opacity:0;transform:translate(var(--comic-entry-x)) rotate(var(--comic-rotation)) scale(1.7)}10%{opacity:1;transform:translate(0) rotate(var(--comic-rotation)) scale(.92)}16%,82%{opacity:1;transform:rotate(var(--comic-rotation)) scale(1)}to{opacity:0;transform:rotate(var(--comic-rotation)) scale(1.08)}}@keyframes comic-reaction-wobble{0%{opacity:0;transform:rotate(var(--comic-rotation)) scale(.55)}10%{opacity:1;transform:rotate(calc(var(--comic-rotation) - 5deg)) scale(1.08)}14%{transform:rotate(calc(var(--comic-rotation) + 4deg)) scale(1)}18%,82%{opacity:1;transform:rotate(var(--comic-rotation)) scale(1)}to{opacity:0;transform:rotate(calc(var(--comic-rotation) + 3deg)) scale(.92)}}.live-cursor-layer{position:absolute;z-index:5;inset:0;overflow:hidden;pointer-events:none}.live-cursor{position:absolute;display:flex;border-color:currentColor;align-items:flex-start;filter:drop-shadow(0 2px 4px rgb(0 0 0 / 75%));transition:left 85ms linear,top 85ms linear;will-change:left,top}.live-cursor svg{width:17px;height:22px;color:inherit;flex:none;fill:currentColor;stroke:#080a0e;stroke-linejoin:round;stroke-width:2}.live-cursor small{overflow:hidden;max-width:110px;border:1px solid;border-color:inherit;border-radius:999px;color:#fff;background:#080a0ed6;font-size:.64rem;font-weight:700;line-height:1;margin:14px 0 0 -2px;padding:4px 6px;text-overflow:ellipsis;white-space:nowrap}@media(pointer:coarse){.cursor-capture-layer{display:none}}.player-placeholder{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:16px;color:#777e8b;pointer-events:none}.placeholder-icon{display:grid;width:54px;height:54px;border:1px solid #343945;border-radius:50%;place-items:center;color:#aeb3bd;padding-left:3px}.video-controls{display:grid;min-height:55px;border:1px solid #292e38;border-top:0;border-radius:0;grid-template-columns:auto auto minmax(80px,1fr) auto auto auto;align-items:center;gap:11px;background:#12151b;padding:0 14px}.drawing-toolbar{display:flex;min-height:54px;border:1px solid #292e38;border-top:0;border-radius:0 0 10px 10px;align-items:center;gap:7px;background:#0f1217;padding:8px 10px}.drawing-toolbar button{min-height:34px;padding:0 10px;font-size:.77rem;white-space:nowrap}.drawing-toolbar button.active{border-color:#ff536a;color:#fff;background:#d8324a}.drawing-toolbar .danger-button:hover:not(:disabled){border-color:#a63d4d;color:#ff8b9b;background:#2a171d}.tool-field{display:flex;min-width:auto;align-items:center;gap:6px;margin:0}.tool-field span{color:#7e8592;font-size:.68rem}.tool-field select{min-width:60px;height:34px;border:1px solid #353a46;border-radius:7px;color:#edf0f4;background:#171b23;padding:0 7px}.color-field input[type=color]{width:34px;min-height:34px;height:34px;border-radius:7px;padding:3px}.toolbar-spacer{flex:1}.icon-button{width:34px;height:34px;border:0;background:transparent;font-size:.9rem}.time{min-width:38px;color:#a0a6b2;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.75rem}.seek-slider{min-height:auto;height:4px;border:0;box-shadow:none;accent-color:#e93650;padding:0}.volume-controls{display:flex;align-items:center;gap:4px}.volume-slider{width:76px;min-height:auto;height:4px;border:0;box-shadow:none;accent-color:#e93650;padding:0}.youtube-controls-button{min-height:34px;padding:0 10px;font-size:.72rem;white-space:nowrap}.youtube-controls-button.active{border-color:#ff536a;background:#d8324a}.load-video-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:9px;margin-top:16px}.load-video-form button{min-width:82px}.room-error{min-height:20px}.sidebar{display:flex;height:calc(100vh - 62px);min-height:calc(100vh - 62px);border-left:1px solid #242832;flex-direction:column;background:#0f1217}.users-panel{max-height:34%;overflow-y:auto}.sidebar-heading{display:flex;min-height:54px;border-bottom:1px solid #242832;align-items:center;gap:8px;padding:0 17px}.sidebar-heading h2{font-size:.9rem;margin:0}.count-badge{display:grid;min-width:20px;height:20px;border-radius:10px;place-items:center;color:#9da3af;background:#242933;font-size:.7rem}.user-list{list-style:none;margin:0;padding:10px}.user-list li{display:flex;min-height:43px;border-radius:7px;align-items:center;gap:10px;padding:5px 7px;font-size:.86rem}.user-list small{color:#767d8a;margin-left:auto}.avatar{display:grid;width:29px;height:29px;border-radius:50%;place-items:center;color:#ff96a4;background:#382029;font-size:.74rem;font-weight:700}.chat-panel{display:flex;min-height:0;border-top:1px solid #242832;flex:1;flex-direction:column}.chat-messages{min-height:0;overflow-y:auto;flex:1;padding:12px}.empty-chat{color:#6f7683;font-size:.8rem;margin:24px 8px;text-align:center}.chat-message{border-radius:8px;margin-bottom:5px;padding:8px 9px}.chat-message:hover,.chat-message.own{background:#151920}.message-meta{display:flex;align-items:baseline;gap:7px}.message-meta strong{overflow:hidden;color:#ff8b9b;font-size:.78rem;text-overflow:ellipsis;white-space:nowrap}.chat-message.own .message-meta strong{color:#82b4ff}.message-meta time{color:#666d7a;font-size:.66rem}.comic-message-badge{border-radius:999px;color:#ffce51;background:#332814;font-size:.58rem;font-weight:800;padding:2px 5px}.chat-message p{overflow-wrap:anywhere;color:#d6d9df;font-size:.83rem;line-height:1.45;margin:3px 0 0;white-space:pre-wrap}.chat-form{border-top:1px solid #242832;padding:10px}.chat-form textarea{display:block;min-height:58px;max-height:110px;font-size:.82rem}.chat-form-footer{display:flex;align-items:center;justify-content:space-between;margin-top:7px}.chat-form-footer span{color:#646b78;font-size:.68rem}.chat-form-footer button{min-height:31px;padding:0 12px;font-size:.76rem;font-weight:700}.chat-form-actions{display:flex;align-items:center;gap:6px}.chat-form-footer .comic-mode-button{border-color:#4a3d23;color:#d7b85f;background:#211c12}.chat-form-footer .comic-mode-button.active{border-color:#ffca3a;color:#17120b;background:#ffca3a;box-shadow:0 0 0 3px #ffca3a1f}.theater .room-layout{grid-template-columns:minmax(0,1fr)}.theater .sidebar{display:none}.theater .video-panel{padding:12px}.theater .player-surface{max-height:calc(100vh - 160px);aspect-ratio:auto;height:calc(100vh - 160px)}@media(max-width:820px){.room-layout{grid-template-columns:1fr}.sidebar{height:520px;min-height:auto;border-top:1px solid #242832;border-left:0}.video-panel{padding:12px}.users-panel{max-height:170px}.drawing-toolbar{flex-wrap:wrap}.toolbar-spacer{display:none}}@media(max-width:520px){.home-card{border:0;background:transparent;box-shadow:none;padding:12px}.room-header{padding:0 12px}.room-meta>span:nth-of-type(2){display:none}.small-button{margin-left:2px}.video-controls{grid-template-columns:auto auto minmax(52px,1fr) auto auto auto;gap:7px;padding:0 8px}.volume-slider{display:none}.youtube-controls-button{width:34px;padding:0}.youtube-controls-button span{display:none}.load-video-form{grid-template-columns:1fr}.load-video-form button{min-height:42px}}