:root{--crd-primary:#38BDF8;--crd-primary-hover:#0EA5E9;--crd-primary-light:rgba(56,189,248,0.08);--crd-primary-border:rgba(56,189,248,0.25);--crd-primary-glow:rgba(56,189,248,0.15);--crd-bg:#FAFAF8;--crd-bg-dark:#09090B;--crd-surface:#18181B;--crd-surface-2:#27272A;--crd-text:#111827;--crd-muted:#A1A1AA;--crd-border:rgba(255,255,255,.07);--crd-card:#fff;--crd-radius:16px;--crd-red:#EF4444;--crd-red-glow:rgba(239,68,68,0.3)}.crd-page{background:var(--crd-bg);min-height:100vh;font-family:'DM Sans',sans-serif}.crd-page .landing-hero{background:linear-gradient(145deg,#0c1220 0%,#0a1a2e 35%,#091625 65%,#060e1a 100%)}.crd-page .landing-hero::before{background:radial-gradient(ellipse 55% 50% at 65% 25%,rgba(56,189,248,.15),transparent),radial-gradient(ellipse 35% 45% at 15% 70%,rgba(14,165,233,.12),transparent),radial-gradient(circle at 80% 80%,rgba(56,189,248,.06),transparent)}.crd-page .landing-hero h1{font-family:'Instrument Serif',serif;font-weight:700}.crd-page .landing-hero h1 em{color:var(--crd-primary);background:linear-gradient(135deg,#38BDF8,#0EA5E9);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.crd-page .landing-eyebrow{color:var(--crd-primary-hover)}.crd-page .landing-cta-primary{background:linear-gradient(135deg,var(--crd-primary),var(--crd-primary-hover));box-shadow:0 4px 14px var(--crd-primary-glow)}.crd-page .landing-cta-primary:hover{background:var(--crd-primary-hover)}.crd-page .landing-stat-val.sky{color:var(--crd-primary-hover)}.crd-page .feature-card:hover{border-color:var(--crd-primary-border)}.crd-page .landing-section-title{font-family:'Instrument Serif',serif}.crd-page .landing-section-eyebrow{color:var(--crd-primary-hover)}.crd-page .landing-badge.video{color:var(--crd-primary);background:rgba(56,189,248,.1);border-color:rgba(56,189,248,.2)}.crd-page .hiw-num{background:var(--crd-primary-hover)}.crd-page .faq-item summary::before{color:var(--crd-primary-hover)}.crd-app{background:var(--crd-bg-dark);min-height:100vh;color:#fff;font-family:'DM Sans',sans-serif;display:flex;flex-direction:column}.crd-app h1,.crd-app h2,.crd-app h3,.crd-app h4,.crd-app h5,.crd-app h6{color:#fff;font-family:'Instrument Serif',serif}.crd-app p{color:rgba(255,255,255,.7)}.crd-app-header{display:flex;align-items:center;justify-content:space-between;padding:10px 20px;border-bottom:1px solid var(--crd-border);background:var(--crd-surface);z-index:20;flex-shrink:0}.crd-app-logo{font-size:.85rem;font-weight:800;color:#fff;text-decoration:none;display:flex;align-items:center;gap:8px}.crd-app-logo span{color:var(--crd-primary)}.crd-header-actions{display:flex;align-items:center;gap:8px}.crd-btn-icon{width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.05);border:1px solid var(--crd-border);color:var(--crd-muted);cursor:pointer;font-size:1rem;transition:all .15s}.crd-btn-icon:hover{background:var(--crd-surface-2);color:#fff}.crd-topbar{background:var(--crd-surface);border-bottom:1px solid var(--crd-border);padding:0 20px;display:flex;align-items:center;height:56px;gap:12px;backdrop-filter:blur(12px);position:sticky;top:0;z-index:50}.crd-topbar-back{font-size:13px;color:rgba(255,255,255,.5);text-decoration:none;font-weight:600;display:flex;align-items:center;gap:4px}.crd-topbar-back:hover{color:#fff}.crd-topbar-brand{font-size:14px;font-weight:800;color:#fff;display:flex;align-items:center;gap:8px;text-decoration:none;flex:1}.crd-topbar-actions{display:flex;gap:8px;align-items:center}.crd-topbar-btn{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.1);border-radius:10px;color:#fff;padding:8px 14px;font-size:13px;font-weight:600;cursor:pointer}.crd-topbar-btn:hover{background:rgba(255,255,255,.12)}.crd-rec-indicator{display:none;align-items:center;gap:6px;font-size:12px;font-weight:700;color:var(--crd-red)}.crd-rec-indicator.active{display:flex}.crd-rec-dot{width:8px;height:8px;border-radius:50%;background:var(--crd-red);animation:crdPulse 1s ease infinite}@keyframes crdPulse{0%,100%{opacity:1}50%{opacity:.3}}.crd-workspace{flex:1;padding:16px 16px 100px;max-width:1100px;margin:0 auto;width:100%}.crd-modes{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:24px}.crd-mode-card{background:var(--crd-surface);border:1px solid var(--crd-border);border-radius:14px;padding:20px 16px;text-align:center;cursor:pointer;transition:all .2s;position:relative}.crd-mode-card:hover{background:var(--crd-surface-2);border-color:rgba(255,255,255,.15)}.crd-mode-card.active{background:var(--crd-primary-light);border-color:var(--crd-primary-border)}.crd-mode-card.active .crd-mode-icon{color:var(--crd-primary)}.crd-mode-icon{font-size:28px;margin-bottom:8px;display:block}.crd-mode-label{font-size:13px;font-weight:700;color:#fff;margin-bottom:4px}.crd-mode-desc{font-size:11px;color:rgba(255,255,255,.4);line-height:1.4}.crd-controls{display:flex;align-items:center;justify-content:center;gap:16px;padding:20px;margin-bottom:20px;background:var(--crd-surface);border:1px solid var(--crd-border);border-radius:16px}.crd-record-btn{width:64px;height:64px;border-radius:50%;border:3px solid rgba(255,255,255,.2);background:var(--crd-red);cursor:pointer;position:relative;transition:all .2s;display:flex;align-items:center;justify-content:center}.crd-record-btn::after{content:'';width:24px;height:24px;border-radius:50%;background:rgba(255,255,255,.9);transition:all .2s}.crd-record-btn:hover{transform:scale(1.05);box-shadow:0 0 24px var(--crd-red-glow)}.crd-record-btn.recording{animation:crdRecordPulse 1.5s ease infinite;border-color:var(--crd-red)}.crd-record-btn.recording::after{border-radius:4px;width:20px;height:20px}@keyframes crdRecordPulse{0%,100%{box-shadow:0 0 0 0 var(--crd-red-glow)}50%{box-shadow:0 0 0 12px transparent}}.crd-ctrl-btn{width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.06);color:#fff;font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}.crd-ctrl-btn:hover{background:rgba(255,255,255,.12)}.crd-ctrl-btn:disabled{opacity:.3;cursor:not-allowed}.crd-ctrl-btn.stop{background:rgba(239,68,68,.15);border-color:rgba(239,68,68,.3)}.crd-ctrl-btn.stop:hover{background:rgba(239,68,68,.25)}.crd-timer{font-size:20px;font-weight:700;font-variant-numeric:tabular-nums;color:rgba(255,255,255,.8);min-width:70px;text-align:center;font-family:'DM Sans',monospace}.crd-timer.recording{color:var(--crd-red)}.crd-panels{display:grid;grid-template-columns:280px 1fr;gap:16px}.crd-sidebar{display:flex;flex-direction:column;gap:12px}.crd-panel{background:var(--crd-surface);border:1px solid var(--crd-border);border-radius:14px;padding:16px}.crd-panel-title{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--crd-muted);margin-bottom:12px;display:flex;align-items:center;gap:6px}.crd-toggle-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}.crd-toggle-row:last-child{margin-bottom:0}.crd-toggle-label{font-size:13px;color:rgba(255,255,255,.7);font-weight:500}.crd-toggle{width:44px;height:24px;background:var(--crd-surface-2);border-radius:12px;position:relative;cursor:pointer;transition:background .2s;border:none;flex-shrink:0}.crd-toggle::after{content:'';position:absolute;width:18px;height:18px;border-radius:50%;background:#fff;top:3px;left:3px;transition:transform .2s}.crd-toggle.on{background:var(--crd-primary-hover)}.crd-toggle.on::after{transform:translateX(20px)}.crd-select{width:100%;background:var(--crd-bg-dark);border:1px solid var(--crd-border);border-radius:10px;padding:10px 12px;color:#fff;font-size:13px;font-family:'DM Sans',sans-serif;cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%23999' viewBox='0 0 16 16'%3E%3Cpath d='M8 11L3 6h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center}.crd-select:focus{outline:none;border-color:var(--crd-primary)}.crd-select option{background:#1a1a1a;color:#fff}.crd-volume-meter{width:100%;height:6px;border-radius:3px;background:rgba(255,255,255,.08);overflow:hidden;margin-top:8px}.crd-volume-bar{height:100%;border-radius:3px;background:linear-gradient(90deg,#22c55e,#eab308,#ef4444);width:0%;transition:width 50ms}.crd-shapes{display:flex;gap:8px;margin-bottom:12px}.crd-shape-btn{width:40px;height:40px;border-radius:8px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.06);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}.crd-shape-btn:hover{border-color:rgba(255,255,255,.2)}.crd-shape-btn.active{border-color:var(--crd-primary-border);background:var(--crd-primary-light)}.crd-shape-btn svg{width:20px;height:20px;fill:rgba(255,255,255,.6)}.crd-shape-btn.active svg{fill:var(--crd-primary)}.crd-pip-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px;max-width:100px}.crd-pip-pos{width:100%;aspect-ratio:16/10;border-radius:4px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.04);cursor:pointer;position:relative;transition:all .2s}.crd-pip-pos:hover{border-color:rgba(255,255,255,.2)}.crd-pip-pos.active{border-color:var(--crd-primary-border);background:var(--crd-primary-light)}.crd-pip-pos::after{content:'';position:absolute;width:6px;height:6px;border-radius:50%;background:var(--crd-primary);opacity:.5}.crd-pip-pos.active::after{opacity:1}.crd-pip-pos[data-pos="tl"]::after{top:3px;left:3px}.crd-pip-pos[data-pos="tr"]::after{top:3px;right:3px}.crd-pip-pos[data-pos="bl"]::after{bottom:3px;left:3px}.crd-pip-pos[data-pos="br"]::after{bottom:3px;right:3px}.crd-preview{background:rgba(0,0,0,.4);border:1px solid var(--crd-border);border-radius:14px;overflow:hidden;position:relative;aspect-ratio:16/9;display:flex;align-items:center;justify-content:center}.crd-preview-empty{text-align:center;color:rgba(255,255,255,.25);padding:40px}.crd-preview-empty-icon{font-size:48px;margin-bottom:12px}.crd-preview-empty-text{font-size:14px;font-weight:600}.crd-preview-empty-hint{font-size:12px;margin-top:6px}.crd-preview video{width:100%;height:100%;object-fit:contain;display:block}.crd-preview canvas{position:absolute;top:0;left:0;width:100%;height:100%;z-index:5}.crd-countdown{position:fixed;top:0;left:0;right:0;bottom:0;z-index:200;background:rgba(0,0,0,.85);display:flex;align-items:center;justify-content:center;flex-direction:column}.crd-countdown-num{font-size:120px;font-weight:800;color:var(--crd-primary);font-family:'Instrument Serif',serif;animation:crdCountPop .8s ease}@keyframes crdCountPop{0%{transform:scale(1.5);opacity:0}50%{transform:scale(1);opacity:1}100%{transform:scale(.9);opacity:.7}}.crd-countdown-label{font-size:14px;color:rgba(255,255,255,.4);margin-top:8px;font-weight:600}.crd-annotation-bar{position:absolute;bottom:16px;left:50%;transform:translateX(-50%);z-index:10;background:rgba(15,15,15,.9);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:6px;display:none;gap:4px}.crd-annotation-bar.visible{display:flex}.crd-anno-btn{width:36px;height:36px;border-radius:8px;border:none;background:transparent;color:rgba(255,255,255,.7);font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s}.crd-anno-btn:hover{background:rgba(255,255,255,.1);color:#fff}.crd-anno-btn.active{background:var(--crd-primary-light);color:var(--crd-primary)}.crd-anno-sep{width:1px;background:rgba(255,255,255,.1);margin:4px 2px}.crd-trim-panel{background:var(--crd-surface);border:1px solid var(--crd-border);border-radius:14px;padding:16px;margin-top:12px;display:none}.crd-trim-panel.visible{display:block}.crd-trim-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.crd-trim-title{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--crd-muted)}.crd-trim-info{font-size:12px;color:rgba(255,255,255,.4)}.crd-trim-track{position:relative;height:40px;background:rgba(255,255,255,.06);border-radius:8px;margin-bottom:12px;overflow:hidden}.crd-trim-fill{position:absolute;top:0;height:100%;background:var(--crd-primary-light);border-left:3px solid var(--crd-primary);border-right:3px solid var(--crd-primary)}.crd-trim-range{width:100%;-webkit-appearance:none;appearance:none;background:transparent;position:absolute;top:0;height:40px;cursor:pointer}.crd-trim-range::-webkit-slider-thumb{-webkit-appearance:none;width:4px;height:40px;background:var(--crd-primary);cursor:ew-resize}.crd-trim-times{display:flex;justify-content:space-between;font-size:12px;color:var(--crd-muted);font-variant-numeric:tabular-nums}.crd-export-panel{display:none;gap:12px;margin-top:12px;align-items:center;flex-wrap:wrap}.crd-export-panel.visible{display:flex}.crd-export-btn{background:linear-gradient(135deg,var(--crd-primary),var(--crd-primary-hover));color:#fff;border:none;border-radius:12px;padding:12px 24px;font-size:14px;font-weight:700;cursor:pointer;transition:all .2s;font-family:'DM Sans',sans-serif}.crd-export-btn:hover{transform:translateY(-1px);box-shadow:0 8px 24px var(--crd-primary-glow)}.crd-quality-select{background:var(--crd-surface);border:1px solid var(--crd-border);border-radius:10px;padding:10px 14px;color:#fff;font-size:13px;font-family:'DM Sans',sans-serif;cursor:pointer}.crd-file-info{font-size:12px;color:rgba(255,255,255,.4)}.crd-history{background:var(--crd-surface);border:1px solid var(--crd-border);border-radius:14px;padding:16px;margin-top:16px}.crd-history-title{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--crd-muted);margin-bottom:12px}.crd-history-list{display:flex;gap:10px;overflow-x:auto;scrollbar-width:none;padding-bottom:4px}.crd-history-list::-webkit-scrollbar{display:none}.crd-history-item{background:rgba(255,255,255,.04);border:1px solid var(--crd-border);border-radius:10px;min-width:160px;max-width:200px;cursor:pointer;transition:all .2s;flex-shrink:0;overflow:hidden}.crd-history-item:hover{border-color:var(--crd-primary-border)}.crd-history-thumb{width:100%;aspect-ratio:16/9;background:rgba(0,0,0,.3);display:flex;align-items:center;justify-content:center;font-size:24px;color:rgba(255,255,255,.2);overflow:hidden}.crd-history-thumb img{width:100%;height:100%;object-fit:cover}.crd-history-meta{padding:8px 10px}.crd-history-name{font-size:11px;font-weight:700;color:rgba(255,255,255,.8);margin-bottom:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.crd-history-date{font-size:10px;color:rgba(255,255,255,.35)}.crd-history-actions{display:flex;gap:4px;padding:0 10px 8px}.crd-history-action-btn{font-size:10px;color:rgba(255,255,255,.4);background:none;border:none;cursor:pointer;padding:2px 6px;border-radius:4px;transition:all .15s}.crd-history-action-btn:hover{color:#fff;background:rgba(255,255,255,.08)}.crd-history-action-btn.del:hover{color:var(--crd-red);background:rgba(239,68,68,.1)}.crd-history-empty{font-size:13px;color:rgba(255,255,255,.3);text-align:center;padding:20px}.crd-shortcuts{position:fixed;bottom:16px;right:16px;z-index:30;background:rgba(15,15,15,.85);backdrop-filter:blur(8px);border:1px solid var(--crd-border);border-radius:10px;padding:10px 14px;font-size:11px;color:rgba(255,255,255,.4);line-height:1.8}.crd-shortcuts kbd{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.15);border-radius:4px;padding:1px 5px;font-size:10px;font-weight:700;color:rgba(255,255,255,.7);font-family:'DM Sans',monospace}.crd-toast{position:fixed;bottom:80px;left:50%;transform:translateX(-50%) translateY(20px);background:var(--crd-surface);border:1px solid var(--crd-border);box-shadow:0 8px 24px rgba(0,0,0,.4);color:#fff;padding:10px 20px;border-radius:10px;font-size:13px;font-weight:600;opacity:0;transition:all .3s;z-index:999;pointer-events:none;white-space:nowrap}.crd-toast.show{opacity:1;transform:translateX(-50%) translateY(0)}.crd-shimmer-card{background:rgba(255,255,255,.04);border:1px solid var(--crd-primary-border);border-radius:16px;padding:20px;overflow:hidden;position:relative}.crd-shimmer-card::after{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(56,189,248,.08),transparent);animation:crdShimmer 1.5s ease infinite}@keyframes crdShimmer{to{left:100%}}.crd-bottom-nav{position:fixed;bottom:0;left:0;right:0;background:rgba(15,15,15,.95);backdrop-filter:blur(12px);border-top:1px solid var(--crd-border);display:flex;z-index:40}.crd-bottom-nav a{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;padding:10px 0;text-decoration:none;font-size:11px;font-weight:600;color:rgba(255,255,255,.35);transition:color .2s}.crd-bottom-nav a.active{color:var(--crd-primary)}.crd-bottom-nav a:hover{color:rgba(255,255,255,.6)}.crd-bnav-icon{font-size:20px}@media (max-width:768px){.crd-modes{grid-template-columns:repeat(2,1fr)}.crd-panels{grid-template-columns:1fr}.crd-controls{flex-wrap:wrap}.crd-shortcuts{display:none}.crd-sidebar{order:2}.crd-preview{aspect-ratio:4/3}.crd-annotation-bar{bottom:8px}}@media (min-width:769px){.crd-bottom-nav{display:none}.crd-workspace{padding-bottom:40px}}.crd-demo-card{background:linear-gradient(135deg,var(--crd-bg-dark) 0%,#0a1520 100%);border:1px solid rgba(56,189,248,.2);border-radius:20px;padding:28px;color:#fff;max-width:420px}.crd-demo-screen{background:rgba(0,0,0,.5);border:1px solid var(--crd-border);border-radius:10px;aspect-ratio:16/9;position:relative;display:flex;align-items:center;justify-content:center;margin-bottom:16px;overflow:hidden}.crd-demo-screen-text{font-size:11px;color:rgba(255,255,255,.3)}.crd-demo-webcam{position:absolute;bottom:8px;right:8px;width:56px;height:56px;border-radius:50%;background:linear-gradient(135deg,var(--crd-primary),var(--crd-primary-hover));border:2px solid rgba(255,255,255,.3);display:flex;align-items:center;justify-content:center;font-size:20px}.crd-demo-controls{display:flex;align-items:center;justify-content:center;gap:12px}.crd-demo-rec-btn{width:44px;height:44px;border-radius:50%;background:var(--crd-red);border:2px solid rgba(255,255,255,.2);display:flex;align-items:center;justify-content:center;animation:crdPulse 1.5s ease infinite}.crd-demo-rec-btn::after{content:'';width:16px;height:16px;border-radius:50%;background:rgba(255,255,255,.9)}.crd-demo-timer{font-size:16px;font-weight:700;color:var(--crd-red);font-variant-numeric:tabular-nums}.crd-demo-label{font-size:11px;color:rgba(255,255,255,.3);text-align:center;margin-top:12px}@media (max-width:768px){.crd-bottom-nav a{min-height:44px;justify-content:center;gap:4px;font-size:12px}.crd-modes,.crd-pip-grid{grid-template-columns:1fr}}