/* Approved landing design. Assets are served from this origin under the site's CSP. */
@font-face { font-family:'DM Sans'; font-style:normal; font-weight:400 700; font-display:swap; src:url("/_assets/fonts/DMSans-LatinExt-VF.woff2") format("woff2"); unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family:'DM Sans'; font-style:normal; font-weight:400 700; font-display:swap; src:url("/_assets/fonts/DMSans-Latin-VF.woff2") format("woff2"); unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family:'JetBrains Mono'; font-style:normal; font-weight:100 800; font-display:swap; src:url("/_assets/fonts/JetBrainsMono-VF.ttf") format("truetype"); }
html { color-scheme:dark; background:#101112; }
body { margin:0; }
#cp-one { --cp-bg:#101112; --cp-panel:#181a1b; --cp-raised:#242629; --cp-text:#d3d7d5; --cp-muted:#a2a6a4; --cp-mint:#93cbb4; --cp-green:#296b52; --cp-violet:#b6a6dc; --cp-blue:#91b8da; --cp-amber:#d8b77d; color-scheme:dark; background:var(--cp-bg); color:var(--cp-text); font:400 15px/1.6 'DM Sans',-apple-system,BlinkMacSystemFont,sans-serif; text-align:left; width:100%; isolation:isolate; container-type:inline-size; overflow:clip; }
#cp-one * { box-sizing:border-box; }
#cp-one h1,#cp-one h2,#cp-one h3,#cp-one p,#cp-one ul,#cp-one pre { margin:0; }
#cp-one h1,#cp-one h2,#cp-one h3 { color:var(--cp-text); font-family:inherit; text-wrap:balance; }
#cp-one h1 { font-size:clamp(36px,5.55cqw,66px); line-height:1.09; font-weight:550; letter-spacing:-.052em; }
#cp-one h2 { font-size:clamp(29px,3.8cqw,44px); line-height:1.14; font-weight:500; letter-spacing:-.045em; }
#cp-one h3 { font-size:22px; line-height:1.25; font-weight:500; letter-spacing:-.025em; }
#cp-one button,#cp-one a,#cp-one input { -webkit-tap-highlight-color:transparent; }
#cp-one button,#cp-one input { font:inherit; }
#cp-one button { appearance:none; }
#cp-one button,#cp-one a { touch-action:manipulation; }
#cp-one button:focus-visible,#cp-one a:focus-visible,#cp-one summary:focus-visible,#cp-one input:focus-visible { outline:2px solid var(--cp-mint); outline-offset:5px; }
#cp-one a { text-decoration:none; color:inherit; }
#cp-one button { color:inherit; }
#cp-one [hidden] { display:none!important; }
#cp-one .cp-shell { width:min(1140px,calc(100% - 80px)); margin-inline:auto; }
#cp-one .cp-mono { font-family:'JetBrains Mono',ui-monospace,monospace; }
#cp-one .cp-muted { color:var(--cp-muted); }
#cp-one .cp-mint { color:var(--cp-mint); }
#cp-one .cp-eyebrow { font-size:11px; font-weight:600; letter-spacing:.15em; text-transform:uppercase; color:var(--cp-mint); margin-bottom:17px; }
#cp-one .cp-button { min-height:44px; display:inline-flex; align-items:center; justify-content:center; gap:10px; padding:10px 19px; border:0; border-radius:8px; background:#25282a; color:#d3dfd8; font-size:14px; font-weight:550; line-height:1.5; transition:background 120ms,transform 120ms,color 120ms,box-shadow 120ms; }
#cp-one .cp-button:hover { background:#303537; transform:translateY(-1px); }
#cp-one .cp-button:active { transform:translateY(1px); }
#cp-one .cp-button.cp-primary { background:var(--cp-green); color:#e1ece5; box-shadow:inset 0 1px 0 #a3d4b91c,0 3px 12px #0002; }
#cp-one .cp-button.cp-primary:hover { background:#337c5f; box-shadow:inset 0 1px 0 #a3d4b933,0 5px 16px #0003; }
#cp-one .cp-button.cp-quiet { background:transparent; color:#b8c6bd; }
#cp-one .cp-button.cp-quiet:hover { background:#242726; color:var(--cp-mint); }
#cp-one .cp-button svg { width:16px; height:16px; }
#cp-one .cp-header { display:flex; align-items:center; justify-content:space-between; gap:24px; min-height:84px; background:transparent; }
#cp-one .cp-brand { font-size:21px; letter-spacing:-1.1px; white-space:nowrap; font-weight:400; }
#cp-one .cp-brand b { font-weight:400; color:var(--cp-mint); }
#cp-one .cp-nav { display:flex; align-items:center; gap:23px; }
#cp-one .cp-nav a { color:#b8bdc1; font-size:14px; padding:12px 0; transition:color 100ms; }
#cp-one .cp-nav a:hover { color:#6ee0ae; }
#cp-one .cp-header-actions { display:flex; gap:4px; align-items:center; }
#cp-one .cp-menu { display:none; min-width:44px; }
#cp-one .cp-hero { text-align:center; padding-top:61px; position:relative; }
#cp-one .cp-hero .cp-eyebrow { display:flex; gap:9px; justify-content:center; align-items:center; color:#91bba6; margin-bottom:23px; }
#cp-one .cp-status-dot { display:inline-block; width:6px; height:6px; border-radius:50%; background:#83b89d; box-shadow:0 0 0 4px #83b89d0c; flex:none; }
#cp-one .cp-hero h1 span { display:block; color:var(--cp-mint); }
#cp-one .cp-hero-sub { margin:24px auto 0; max-width:570px; color:#a5b2aa; font-size:16px; line-height:1.8; text-wrap:pretty; }
#cp-one .cp-hero-sub strong { font-weight:500; color:#c5d2c9; }
#cp-one .cp-hero-actions { display:flex; justify-content:center; flex-wrap:wrap; gap:10px; margin-top:26px; }
#cp-one .cp-hero-notes { margin:17px 0 37px; display:flex; justify-content:center; flex-wrap:wrap; gap:20px; font-size:11px; color:#8a9d90; }
#cp-one .cp-hero-notes span { display:flex; align-items:center; gap:6px; }
#cp-one .cp-hero-notes svg { width:13px; height:13px; color:var(--cp-mint); }
#cp-one .cp-story { text-align:left; position:relative; border-radius:16px; padding:16px; background:linear-gradient(150deg,#1e2223,#181b1c 52%,#1c2022); box-shadow:0 18px 70px #0003,inset 0 1px 0 #99b9a61a; }
#cp-one .cp-story-top { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:0 4px 14px; }
#cp-one .cp-story-top>span { font-size:11px; color:#a3bbae; display:flex; gap:8px; align-items:center; }
#cp-one .cp-play { background:transparent; border:0; display:flex; align-items:center; justify-content:center; gap:6px; min-height:32px; color:#9caea2; font-size:11px; padding:4px 8px; border-radius:5px; }
#cp-one .cp-play:hover { background:#2a3830; }
#cp-one .cp-play svg { width:12px; height:12px; }
#cp-one .cp-story-grid { display:grid; grid-template-columns:1.03fr .36fr 1fr; gap:0; align-items:stretch; }
#cp-one .cp-window { background:#131617; border-radius:10px; overflow:hidden; min-width:0; box-shadow:0 8px 25px #0002,inset 0 0 0 1px #879d8e12; }
#cp-one .cp-window-head { min-height:39px; display:flex; align-items:center; gap:9px; padding:0 14px; color:#8fa397; font-size:10px; background:#242829; }
#cp-one .cp-dots { display:flex; gap:4px; }
#cp-one .cp-dots i { width:5px; height:5px; background:#68766d; border-radius:50%; }
#cp-one .cp-window-head>span:last-child { margin-left:auto; }
#cp-one .cp-editor-body { padding:18px 19px 17px; min-height:213px; position:relative; }
#cp-one .cp-task-label { font-size:10px; letter-spacing:.08em; color:var(--cp-amber); margin-bottom:8px; text-transform:uppercase; }
#cp-one .cp-editor-body h3 { font-size:15px; font-weight:500; letter-spacing:-.015em; }
#cp-one .cp-editor-body p { font-size:11px; color:#9bac9f; margin-top:6px; }
#cp-one .cp-code { white-space:pre-wrap; overflow-wrap:anywhere; font:400 11px/1.9 'JetBrains Mono',monospace; color:#b8c9bd; }
#cp-one .cp-editor-body pre { margin-top:14px; padding-top:13px; border-top:1px solid #92ab9a12; }
#cp-one .cp-code .cp-kw { color:#b2a1d4; }
#cp-one .cp-code .cp-fn { color:#93b7d4; }
#cp-one .cp-code .cp-comment { color:#7e9385; }
#cp-one .cp-scan { position:absolute; inset:0 0 auto; height:1px; background:linear-gradient(90deg,transparent,#80bba060,transparent); box-shadow:0 0 22px 3px #78b29719; animation:cp-scan 4.8s linear infinite; pointer-events:none; }
#cp-one .cp-bridge { display:flex; flex-direction:column; justify-content:center; align-items:center; gap:12px; padding:12px 5px; position:relative; color:#8eb89f; }
#cp-one .cp-bridge:before { content:''; position:absolute; left:0; right:0; height:1px; top:50%; background:#476e55; opacity:.4; }
#cp-one .cp-bridge:after { content:''; position:absolute; left:0; top:calc(50% - 2px); width:5px; height:5px; border-radius:50%; background:#9acdB0; animation:cp-travel 2.4s ease-in-out infinite; }
#cp-one .cp-memory-core { width:42px; height:42px; display:grid; place-items:center; background:#21352a; color:#9ec5ac; z-index:1; border-radius:13px; box-shadow:0 0 28px #56896918; }
#cp-one .cp-memory-core svg { width:19px; height:19px; }
#cp-one .cp-bridge small { position:absolute; top:calc(50% + 31px); font-size:9px; text-align:center; letter-spacing:.04em; }
#cp-one .cp-answer-body { padding:17px 18px; min-height:213px; }
#cp-one .cp-memory-title { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:12px; font-size:11px; color:#9dbcA8; }
#cp-one .cp-memory-title b { color:#83b79a; font-size:10px; font-weight:400; }
#cp-one .cp-memory-items { display:flex; flex-wrap:wrap; gap:6px; }
#cp-one .cp-memory-item { display:inline-flex; align-items:center; gap:6px; padding:5px 8px; border-radius:5px; color:#a8c9b5; background:#203327; font-size:10px; transition:background 220ms; }
#cp-one .cp-memory-item:nth-child(2) { background:#252d33; color:#a4bad0; }
#cp-one .cp-answer-note { padding-top:17px; margin-top:17px; border-top:1px solid #a0b6a314; }
#cp-one .cp-answer-note h3 { font-size:15px; margin-bottom:7px; }
#cp-one .cp-answer-note p { font-size:11px; color:#9fb3a5; line-height:1.7; }
#cp-one .cp-remembered { display:flex; gap:6px; align-items:center; color:#91bba2; font-size:10px; margin-top:12px; }
#cp-one .cp-remembered svg { width:12px; height:12px; }
#cp-one .cp-stage-controls { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; margin-top:12px; }
#cp-one .cp-stage { text-align:left; border:0; border-radius:7px; padding:10px 12px; background:transparent; min-height:56px; position:relative; color:#8ea395; transition:background 130ms; }
#cp-one .cp-stage:hover { background:#26372c; }
#cp-one .cp-stage[aria-pressed=true] { background:#273b2f; color:#bfd6c7; }
#cp-one .cp-stage .cp-step-num { color:#75a28a; margin-right:7px; font:10px 'JetBrains Mono',monospace; }
#cp-one .cp-stage b { font-weight:500; font-size:12px; }
#cp-one .cp-stage small { display:block; font-size:11px; color:#91a596; padding-left:24px; margin-top:2px; }
#cp-one .cp-demo-caption { font-size:11px; color:#8c9d92; margin:15px 0 0; text-align:center; min-height:18px; }
#cp-one .cp-companies { padding:59px 0 65px; text-align:center; }
#cp-one .cp-companies>p { font-size:12px; color:#a5b0a9; }
#cp-one .cp-marquee { overflow:hidden; margin:24px auto 16px; max-width:1060px; mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent); }
#cp-one .cp-belt { display:flex; width:max-content; animation:cp-belt 38s linear infinite; }
#cp-one .cp-belt-group { display:flex; align-items:center; gap:59px; padding-right:59px; }
#cp-one .cp-company { font-size:22px; letter-spacing:-.7px; font-weight:600; color:#91a097; white-space:nowrap; }
#cp-one .cp-company:nth-child(3n) { font-weight:450; letter-spacing:-1px; }
#cp-one .cp-companies small { font-size:10px; color:#73877a; }
#cp-one .cp-section { padding-block:66px; }
#cp-one .cp-section-intro { display:flex; gap:50px; align-items:end; justify-content:space-between; margin-bottom:32px; }
#cp-one .cp-section-intro p:not(.cp-eyebrow) { max-width:335px; color:#97a99d; font-size:14px; }
#cp-one .cp-work-grid { display:grid; grid-template-columns:1.32fr 1fr; gap:20px; }
#cp-one .cp-work-card { background:#1b2024; border-radius:18px; padding:30px; overflow:hidden; position:relative; }
#cp-one .cp-work-card.cp-keys-card { background:#25231f; }
#cp-one .cp-work-card h3 { margin-bottom:9px; }
#cp-one .cp-work-card>p { color:#9aaea8; font-size:13px; max-width:365px; }
#cp-one .cp-keys-card>p { color:#b0a894; }
#cp-one .cp-module-demo { margin-top:28px; border-radius:10px; background:#111a1c; box-shadow:0 15px 28px #0002; }
#cp-one .cp-module-tabs { display:flex; align-items:center; gap:2px; padding:9px; background:#1b2b30; border-radius:10px 10px 0 0; }
#cp-one .cp-module-tabs button { flex:1; border:0; font-size:10px; padding:8px 5px; min-height:35px; border-radius:5px; background:transparent; color:#93aab4; white-space:nowrap; }
#cp-one .cp-module-tabs button[aria-pressed=true] { background:#2b414a; color:#c0d5df; }
#cp-one .cp-module-tabs button:hover { color:#d0dfe6; }
#cp-one .cp-module-content { min-height:132px; padding:18px 20px; }
#cp-one .cp-module-content h4 { font-size:13px; font-weight:500; margin:0 0 10px; color:#b7cbd5; }
#cp-one .cp-module-content p { font-size:12px; line-height:1.8; color:#8fa9b5; }
#cp-one .cp-complexity { display:flex; justify-content:space-between; font-size:10px; padding:11px 18px; color:#88b3cb; background:#1a282e; border-radius:0 0 10px 10px; }
#cp-one .cp-keyboard { display:flex; gap:9px; align-items:center; justify-content:center; padding:31px 0 26px; perspective:600px; }
#cp-one .cp-keycap { min-width:57px; height:61px; display:flex; flex-direction:column; align-items:flex-start; justify-content:space-between; background:linear-gradient(145deg,#514b3b,#38352c); color:#c3b697; border:1px solid #77705b40; border-radius:11px; box-shadow:0 7px 0 #191b17,0 12px 18px #0003,inset 0 1px 1px #e2d1a81a; padding:9px 12px; transform:rotateX(10deg); transition:transform 160ms,box-shadow 160ms,background 160ms; }
#cp-one .cp-keycap em { font-style:normal; font-size:21px; line-height:1; }
#cp-one .cp-keycap small { font-size:8px; opacity:.7; }
#cp-one .cp-keycap:last-child { min-width:85px; }
#cp-one .cp-keycap.cp-depressed { transform:translateY(5px) rotateX(10deg); box-shadow:0 2px 0 #191b17,0 3px 10px #0002; background:linear-gradient(145deg,#716143,#49402f); color:#e0c388; }
#cp-one .cp-key-actions { display:flex; justify-content:center; gap:5px; }
#cp-one .cp-key-actions button { min-height:36px; border:0; background:transparent; color:#a79d84; font-size:11px; border-radius:5px; padding:5px 11px; }
#cp-one .cp-key-actions button[aria-pressed=true] { background:#393426; color:#d8bf8e; }
#cp-one .cp-key-result { color:#c7b68f; text-align:center; font-size:11px; min-height:18px; margin-top:17px!important; }
#cp-one .cp-privacy { padding:55px 0 72px; }
#cp-one .cp-privacy-grid { display:grid; grid-template-columns:.8fr 1.4fr; align-items:center; gap:45px; }
#cp-one .cp-privacy .cp-eyebrow { color:var(--cp-violet); }
#cp-one .cp-privacy h2 span { color:var(--cp-violet); }
#cp-one .cp-privacy-copy>p:not(.cp-eyebrow) { font-size:14px; color:#a19aaa; margin-top:20px; }
#cp-one .cp-text-action { background:none; border:0; padding:10px 0; color:var(--cp-violet); font-size:12px; display:inline-flex; gap:9px; align-items:center; margin-top:16px; }
#cp-one .cp-text-action:hover { color:#d2c0eb; }
#cp-one .cp-text-action svg { width:14px; height:14px; transition:transform 130ms; }
#cp-one .cp-text-action:hover svg { transform:translateX(3px); }
#cp-one .cp-veil-stage { background:#292730; border-radius:19px; padding:25px 22px 19px; --cp-reveal:63%; position:relative; touch-action:pan-y; }
#cp-one .cp-veil-labels { display:flex; justify-content:space-between; align-items:center; color:#b5abc7; font-size:10px; margin-bottom:19px; }
#cp-one .cp-veil-labels span { display:inline-flex; gap:6px; align-items:center; }
#cp-one .cp-veil-labels svg { width:12px; height:12px; }
#cp-one .cp-desktop { border-radius:9px; height:252px; position:relative; background:radial-gradient(ellipse at 65% 100%,#5b496f 0%,#302b3b 65%); overflow:hidden; box-shadow:0 15px 22px #09070f33; }
#cp-one .cp-desktop:before { content:''; position:absolute; width:240px; height:240px; border:1px solid #b7a2d118; border-radius:50%; top:100px; right:-20px; box-shadow:0 0 0 24px #b7a2d107,0 0 0 55px #b7a2d104; }
#cp-one .cp-desktop-bar { display:flex; gap:10px; align-items:center; height:22px; padding:0 11px; background:#1d1c27; font-size:8px; color:#a39eaf; }
#cp-one .cp-mini-editor { position:absolute; left:18px; top:44px; width:62%; height:176px; border-radius:7px; background:#171a21; box-shadow:0 8px 20px #0003; padding:12px; }
#cp-one .cp-mini-editor .cp-dots { margin-bottom:13px; }
#cp-one .cp-mini-editor pre { font:9px/1.9 'JetBrains Mono',monospace; color:#8196aa; white-space:pre-wrap; }
#cp-one .cp-mini-app { position:absolute; right:15px; top:71px; width:53%; padding:15px; background:#18231f; border-radius:9px; box-shadow:0 14px 30px #0005,inset 0 1px 0 #90bca324; }
#cp-one .cp-mini-app .cp-brand { font-size:11px; letter-spacing:-.4px; margin-bottom:12px; display:block; }
#cp-one .cp-mini-app b:not(.cp-brand b) { font-size:10px; font-weight:500; color:#9cc5af; display:block; }
#cp-one .cp-mini-app p { font-size:9px; line-height:1.7; color:#a3b3aa; margin-top:7px; }
#cp-one .cp-mini-lines { display:grid; gap:6px; margin-top:12px; }
#cp-one .cp-mini-lines i { display:block; height:4px; border-radius:2px; background:#709581; width:95%; opacity:.5; }
#cp-one .cp-mini-lines i:nth-child(2) { width:78%; }
#cp-one .cp-mini-lines i:nth-child(3) { width:86%; }
#cp-one .cp-covered { position:absolute; inset:0; background:radial-gradient(ellipse at 65% 100%,#5b496f 0%,#302b3b 65%); clip-path:inset(0 0 0 var(--cp-reveal)); pointer-events:none; }
#cp-one .cp-divider { position:absolute; top:22px; bottom:0; left:var(--cp-reveal); width:1px; background:#d0c2e8; box-shadow:0 0 13px #b1a0ce30; pointer-events:none; }
#cp-one .cp-divider span { display:grid; place-items:center; position:absolute; top:49%; left:-11px; height:26px; width:23px; border-radius:7px; background:#b5a4cc; color:#352b43; font-size:12px; box-shadow:0 2px 8px #0004; }
#cp-one .cp-veil-footer { display:flex; align-items:center; gap:15px; margin-top:16px; color:#b1a6bf; font-size:10px; }
#cp-one .cp-veil-footer input { width:95px; accent-color:#ae9acb; margin:0 0 0 auto; height:24px; }
#cp-one .cp-privacy-note { color:#8e8799; font-size:10px; margin-top:13px; line-height:1.7; }
#cp-one .cp-proof { padding-block:67px; background:var(--cp-bg); }
#cp-one .cp-proof-head { text-align:center; max-width:630px; margin:0 auto 35px; }
#cp-one .cp-proof-head .cp-eyebrow { color:#95b7c1; }
#cp-one .cp-proof-head>p:last-child { font-size:14px; margin-top:17px; color:#99ada5; }
#cp-one .cp-proof-grid { display:grid; grid-template-columns:1fr 1fr; gap:35px; align-items:center; }
#cp-one .cp-friction { padding:8px 14px; }
#cp-one .cp-friction>small { display:block; color:#9a978b; text-align:center; font-size:10px; margin-bottom:18px; }
#cp-one .cp-review-slip { padding:17px 23px; border-radius:8px; background:#282929; box-shadow:0 10px 20px #0002; margin-bottom:14px; transform:rotate(-2deg); max-width:345px; }
#cp-one .cp-review-slip:nth-child(3) { margin-left:24px; transform:rotate(2deg); background:#252729; }
#cp-one .cp-review-slip:nth-child(4) { margin-left:9px; transform:rotate(-1deg); }
#cp-one .cp-review-slip .cp-slip-title { color:#a8a594; font-size:9px; letter-spacing:.07em; text-transform:uppercase; display:flex; justify-content:space-between; margin-bottom:8px; }
#cp-one .cp-review-slip p { color:#c1c3b7; font-size:16px; line-height:1.5; letter-spacing:-.02em; }
#cp-one .cp-proof-ledger { padding:28px 27px; background:#1d2425; border-radius:14px; box-shadow:0 10px 30px #061d131c; }
#cp-one .cp-proof-ledger h3 { font-size:23px; margin:8px 0 19px; color:#bcd0c3; }
#cp-one .cp-proof-ledger>.cp-eyebrow { font-size:10px; margin:0; }
#cp-one .cp-proof-row { display:flex; gap:11px; align-items:start; padding:13px 0; border-bottom:1px solid #9bb9a714; }
#cp-one .cp-proof-row svg { width:15px; height:15px; color:#80b896; margin-top:3px; flex:none; }
#cp-one .cp-proof-row b { display:block; font-size:12px; font-weight:500; color:#bcd1c4; }
#cp-one .cp-proof-row p { font-size:11px; color:#8fae9c; margin-top:2px; }
#cp-one .cp-proof-ledger .cp-text-action { margin:12px 0 0; color:#a5cdb6; }
#cp-one .cp-proof-extra { margin-top:15px; padding:14px; background:#171c1d; border-radius:8px; font-size:12px; color:#a2b7a8; }
#cp-one .cp-proof-extra p+p { margin-top:9px; }
#cp-one .cp-proof-extra a { display:inline-block; color:#a3d0b6; margin-top:10px; text-decoration:underline; text-underline-offset:4px; }
#cp-one .cp-models { display:flex; justify-content:space-between; gap:35px; margin-top:44px; padding-top:26px; border-top:1px solid #92ada019; }
#cp-one .cp-models h3 { font-size:20px; max-width:290px; line-height:1.45; }
#cp-one .cp-models h3 em { color:#a1ccb5; font-style:normal; }
#cp-one .cp-model-specs { display:flex; gap:28px; align-items:center; }
#cp-one .cp-model-specs p { font-size:10px; color:#87a194; }
#cp-one .cp-model-specs b { display:block; font-size:13px; font-weight:500; color:#b4cabc; margin-top:4px; }
#cp-one .cp-rubric { margin-top:25px; font-size:10px; color:#85a091; line-height:1.8; }
#cp-one .cp-custom { padding-block:90px 64px; }
#cp-one .cp-custom-grid { display:grid; grid-template-columns:.85fr 1.2fr; gap:54px; align-items:center; }
#cp-one .cp-custom .cp-eyebrow { color:var(--cp-amber); }
#cp-one .cp-soon { font-size:9px; letter-spacing:.02em; text-transform:none; padding:3px 6px; border-radius:4px; background:#343022; color:#c3ad7f; margin-left:8px; white-space:nowrap; }
#cp-one .cp-custom h2 span { color:var(--cp-amber); }
#cp-one .cp-custom-copy>p:not(.cp-eyebrow) { font-size:14px; color:#a3ab9f; margin:18px 0 24px; }
#cp-one .cp-style-switch { display:inline-flex; padding:4px; border-radius:8px; background:#252720; gap:3px; }
#cp-one .cp-style-switch button { border:0; background:transparent; min-height:41px; padding:8px 19px; color:#a9ac9e; font-size:12px; border-radius:5px; transition:background 130ms,color 130ms; }
#cp-one .cp-style-switch button[aria-pressed=true] { color:#e1cba4; background:#47402d; }
#cp-one .cp-style-switch button:hover { color:#ebdab7; }
#cp-one .cp-style-note { margin-top:13px; font-size:11px; color:#94977f; min-height:38px; }
#cp-one .cp-code-window { background:#1d2021; border-radius:14px; overflow:hidden; box-shadow:0 15px 35px #0002; }
#cp-one .cp-code-window .cp-window-head { background:#2a2c2b; color:#b5b3a0; min-height:45px; }
#cp-one .cp-code-window pre { padding:25px; font-size:12px; min-height:257px; color:#bec8b7; }
#cp-one .cp-code-window .cp-kw { color:#c2ad85; }
#cp-one .cp-code-footer { display:flex; justify-content:space-between; gap:10px; padding:12px 23px; color:#a9b598; font-size:10px; background:#262b29; }
#cp-one .cp-languages { margin-top:38px; display:flex; flex-wrap:wrap; justify-content:center; gap:19px; align-items:center; color:#879b8c; font-size:11px; }
#cp-one .cp-languages span:first-child { color:#b0beb4; }
#cp-one .cp-pricing { padding-block:67px; }
#cp-one .cp-pricing-head { text-align:center; margin-bottom:31px; }
#cp-one .cp-pricing-head p:last-child { font-size:14px; color:#93a599; margin-top:16px; }
#cp-one .cp-price-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
#cp-one .cp-plan { background:#1c2021; padding:24px; border-radius:14px; display:flex; flex-direction:column; position:relative; }
#cp-one .cp-plan.cp-premium { background:#202827; }
#cp-one .cp-plan-top { min-height:42px; display:flex; align-items:center; justify-content:space-between; gap:10px; }
#cp-one .cp-plan-top>span { font-size:10px; color:#91a395; }
#cp-one .cp-period { display:flex; padding:3px; border-radius:6px; background:#0e191260; }
#cp-one .cp-period button { background:transparent; border:0; color:#8b9e90; border-radius:4px; font-size:9px; padding:7px 9px; min-height:30px; white-space:nowrap; }
#cp-one .cp-period button[aria-pressed=true] { background:#3b5141; color:#c9dacd; }
#cp-one .cp-plan h3 { font-size:23px; margin:15px 0 8px; }
#cp-one .cp-plan-desc { font-size:12px; color:#97a89c; min-height:38px; }
#cp-one .cp-price { margin-top:25px; font-size:36px; font-weight:450; line-height:1.2; color:#cddbcf; letter-spacing:-1.6px; }
#cp-one .cp-price span { font-size:12px; letter-spacing:0; color:#8ea593; margin-left:4px; }
#cp-one .cp-billing-note { font-size:10px; color:#849b89; margin:8px 0 22px; min-height:18px; }
#cp-one .cp-plan .cp-button { width:100%; margin-bottom:21px; font-size:12px; }
#cp-one .cp-plan ul { list-style:none; padding:0; margin-top:auto; color:#a7b7aa; font-size:12px; display:grid; gap:11px; }
#cp-one .cp-plan li { display:flex; gap:8px; align-items:start; }
#cp-one .cp-plan li:before { content:'✓'; color:#86b296; }
#cp-one .cp-pricing-note { margin-top:20px; text-align:center; font-size:10px; color:#839588; }
#cp-one .cp-faq { display:grid; grid-template-columns:.75fr 1.25fr; gap:60px; padding-block:40px 74px; }
#cp-one .cp-faq h2 { font-size:30px; }
#cp-one .cp-faq details { border-bottom:1px solid #92aa991c; }
#cp-one .cp-faq summary { list-style:none; min-height:58px; display:flex; align-items:center; justify-content:space-between; gap:20px; font-size:13px; color:#b6c5bb; }
#cp-one .cp-faq summary:after { content:'+'; color:#91baa3; font-size:18px; }
#cp-one .cp-faq details[open] summary:after { content:'−'; }
#cp-one .cp-faq summary::-webkit-details-marker { display:none; }
#cp-one .cp-faq details p { font-size:12px; color:#8ea594; padding-bottom:19px; }
#cp-one .cp-closing { text-align:center; padding:65px 25px 72px; background:radial-gradient(ellipse at 50% 100%,#17211d 0%,var(--cp-bg) 68%); }
#cp-one .cp-closing h2 { font-size:clamp(30px,4cqw,47px); }
#cp-one .cp-closing h2 span { color:var(--cp-mint); }
#cp-one .cp-closing p { font-size:14px; color:#9bac9e; margin:16px 0 25px; }
#cp-one .cp-footer { padding-block:26px; display:flex; align-items:center; justify-content:space-between; gap:20px; border-top:1px solid #a9c9b312; }
#cp-one .cp-footer .cp-brand { font-size:17px; }
#cp-one .cp-footer nav { display:flex; gap:22px; font-size:11px; color:#8fa194; }
#cp-one .cp-footer a:hover { color:var(--cp-mint); }
#cp-one .cp-toast { margin:14px auto 0; max-width:540px; padding:12px 16px; background:#26312b; color:#bdcec2; border-radius:8px; font-size:12px; text-align:left; }
#cp-one.cp-motion-paused .cp-scan,#cp-one.cp-motion-paused .cp-bridge:after,#cp-one.cp-motion-paused .cp-belt { animation-play-state:paused!important; }
@keyframes cp-scan { 0% {transform:translateY(10px);opacity:0} 12%{opacity:1} 80%{opacity:1} 100% {transform:translateY(204px);opacity:0} }
@keyframes cp-travel { 0%{left:0;opacity:0} 15%{opacity:1} 90%{opacity:1} 100%{left:100%;opacity:0} }
@keyframes cp-belt { to { transform:translateX(-50%); } }
@keyframes cp-content-in { from{opacity:.4;transform:translateY(4px)} to{opacity:1;transform:translateY(0)} }
#cp-one .cp-updated { animation:cp-content-in 250ms ease-out; }
@container (max-width:900px) {
#cp-one .cp-shell { width:calc(100% - 48px); }
#cp-one .cp-header { min-height:75px;gap:16px; }
#cp-one .cp-nav { gap:16px; }
#cp-one .cp-nav a { font-size:12px; }
#cp-one .cp-header-actions .cp-quiet:not(.cp-menu) { display:none; }
#cp-one .cp-brand { font-size:18px; }
#cp-one .cp-hero { padding-top:49px; }
#cp-one .cp-work-card { padding:24px; }
#cp-one .cp-privacy-grid { gap:25px;grid-template-columns:.8fr 1.3fr; }
#cp-one .cp-veil-stage { padding:20px 15px 16px; }
#cp-one .cp-desktop { height:235px; }
#cp-one .cp-models { flex-direction:column;gap:22px; }
#cp-one .cp-models h3 { max-width:none; }
#cp-one .cp-model-specs { justify-content:space-between; }
#cp-one .cp-custom-grid { gap:30px; }
#cp-one .cp-plan { padding:18px; }
#cp-one .cp-plan-top { flex-direction:column;align-items:flex-start;min-height:64px;gap:5px; }
#cp-one .cp-plan-desc { min-height:57px; }
#cp-one .cp-faq { gap:30px; }
}
@container (max-width:650px) {
#cp-one .cp-shell { width:calc(100% - 36px); }
#cp-one .cp-header { flex-wrap:wrap;gap:8px;min-height:70px;padding-block:12px; }
#cp-one .cp-header-actions { margin-left:auto; }
#cp-one .cp-header-actions>.cp-primary { font-size:11px;padding:8px 12px;min-height:44px; }
#cp-one .cp-header-actions .cp-menu { display:inline-flex; padding:10px; }
#cp-one .cp-nav { display:none;order:3;width:100%;padding:9px 0;gap:0;justify-content:space-between;flex-wrap:wrap; }
#cp-one .cp-nav.cp-open { display:flex; }
#cp-one .cp-nav a { padding:10px 7px;font-size:13px;min-height:44px; }
#cp-one .cp-hero { padding-top:31px; }
#cp-one .cp-hero h1 { font-size:clamp(34px,7.5cqw,48px);line-height:1.14;letter-spacing:-.045em; }
#cp-one .cp-hero h1 span { margin-top:5px; }
#cp-one .cp-hero .cp-eyebrow { font-size:9px;letter-spacing:.11em;margin-bottom:22px; }
#cp-one .cp-hero-sub { font-size:14px;line-height:1.75;margin-top:20px;max-width:440px; }
#cp-one .cp-hero-actions { margin-top:22px;gap:8px; }
#cp-one .cp-hero-actions .cp-button { font-size:12px;padding:11px 14px; }
#cp-one .cp-hero-notes { gap:10px;font-size:11px; margin:17px 0 28px; }
#cp-one .cp-hero-notes svg { width:11px;height:11px; }
#cp-one .cp-story { padding:12px; }
#cp-one .cp-story-top { padding:0 1px 9px; }
#cp-one .cp-story-top>span { font-size:11px; }
#cp-one .cp-play { min-height:38px;font-size:10px; }
#cp-one .cp-story-grid { grid-template-columns:1fr; }
#cp-one .cp-editor-body { min-height:183px;padding:16px; }
#cp-one .cp-editor-body pre { margin-top:10px;padding-top:10px; }
#cp-one .cp-bridge { height:47px;flex-direction:row;gap:9px; }
#cp-one .cp-bridge:before { top:0;bottom:0;height:auto;width:1px;left:50%;right:auto; }
#cp-one .cp-bridge:after { display:none; }
#cp-one .cp-memory-core { width:29px;height:29px;border-radius:8px; }
#cp-one .cp-memory-core svg { width:14px;height:14px; }
#cp-one .cp-bridge small { position:static;background:#1b2021;z-index:1;padding:3px 5px;font-size:10px; }
#cp-one .cp-answer-body { min-height:180px;padding:16px; }
#cp-one .cp-answer-note { margin-top:12px;padding-top:12px; }
#cp-one .cp-stage-controls { gap:4px; }
#cp-one .cp-stage { padding:9px 7px;min-height:51px;text-align:center; }
#cp-one .cp-stage small { padding:0;font-size:11px; }
#cp-one .cp-stage .cp-step-num { font-size:9px;margin-right:4px; }
#cp-one .cp-stage b { font-size:11px; }
#cp-one .cp-demo-caption { font-size:11px;padding:0 10px; }
#cp-one .cp-companies { padding:38px 0 36px; }
#cp-one .cp-companies>p { font-size:11px; }
#cp-one .cp-company { font-size:21px; }
#cp-one .cp-belt-group { gap:35px;padding-right:35px; }
#cp-one .cp-section { padding-block:42px; }
#cp-one .cp-section-intro { flex-direction:column;align-items:start;gap:15px;margin-bottom:25px; }
#cp-one .cp-section-intro p:not(.cp-eyebrow) { max-width:420px;font-size:13px; }
#cp-one .cp-work-grid { grid-template-columns:1fr;gap:15px; }
#cp-one .cp-work-card { padding:25px; }
#cp-one .cp-work-card h3 { font-size:22px; }
#cp-one .cp-module-tabs button { min-height:44px;font-size:11px; }
#cp-one .cp-key-actions button { min-height:44px; }
#cp-one .cp-keyboard { padding-top:27px;padding-bottom:25px; }
#cp-one .cp-privacy { padding-block:31px 52px; }
#cp-one .cp-privacy-grid { grid-template-columns:1fr;gap:25px; }
#cp-one .cp-privacy-copy { max-width:440px; }
#cp-one .cp-privacy-copy>p:not(.cp-eyebrow) { margin-top:15px; }
#cp-one .cp-privacy .cp-text-action { margin-top:6px;min-height:44px; }
#cp-one .cp-veil-stage { padding:20px 16px 16px; }
#cp-one .cp-desktop { height:232px; }
#cp-one .cp-veil-footer { gap:8px; }
#cp-one .cp-veil-footer input { height:44px;width:94px; }
#cp-one .cp-mini-app { padding:13px; }
#cp-one .cp-proof { padding-block:45px; }
#cp-one .cp-proof-head { text-align:left;margin-bottom:27px; }
#cp-one .cp-proof-grid { grid-template-columns:1fr;gap:25px; }
#cp-one .cp-friction { padding:3px 7px; }
#cp-one .cp-review-slip { max-width:90%;padding:15px 19px; }
#cp-one .cp-review-slip p { font-size:15px; }
#cp-one .cp-friction>small { text-align:left;margin-left:10px; }
#cp-one .cp-proof-ledger { padding:25px; }
#cp-one .cp-proof-ledger h3 { font-size:24px; }
#cp-one .cp-proof-row b { font-size:13px; }
#cp-one .cp-proof-row p { font-size:12px; }
#cp-one .cp-models { margin-top:31px; }
#cp-one .cp-models h3 { font-size:22px; }
#cp-one .cp-model-specs { flex-wrap:wrap;gap:20px;justify-content:start; }
#cp-one .cp-model-specs b { font-size:12px; }
#cp-one .cp-rubric { font-size:11px; }
#cp-one .cp-custom { padding-block:55px 35px; }
#cp-one .cp-custom-grid { grid-template-columns:1fr;gap:26px; }
#cp-one .cp-custom-copy>p:not(.cp-eyebrow) { margin-bottom:19px; }
#cp-one .cp-style-switch button { min-height:44px; }
#cp-one .cp-style-note { min-height:0; }
#cp-one .cp-code-window pre { font-size:11px;padding:23px 18px;min-height:246px; }
#cp-one .cp-languages { gap:13px;margin-top:28px;font-size:11px; }
#cp-one .cp-languages span:first-child { width:100%;text-align:center; }
#cp-one .cp-pricing { padding-block:43px; }
#cp-one .cp-pricing-head { text-align:left; }
#cp-one .cp-price-grid { grid-template-columns:1fr;gap:16px; }
#cp-one .cp-plan { padding:25px; }
#cp-one .cp-plan-top { min-height:42px;flex-direction:row;align-items:center; }
#cp-one .cp-plan-desc { min-height:0; }
#cp-one .cp-period button { font-size:11px;min-height:44px;padding:8px 12px; }
#cp-one .cp-plan h3 { margin-top:12px; }
#cp-one .cp-price { margin-top:20px; }
#cp-one .cp-plan ul { gap:10px; }
#cp-one .cp-pricing-note { text-align:left;font-size:11px; }
#cp-one .cp-faq { grid-template-columns:1fr;gap:18px;padding-block:26px 40px; }
#cp-one .cp-faq summary { font-size:13px; }
#cp-one .cp-closing { padding-block:44px 48px; }
#cp-one .cp-closing h2 span { display:block; }
#cp-one .cp-footer { flex-wrap:wrap;justify-content:center;gap:15px; }
#cp-one .cp-footer nav { gap:23px; }
}
@container (max-width:355px) {
#cp-one .cp-shell { width:calc(100% - 28px); }
#cp-one .cp-brand { font-size:16px; }
#cp-one .cp-header-actions>.cp-primary { display:none; }
#cp-one .cp-hero h1 { font-size:32px; }
#cp-one .cp-hero-actions { flex-direction:column; }
#cp-one .cp-hero-notes { gap:8px; }
#cp-one .cp-hero-notes span:last-child { display:none; }
#cp-one .cp-story-top>span { max-width:155px; }
#cp-one .cp-stage b { font-size:11px; }
#cp-one .cp-stage small { font-size:11px; }
#cp-one .cp-work-card { padding:20px; }
#cp-one .cp-mini-app { right:10px;width:58%; }
#cp-one .cp-veil-footer { flex-wrap:wrap; }
#cp-one .cp-veil-footer input { width:100%; }
#cp-one .cp-model-specs { flex-direction:column;align-items:start; }
}
@media (prefers-reduced-motion:reduce) {
#cp-one *,#cp-one *:before,#cp-one *:after { animation:none!important;transition:none!important;scroll-behavior:auto!important; }
#cp-one .cp-scan { display:none; }
}
/* Continuous editor recording: all movement is driven by a single 10s clock. */
#cp-one .cp-film { text-align:left; margin-top:6px; --film-row:22px; --film-zoom:1; --film-scroll:0px; --film-pulse:0; }
#cp-one .cp-film-eyeline { display:flex; align-items:center; justify-content:space-between; gap:16px; margin:0 3px 14px; font-size:11px; color:#969e9a; }
#cp-one .cp-film-eyeline>span { display:flex; align-items:center; gap:8px; }
#cp-one .cp-film-eyeline .cp-status-dot { width:5px;height:5px; }
#cp-one .cp-film-eyeline small { font-size:10px; color:#707a75; }
#cp-one .cp-film-grid { display:grid; grid-template-columns:minmax(0,2fr) minmax(0,1fr); gap:15px; align-items:stretch; }
#cp-one .cp-film-screen { position:relative; min-width:0; border-radius:12px; background:#141617; box-shadow:0 15px 38px #0003,inset 0 0 0 1px #373a3b9c; overflow:hidden; }
#cp-one .cp-film-titlebar { display:flex; align-items:center; gap:12px; height:38px; padding:0 16px; background:#1b1e1f; box-shadow:inset 0 -1px 0 #292e2e; color:#a8aeab; font-size:11px; }
#cp-one .cp-film-titlebar .cp-dots i { width:6px;height:6px; }
#cp-one .cp-film-titlebar .cp-dots i:nth-child(1) { background:#76605c; }
#cp-one .cp-film-titlebar .cp-dots i:nth-child(2) { background:#766d54; }
#cp-one .cp-film-titlebar .cp-dots i:nth-child(3) { background:#526f60; }
#cp-one .cp-film-titlebar>span:last-child { margin-left:auto; font-size:9px; letter-spacing:.07em; color:#7d8d83; }
#cp-one .cp-film-main { display:grid; grid-template-columns:minmax(132px,.65fr) minmax(0,1.75fr); min-height:372px; }
#cp-one .cp-film-prompt { padding:22px 16px; background:#151818; border-right:1px solid #2a3030; }
#cp-one .cp-film-prompt-label { display:flex; align-items:center; gap:6px; color:#8fa697; font-size:9px; letter-spacing:.09em; margin-bottom:16px; }
#cp-one .cp-film-prompt-label svg { width:12px;height:12px; }
#cp-one .cp-film-prompt h3 { font-size:17px;line-height:1.35;letter-spacing:-.025em; margin-bottom:13px; }
#cp-one .cp-film-prompt p { font-size:11px;line-height:1.8;color:#989f9b; }
#cp-one .cp-film-prompt strong { color:#b3bcb6; font-weight:500; }
#cp-one .cp-film-prompt ul { list-style:none;padding:0;margin:20px 0;display:grid;gap:9px;font-size:10px;color:#88968e; }
#cp-one .cp-film-prompt li { display:flex;gap:7px;align-items:baseline; }
#cp-one .cp-film-prompt li:before { content:'·';color:#92b6a2; }
#cp-one .cp-film-example { padding:11px 0 0;border-top:1px solid #28312b;font-size:10px;color:#acbfb0;line-height:1.9; }
#cp-one .cp-film-example small { display:block;font-family:'DM Sans',sans-serif;font-size:9px;color:#717f77;margin-bottom:5px; }
#cp-one .cp-film-editor { min-width:0;position:relative; background:#141719; }
#cp-one .cp-film-tabs { display:flex;align-items:center;height:36px;background:#181c1e;gap:0;box-shadow:inset 0 -1px 0 #2b3133; }
#cp-one .cp-film-tab { display:flex;align-items:center;gap:7px;min-height:36px;min-width:0;padding:8px 13px;border:0;background:transparent;color:#75818a;font:10px 'JetBrains Mono',monospace;white-space:nowrap;position:relative; }
#cp-one .cp-film-tab::after { content:'';height:1px;position:absolute;bottom:0;left:0;right:0;background:transparent; }
#cp-one .cp-film-tab[aria-pressed=true] { color:#b5c5bb;background:#141719; }
#cp-one .cp-film-tab[aria-pressed=true]::after { background:#85b6a0; }
#cp-one .cp-film-tab:hover { color:#c3d3c9;background:#20272a; }
#cp-one .cp-film-tab .cp-file-letter { color:#8eacd0; font-size:9px; }
#cp-one .cp-film-tab:nth-child(2) .cp-file-letter { color:#bcad83; }
#cp-one .cp-film-zoom-label { margin-left:auto;padding:0 9px;font:9px 'JetBrains Mono',monospace;color:#637b70; }
#cp-one .cp-film-code-viewport { height:calc(var(--film-row) * 14 + 20px);overflow:hidden;position:relative; }
#cp-one .cp-film-code-plane { transform:scale(var(--film-zoom));transform-origin:0 65%;will-change:transform; padding:10px 0; }
#cp-one .cp-film-code-lines { transform:translateY(calc(-1 * var(--film-scroll)));will-change:transform; }
#cp-one .cp-film-line { display:flex;align-items:center;height:var(--film-row);position:relative;font:400 11px/var(--film-row) 'JetBrains Mono',ui-monospace,monospace;white-space:pre; }
#cp-one .cp-film-line.cp-line-active { background:#8bab9510; }
#cp-one .cp-film-line.cp-line-active::before { content:'';width:2px;position:absolute;left:0;top:0;bottom:0;background:#8db49d9c; }
#cp-one .cp-film-ln { width:36px; flex:none;text-align:right;padding-right:13px;color:#505e63;font-size:10px;user-select:none; }
#cp-one .cp-line-active .cp-film-ln { color:#a2c5ae; }
#cp-one .cp-film-code-text { color:#b1bebb;min-width:0; }
#cp-one .cp-film-code-text .fkw { color:#b5a3c5; }
#cp-one .cp-film-code-text .ffn { color:#93b5cf; }
#cp-one .cp-film-code-text .fstr { color:#b7b98f; }
#cp-one .cp-film-code-text .fnum { color:#c3a982; }
#cp-one .cp-film-code-text .fcomment { color:#596f65; }
#cp-one .cp-film-caret { display:inline-block;height:13px;width:1.5px;background:#b1d2bc;vertical-align:-2px;margin-left:1px; }
#cp-one .cp-film-scrollbar { position:absolute;top:10px;bottom:10px;right:5px;width:3px;background:#505c6012;border-radius:3px; }
#cp-one .cp-film-scrollbar span { display:block;width:3px;height:42%;background:#6a7a725e;border-radius:3px;transform:translateY(var(--film-thumb,0px)); }
#cp-one .cp-film-statusbar { display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:27px;padding:0 12px;background:#1a2020;color:#74897b;font:9px 'JetBrains Mono',monospace; }
#cp-one .cp-film-statusbar>span:last-child { color:#82938a; }
#cp-one .cp-film-pointer { position:absolute;z-index:4;left:0;top:0;width:22px;height:28px;pointer-events:none;will-change:transform;opacity:var(--film-pointer-opacity,1);filter:drop-shadow(1px 3px 3px #0009); }
#cp-one .cp-film-pointer svg { width:17px;height:21px;stroke:#d4ded7;fill:#17231b;stroke-width:1.7; }
#cp-one .cp-film-pointer small { position:absolute;left:17px;top:19px;color:#acd2b9;background:#294237;box-shadow:0 2px 5px #0002;border-radius:4px;padding:1px 5px;font:8px/1.5 'DM Sans',sans-serif; }
#cp-one .cp-film-click { position:absolute;left:-7px;top:-7px;width:25px;height:25px;border:1px solid #b5d5c29c;border-radius:50%;opacity:var(--film-click,0);transform:scale(var(--film-click-scale,1)); }
#cp-one .cp-film-context { display:flex;flex-direction:column;background:#191e1e;border-radius:12px;min-width:0;overflow:hidden;box-shadow:inset 0 0 0 1px #3b464138,0 12px 32px #0002; }
#cp-one .cp-film-context-title { min-height:49px;display:flex;gap:9px;align-items:center;padding:0 19px;font-size:11px;font-weight:500;letter-spacing:.095em;color:#b2c5b7; }
#cp-one .cp-film-context-title svg { width:14px;height:14px;color:#90bca1; }
#cp-one .cp-film-live { margin-left:auto;font-size:8px;font-weight:400;letter-spacing:.04em;color:#93af9c;display:inline-flex;align-items:center;gap:5px; }
#cp-one .cp-film-live::before { content:'';width:4px;height:4px;border-radius:50%;background:#8db39a; }
#cp-one .cp-film-context-body { padding:0 13px 13px;display:flex;flex-direction:column;gap:10px;flex:1; }
#cp-one .cp-film-file { padding:14px 14px 11px;border-radius:7px;background:color-mix(in srgb,#3d7356 calc(var(--file-flash,0)*33%),#202827);box-shadow:inset 0 0 0 1px rgb(137 189 156 / calc(var(--file-flash,0)*.38));min-height:103px; }
#cp-one .cp-film-file-top { display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px;font:11px 'JetBrains Mono',monospace;color:#bdcfc3; }
#cp-one .cp-film-file-top .cp-film-update-badge { opacity:var(--file-flash,0);font:8px 'DM Sans',sans-serif;letter-spacing:.06em;color:#b9dfc7; }
#cp-one .cp-film-range { display:flex;align-items:baseline;justify-content:space-between;gap:8px; }
#cp-one .cp-film-range strong { color:#bccfc2; font:400 21px/1.3 'JetBrains Mono',monospace;letter-spacing:-.8px; }
#cp-one .cp-film-range small { font-size:9px;color:#88a793; }
#cp-one .cp-film-file-detail { display:flex;align-items:center;gap:5px;margin-top:8px;font-size:10px;line-height:1.5;color:#8ea899; }
#cp-one .cp-film-file-detail svg { width:10px;height:10px; }
#cp-one .cp-film-file.cp-film-testfile { opacity:var(--test-opacity,0);transform:translateY(var(--test-y,9px)); }
#cp-one .cp-film-context-empty { position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:20px;text-align:center;font-size:11px;line-height:1.8;color:#61776b;opacity:var(--empty-opacity,1); }
#cp-one .cp-film-file-slot { position:relative;min-height:103px; }
#cp-one .cp-film-receipt { padding:9px 2px 0;margin-top:auto;min-height:72px; }
#cp-one .cp-film-receipt-label { display:flex;gap:7px;align-items:center;font-size:9px;color:#718d7b;letter-spacing:.06em;margin-bottom:7px; }
#cp-one .cp-film-receipt-label i { width:4px;height:4px;border-radius:50%;background:#6e9e80; }
#cp-one .cp-film-receipt p { font:10px/1.8 'JetBrains Mono',monospace;color:#9eb5a6;overflow-wrap:anywhere; }
#cp-one .cp-film-receipt p span { color:#708c7c; }
#cp-one .cp-film-context-foot { display:flex;justify-content:space-between;gap:8px;padding:11px 17px;background:#151a19;font-size:10px;color:#809989; }
#cp-one .cp-film-context-foot span:last-child { color:#96b09f; }
#cp-one .cp-film-player { display:flex;align-items:center;gap:12px;margin-top:13px;min-height:42px;color:#8f9c94; }
#cp-one .cp-film-control { border:0;border-radius:5px;min-height:36px;min-width:31px;padding:5px 8px;display:inline-flex;gap:7px;align-items:center;justify-content:center;background:transparent;color:#9eadA3;font-size:11px; }
#cp-one .cp-film-control:hover { background:#252d28;color:#c3d3c9; }
#cp-one .cp-film-control svg { width:13px;height:13px; }
#cp-one .cp-film-time { font:10px 'JetBrains Mono',monospace;color:#73867b;min-width:65px;white-space:nowrap; }
#cp-one .cp-film-player input { min-width:50px;flex:1;appearance:none;-webkit-appearance:none;height:34px;background:transparent;outline-offset:2px; }
#cp-one .cp-film-player input::-webkit-slider-runnable-track { height:3px;border-radius:3px;background:linear-gradient(to right,#709d84 var(--film-progress,0%),#303b34 var(--film-progress,0%)); }
#cp-one .cp-film-player input::-webkit-slider-thumb { appearance:none;-webkit-appearance:none;width:8px;height:8px;border-radius:50%;background:#a2bdaa;margin-top:-2.5px; }
#cp-one .cp-film-player input::-moz-range-track { height:3px;border-radius:3px;background:#303b34; }
#cp-one .cp-film-player input::-moz-range-progress { height:3px;border-radius:3px;background:#709d84; }
#cp-one .cp-film-player input::-moz-range-thumb { width:8px;height:8px;border:0;border-radius:50%;background:#a2bdaa; }
#cp-one .cp-film-scene-label { font-size:10px;min-width:142px;text-align:right;color:#819689; }
#cp-one .cp-film-caption { text-align:center;font-size:12px;color:#919e96;margin-top:6px;min-height:20px; }
#cp-one .cp-film-demo-label { font-size:10px;color:#69786f; }
@container (max-width:1000px) {
#cp-one .cp-film-main { grid-template-columns:minmax(120px,.56fr) minmax(0,1.7fr); }
#cp-one .cp-film-prompt { padding:20px 12px; }
#cp-one .cp-film-tab { padding-inline:10px; }
#cp-one .cp-film-context-title { padding-inline:14px;font-size:10px; }
#cp-one .cp-film-file { padding-inline:11px; }
#cp-one .cp-film-live { font-size:8px; }
#cp-one .cp-film-ln { width:32px;padding-right:10px; }
}
@container (max-width:850px) {
#cp-one .cp-film-grid { gap:12px;grid-template-columns:minmax(0,1.95fr) minmax(0,1fr); }
#cp-one .cp-film-main { grid-template-columns:1fr; }
#cp-one .cp-film-prompt { padding:14px 15px;border-right:0;border-bottom:1px solid #29302f;display:grid;grid-template-columns:auto 1fr;column-gap:14px;align-items:center; }
#cp-one .cp-film-prompt-label { margin:0;grid-column:1;font-size:8px; }
#cp-one .cp-film-prompt h3 { font-size:14px;margin:4px 0 0;grid-column:1;white-space:nowrap; }
#cp-one .cp-film-prompt p { grid-row:1 / span 2;grid-column:2;font-size:11px;line-height:1.65; }
#cp-one .cp-film-prompt ul,#cp-one .cp-film-example { display:none; }
#cp-one .cp-film-context-title { font-size:10px;letter-spacing:.05em;gap:6px; }
#cp-one .cp-film-live { display:none; }
#cp-one .cp-film-context-body { padding-inline:10px;gap:15px;padding-top:6px; }
#cp-one .cp-film-file { min-height:115px;padding:17px 12px 13px; }
#cp-one .cp-film-range { flex-wrap:wrap;gap:5px; }
#cp-one .cp-film-range strong { font-size:22px; }
#cp-one .cp-film-range small { font-size:10px; }
#cp-one .cp-film-file-top { font-size:11px; }
#cp-one .cp-film-file-detail { font-size:10px; }
#cp-one .cp-film-file-slot { min-height:115px; }
#cp-one .cp-film-receipt { padding-top:10px; }
#cp-one .cp-film-context-foot { flex-direction:column;gap:2px;padding:12px 15px; }
}
@container (max-width:650px) {
#cp-one .cp-film { --film-row:20px; }
#cp-one .cp-film-grid { grid-template-columns:1fr;gap:12px; }
#cp-one .cp-film-eyeline { margin:0 0 11px;font-size:10px; }
#cp-one .cp-film-eyeline small { font-size:9px; }
#cp-one .cp-film-titlebar { height:36px;padding-inline:13px;font-size:10px; }
#cp-one .cp-film-main { min-height:0; }
#cp-one .cp-film-prompt { padding:13px 14px;column-gap:15px; }
#cp-one .cp-film-prompt p { font-size:11px; }
#cp-one .cp-film-prompt h3 { font-size:14px; }
#cp-one .cp-film-tabs,#cp-one .cp-film-tab { min-height:39px;height:39px; }
#cp-one .cp-film-tab { font-size:11px;padding:9px 14px; }
#cp-one .cp-film-code-viewport { height:calc(var(--film-row)*14 + 20px); }
#cp-one .cp-film-line { font-size:11px; }
#cp-one .cp-film-ln { font-size:10px;width:35px;padding-right:12px; }
#cp-one .cp-film-context-title { min-height:42px;font-size:11px;padding-inline:16px;letter-spacing:.06em; }
#cp-one .cp-film-live { display:inline-flex;font-size:9px; }
#cp-one .cp-film-context-body { display:grid;grid-template-columns:1fr 1fr;padding:0 11px 11px;gap:10px; }
#cp-one .cp-film-file,#cp-one .cp-film-file-slot { min-height:110px; }
#cp-one .cp-film-file { padding:12px; }
#cp-one .cp-film-file-top { font-size:11px;margin-bottom:10px; }
#cp-one .cp-film-file-top .cp-film-update-badge { font-size:7px; }
#cp-one .cp-film-file-detail { font-size:10px; }
#cp-one .cp-film-range strong { font-size:22px; }
#cp-one .cp-film-range small { font-size:10px; }
#cp-one .cp-film-context-empty { padding:13px;font-size:11px; }
#cp-one .cp-film-receipt { grid-column:1/-1;min-height:0;padding:4px 4px 0; }
#cp-one .cp-film-receipt-label { font-size:9px;margin-bottom:4px; }
#cp-one .cp-film-receipt p { font-size:11px; }
#cp-one .cp-film-context-foot { flex-direction:row;font-size:10px;padding:11px 15px; }
#cp-one .cp-film-player { gap:5px;flex-wrap:wrap;margin-top:10px; }
#cp-one .cp-film-control { min-height:44px;min-width:34px;padding:7px; }
#cp-one .cp-film-control #cp-motion-text { display:none; }
#cp-one .cp-film-time { min-width:64px;font-size:10px; }
#cp-one .cp-film-player input { min-height:44px; }
#cp-one .cp-film-scene-label { flex-basis:100%;text-align:center;font-size:11px;min-height:18px; }
#cp-one .cp-film-caption { font-size:11px;line-height:1.75;margin-top:7px; }
}
@container (max-width:355px) {
#cp-one .cp-film-prompt { grid-template-columns:1fr;gap:6px; }
#cp-one .cp-film-prompt-label { display:none; }
#cp-one .cp-film-prompt h3 { margin:0; }
#cp-one .cp-film-prompt p { grid-column:1;grid-row:auto; }
#cp-one .cp-film-context-title { font-size:10px;padding-inline:13px; }
#cp-one .cp-film-context-body { gap:7px;padding-inline:9px; }
#cp-one .cp-film-file { padding:11px 9px; }
#cp-one .cp-film-file-top .cp-film-update-badge { display:none; }
#cp-one .cp-film-line { font-size:11px; }
#cp-one .cp-film-zoom-label { font-size:8px; }
}
@media (prefers-reduced-motion:reduce) {
#cp-one .cp-film-code-plane { transform:none!important; }
#cp-one .cp-film-pointer { display:none; }
}
#cp-one .cursor-interaction { cursor:pointer; }
#cp-one svg { width:16px; height:16px; flex-shrink:0; vertical-align:middle; }
#cp-one .cp-mini-keyword { color:#b3a0ce; }
#cp-one [data-price] { font-weight:inherit; }
#cp-one .cp-film-caret.cp-caret-dim { opacity:.55; }
#cp-one .cp-sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
#cp-one .cp-footer nav { flex-wrap:wrap; }

/* Keep account/download access available inside the expanded phone menu. */
#cp-one .cp-mobile-account,#cp-one .cp-mobile-download { display:none; }
@container (max-width:900px) {
  #cp-one .cp-mobile-account { display:contents; }
  #cp-one .cp-mobile-account .cp-button { background:transparent; padding:12px 0; min-height:44px; justify-content:flex-start; font-weight:400; }
}
@container (max-width:355px) {
  #cp-one .cp-mobile-download { display:block; }
}