:root{--ink: #101214;--text: #292a2e;--muted: #6b6e76;--line: #f1f0f3;--line-strong: #dfdde3;--pill: #e9f2fe;--pill-hover: #d3e4fc;--brand: #625df5;--brand-dark: #4b45e0;--danger: #d93a3a;--bg: #ffffff;--soft: #f8f7fa;--font: "Figtree", system-ui, sans-serif}*{box-sizing:border-box}html,body{margin:0}body{font:400 16px/24px var(--font);color:var(--text);background:var(--bg)}button,input,select{font:inherit;color:inherit}a{color:inherit}.topbar{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:24px;padding:14px 32px;background:#ffffffeb;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}.logo{display:flex;align-items:center;gap:8px;font-weight:800;font-size:20px;color:var(--ink);text-decoration:none}.logo-mark{width:26px;height:26px}.nav{display:flex;gap:4px}.nav a{text-decoration:none;padding:6px 12px;border-radius:9999px;font-size:14px;font-weight:500}.nav a.active,.nav a:hover{background:var(--soft)}.spacer{flex:1}main{max-width:1240px;margin:0 auto;padding:40px 32px 80px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:9999px;padding:14px 21px;font:700 14px/24px var(--font);cursor:pointer;text-decoration:none;background:var(--pill);color:#000;transition:background .15s}.btn:hover{background:var(--pill-hover)}.btn.primary{background:var(--brand);color:#fff}.btn.primary:hover{background:var(--brand-dark)}.btn.danger{background:var(--danger);color:#fff}.btn.ghost{background:transparent;border:1px solid var(--line-strong)}.btn.small{padding:6px 14px;font-size:13px}.btn:disabled{opacity:.5;cursor:not-allowed}.toggle{display:inline-flex;padding:4px;border-radius:9999px;background:var(--soft)}.toggle button{border:0;background:none;padding:6px 16px;border-radius:9999px;cursor:pointer;font-weight:500;font-size:14px}.toggle button.on{background:#fff;box-shadow:0 1px 3px #0000001f;font-weight:700}.toggle button:disabled{opacity:.4;cursor:not-allowed}.lib-head{display:flex;align-items:center;gap:16px;margin-bottom:24px;flex-wrap:wrap}.lib-head h1{margin:0;font-size:32px;color:var(--ink)}.quota{font-size:14px;color:var(--muted)}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:20px}.tile{border:1px solid var(--line);border-radius:16px;overflow:hidden;text-decoration:none;background:#fff}.tile:hover{border-color:var(--line-strong)}.thumb{aspect-ratio:16/9;background:#111;display:block;width:100%;object-fit:cover}.tile .meta{padding:10px 14px}.tile .meta strong{display:block;color:var(--ink);font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tile .meta span{font-size:12px;color:var(--muted)}.empty{text-align:center;padding:80px 0;color:var(--muted);border:1px dashed var(--line-strong);border-radius:24px}.recorder{display:grid;gap:16px;max-width:960px;margin:0 auto}.stage{position:relative;aspect-ratio:16/9;background:#18181b;border-radius:20px;overflow:hidden;display:grid;place-items:center;color:#8b8b93}.stage .live{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:contain}.stage .cam-full{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;transform:scaleX(-1)}.stage .placeholder{font-size:15px}.bubble{position:absolute;border-radius:50%;overflow:hidden;background:#000;box-shadow:0 4px 16px #0006;transition:all .2s}.bubble video{width:100%;height:100%;object-fit:cover;transform:scaleX(-1)}.countdown{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;background:#00000073;color:#fff;font:800 120px/1 var(--font)}.timer{position:absolute;top:14px;left:14px;background:#000000b3;color:#fff;padding:4px 12px;border-radius:9999px;font-variant-numeric:tabular-nums;font-size:14px}.timer.paused{background:#8a6d00}.rec-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#ff4d4d;margin-right:8px;animation:blink 1s infinite}@keyframes blink{50%{opacity:.2}}.rec-controls,.bubble-controls{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.rec-controls label,.bubble-controls label{font-size:14px;display:flex;gap:6px;align-items:center}.settings{font-size:14px}.settings select{padding:6px 10px;border:1px solid var(--line-strong);border-radius:8px;background:#fff;max-width:260px}.bubble-controls{font-size:14px}.notice{padding:12px 16px;border-radius:12px;background:var(--soft);font-size:14px;margin:0}.notice.warn{background:#fff4e5}.player-wrap{position:relative;border-radius:20px;overflow:hidden;background:#000}.player-wrap video{display:block;width:100%;max-height:70vh}.video-head{display:flex;align-items:center;gap:12px;margin:20px 0;flex-wrap:wrap}.video-head input{font-size:24px;font-weight:700;color:var(--ink);border:1px solid transparent;border-radius:8px;padding:4px 8px;flex:1;min-width:200px}.video-head input:hover,.video-head input:focus{border-color:var(--line-strong);outline:none}.panel{border:1px solid var(--line);border-radius:20px;padding:20px;margin-top:16px}.panel h3{margin:0 0 12px;font-size:16px;color:var(--ink)}.wave{position:relative;height:96px;border-radius:12px;background:var(--soft);-webkit-user-select:none;user-select:none;touch-action:none}.wave canvas{width:100%;height:100%;display:block}.wave .shade{position:absolute;top:0;bottom:0;background:#10121473;pointer-events:none}.wave .handle{position:absolute;top:-4px;bottom:-4px;width:12px;margin-left:-6px;background:var(--brand);border-radius:6px;cursor:ew-resize}.wave .playhead{position:absolute;top:0;bottom:0;width:2px;background:#ff4d4d;pointer-events:none}.trim-info{display:flex;gap:12px;align-items:center;margin-top:12px;font-size:13px;font-variant-numeric:tabular-nums;flex-wrap:wrap}.progress{height:6px;background:var(--soft);border-radius:3px;overflow:hidden;margin-top:10px}.progress>div{height:100%;background:var(--brand);transition:width .2s}.tile .meta .badge{display:inline-block;margin-top:6px;padding:2px 10px;border-radius:9999px;background:var(--pill);color:var(--brand-dark);font-size:12px;font-weight:700}.panel .notice{margin:12px 0}.panel .hint{margin:6px 0 0;font-size:13px;color:var(--muted)}.panel code{font-size:12px;background:var(--soft);padding:1px 6px;border-radius:6px}.cta-fields{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap}.cta-fields label{display:grid;gap:4px;font-size:13px;font-weight:500;flex:1;min-width:200px}.cta-fields input,.share-link input{padding:8px 12px;border:1px solid var(--line-strong);border-radius:8px;background:#fff}.share-actions{display:flex;gap:12px;align-items:center;margin-top:16px;flex-wrap:wrap}.share-link{display:flex;gap:8px;align-items:center;margin-top:16px}.share-link input{flex:1;min-width:0}.insights-title{margin-top:24px!important}.insights{display:flex;gap:32px;align-items:flex-end;flex-wrap:wrap}.insights div{display:grid}.insights strong{font-size:28px;line-height:32px;color:var(--ink);font-variant-numeric:tabular-nums}.insights span{font-size:13px;color:var(--muted)}.view-list{list-style:none;margin:12px 0 0;padding:0;font-size:14px}.view-list li{display:flex;justify-content:space-between;padding:8px 0;border-top:1px solid var(--line)}.watch{min-height:100vh;display:flex;flex-direction:column;background:var(--soft)}.watch-head{display:flex;align-items:center;gap:8px;padding:14px 32px;font-weight:800;font-size:20px;color:var(--ink)}.watch-main{flex:1;width:100%;max-width:960px;margin:0 auto;padding:8px 16px 40px}.watch-title{margin:8px 0 16px;font-size:28px;line-height:34px;color:var(--ink)}.cta-button{margin-top:20px}.watch-foot{text-align:center;padding:20px;font-size:13px;color:var(--muted)}@media (max-width: 640px){.watch-head{padding:12px 16px}.insights{gap:20px}main{padding:24px 16px 60px}.topbar{padding:12px 16px;gap:12px}.countdown{font-size:72px}}
