/* V27 — saturated red, neutral materials, precise framing. */
.theme-page{--ui-bg:#060606;--ui-panel:#171717f0;--ui-panel-2:#222;--ui-accent:var(--tone-ff002b,#ff002b);--ui-accent-2:var(--tone-ff4d5f,#ff4d5f);--ui-text:#fff;--ui-muted:#b0b0b0;--ui-line:#ffffff16;background:#060606;color:#fff}
.theme-page.platform-page{background:#060606}
.site-lightfield{background:radial-gradient(ellipse at 10% 40%,var(--tone-ff002b1c,#ff002b1c),transparent 40%),radial-gradient(ellipse at 90% 12%,var(--tone-ff002b14,#ff002b14),transparent 38%),#060606}
.site-lightfield:before,.site-lightfield:after{display:none}
.site-lightfield i{opacity:.1}
.reactive-scene{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;--scene-x:0px;--scene-y:0px}
.reactive-particles{display:block;width:100%;height:100%;opacity:.9}
.scene-object{position:absolute;perspective:600px;transform:translate3d(var(--scene-x),var(--scene-y),0);transition:opacity .4s;opacity:.65}
.object-a{left:7%;top:24%;--object-size:44px}
.object-b{right:7%;top:49%;--object-size:32px;opacity:.45}
.object-c{right:12%;top:21%;opacity:.55}
.object-d{left:13%;top:72%;opacity:.55}
.scene-cube{width:var(--object-size);height:var(--object-size);position:relative;transform-style:preserve-3d;animation:cubeOrbit 22s linear infinite}
.scene-cube i{position:absolute;inset:0;border:1px solid var(--tone-ff9aa066,#ff9aa066);background:linear-gradient(145deg,var(--tone-ff003bb8,#ff003bb8),var(--tone-690013e8,#690013e8));box-shadow:inset 0 1px #ffffff45,inset 0 0 15px var(--tone-ff002b30,#ff002b30)}
.scene-cube i:nth-child(1){transform:translateZ(calc(var(--object-size)/2))}
.scene-cube i:nth-child(2){transform:rotateY(180deg) translateZ(calc(var(--object-size)/2))}
.scene-cube i:nth-child(3){transform:rotateY(90deg) translateZ(calc(var(--object-size)/2))}
.scene-cube i:nth-child(4){transform:rotateY(-90deg) translateZ(calc(var(--object-size)/2))}
.scene-cube i:nth-child(5){transform:rotateX(90deg) translateZ(calc(var(--object-size)/2))}
.scene-cube i:nth-child(6){transform:rotateX(-90deg) translateZ(calc(var(--object-size)/2))}
.scene-cube.graphite{animation-direction:reverse;animation-duration:28s}
.scene-cube.graphite i{background:linear-gradient(145deg,#5b5b5b,#121212);border-color:#ffffff36;box-shadow:inset 0 1px #ffffff66}
.scene-ring{width:56px;height:56px;border:8px solid var(--tone-ff002b,#ff002b);border-radius:50%;box-shadow:inset 0 2px 3px var(--tone-ff9faf,#ff9faf),0 3px 0 var(--tone-630015,#630015),0 10px 30px var(--tone-ff002b26,#ff002b26);animation:ringOrbit 18s ease-in-out infinite}
.scene-sphere{width:25px;height:25px;border-radius:50%;background:radial-gradient(circle at 30% 25%,#fff9,#999 13%,#363636 45%,#0d0d0d 85%);box-shadow:0 4px 15px #0008;animation:sphereDrift 9s ease-in-out infinite alternate}
.site-brand b{color:var(--tone-ff163a,#ff163a)}
.site-brand:before{background:linear-gradient(145deg,var(--tone-ff234b,#ff234b),var(--tone-ed002a,#ed002a));border-color:var(--tone-ff759080,#ff759080);box-shadow:inset 0 1px var(--tone-ffb5c1,#ffb5c1),inset 0 -4px var(--tone-8f0020,#8f0020),0 0 25px var(--tone-ff002b22,#ff002b22)}
.site-header-inner{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)}
.site-nav{background:linear-gradient(180deg,#ffffff05,transparent),#151515ec;backdrop-filter:blur(12px);border-color:#ffffff18}
.site-nav-link{font-size:12px;color:#bcbcbc}
.site-nav-link.active{background:linear-gradient(150deg,var(--tone-e9002c,#e9002c),var(--tone-c70023,#c70023));border-color:var(--tone-ff295560,#ff295560);color:#fff;box-shadow:inset 0 1px var(--tone-ff819950,#ff819950),0 4px 18px var(--tone-ff002b1b,#ff002b1b)}
.theme-page :is(.platform-btn.primary,.primary-btn.primary-btn,.search-box.search-box button,.modal-url-row.modal-url-row button,.accent-btn.accent-btn){background:linear-gradient(135deg,var(--tone-ef002c,#ef002c),var(--tone-cb0024,#cb0024));color:#fff;border-color:var(--tone-ff466960,#ff466960);box-shadow:inset 0 1px var(--tone-ff8ba866,#ff8ba866),inset 0 -2px var(--tone-8b001e,#8b001e),0 8px 22px var(--tone-ff002b20,#ff002b20)}
.theme-page :is(.platform-btn,.primary-btn,.secondary-btn,.soft-btn,.ghost-btn,.back-btn,.replay-btn){transition:transform .2s,background .2s,border-color .2s,box-shadow .2s}
.theme-page :is(.primary-btn,.accent-btn,.platform-btn.primary):hover{box-shadow:inset 0 1px var(--tone-ff8ba866,#ff8ba866),0 9px 28px var(--tone-ff002b3a,#ff002b3a);transform:translateY(-2px)}
.theme-page :is(.hero h1 em,.studio-head h1 em,.platform-page-shell h1 span){color:var(--tone-ff163a,#ff163a)}
.theme-page :is(.hero h1,.studio-head h1){font-size:clamp(38px,4.3vw,60px);letter-spacing:-.055em}
.theme-page :is(.hero p,.studio-head p){color:#b1b1b1}
.theme-page :is(.hero,.studio-head){padding-bottom:32px}
.theme-page .site-statusline{margin-bottom:4px}
.theme-page :is(.panel,.stat-card,.platform-card,.obs-card,.help-card,.connection-card,.empty-state){background:linear-gradient(145deg,#ffffff07,transparent 50%),#171717f5;backdrop-filter:none;border-color:#ffffff16;box-shadow:inset 0 1px #ffffff0d,0 20px 40px #0005}
.theme-page :is(.settings-panel,.config-panel,.preview-panel){padding:28px}
.theme-page :is(.panel-head,.panel-title){gap:16px}
.theme-page :is(.panel-head h2,.panel-title h2){font-size:22px;line-height:1.2}
.theme-page :is(.panel-kicker,.kicker,.panel-title small){font-size:9px;color:#aaa;letter-spacing:.13em}
.theme-page :is(.settings-panel label,.option-label,.export-panel label){font-size:12px;color:#bbb}
.theme-page .field-row{gap:14px;margin-bottom:18px}
.theme-page :is(.platform-row,.alert-section,.alert-event-card,.sub-accordion,.donation-tier-card,.event-enabled-row,.event-row,.preview-message,.obs-settings>div){background:linear-gradient(140deg,#ffffff03,transparent),#101010de;border-color:#ffffff12}
.theme-page .alert-event-card[open]{border-color:var(--tone-ff002b36,#ff002b36);background:#121212}
.theme-page input[type=range],.theme-page input[type=checkbox]{accent-color:var(--tone-ff002b,#ff002b)}
.theme-page :is(input[type=text],input[type=url],input[type=number],input[type=password],select){border-color:#ffffff17;background:#0a0a0a;color:#f3f3f3;min-height:40px;font-size:12px}
.theme-page :is(input[type=text],input[type=url],input[type=number],input[type=password],select):focus{border-color:var(--tone-ff164f80,#ff164f80);box-shadow:0 0 0 3px var(--tone-ff002b14,#ff002b14)}
.theme-page .tab.active{background:linear-gradient(150deg,var(--tone-e9002c,#e9002c),var(--tone-bd0022,#bd0022));border-color:var(--tone-ff376a50,#ff376a50);color:#fff;box-shadow:inset 0 1px #ffffff15,0 4px 14px var(--tone-ff002b12,#ff002b12)}
.theme-page .switch input:checked+span{background:var(--tone-ff002b30,#ff002b30);border-color:var(--tone-ff002b66,#ff002b66)}
.theme-page .switch input:checked+span:after{background:var(--tone-ff2345,#ff2345);box-shadow:0 0 12px var(--tone-ff002b44,#ff002b44)}
.theme-page .stat-card.hot{background:linear-gradient(140deg,var(--tone-ff002b18,#ff002b18),transparent 65%),#171717;border-color:var(--tone-ff163f40,#ff163f40)}
.theme-page .stat-label{color:#c9c9c9}
.theme-page .stat-card small{color:#999}
.theme-page :is(.obs-icon,.event-summary-icon,.connection-icon,.empty-icon){background:linear-gradient(135deg,var(--tone-ff002b27,#ff002b27),var(--tone-ff002b0b,#ff002b0b));border-color:var(--tone-ff002b45,#ff002b45);color:var(--tone-ff6c81,#ff6c81);box-shadow:inset 0 1px var(--tone-ff91a120,#ff91a120)}
.theme-page .platform-plan{background:radial-gradient(ellipse at 100% 0,var(--tone-ff002b17,#ff002b17),transparent 60%),#171717;border-color:var(--tone-ff002b45,#ff002b45)}
.theme-page :is(.platform-paywall-card,.obs-modal,.modal){background:linear-gradient(140deg,#ffffff06,transparent),#161616fa;backdrop-filter:blur(16px);border-color:#ffffff20}
.theme-page .platform-page-lead{color:#b3b3b3}
.theme-page .platform-card{padding:32px}
/* Framing belongs to the editor; exported overlays keep their own geometry. */
.theme-page :is(.preview-stage,.chat-frame-wrap,.preview-box){background:radial-gradient(ellipse at 50% 65%,var(--tone-ff002b09,#ff002b09),transparent 60%),#090909;border:1px solid #ffffff16;border-radius:18px;box-shadow:inset 0 1px #ffffff07,inset 0 0 60px #0004}
.theme-page .preview-column{min-width:0}
.theme-page .preview-top{padding:0 2px 12px}
.theme-page .preview-top>div{display:flex;flex-wrap:wrap;gap:9px;align-items:center}
.theme-page .preview-top small{flex-basis:100%;color:#959595;line-height:1.5;margin:0 0 0 16px}
.theme-page.page-social .preview-stage{height:330px}
.theme-page .preview-panel .panel-head{min-width:0;align-items:center}
.theme-page .preview-panel .preview-stage{margin-top:24px;height:300px;aspect-ratio:auto}
.theme-page .preview-panel .preview-stage.vertical-preview{height:460px}
.theme-page .preview-stage iframe:not(.hidden){display:block;border:0;background:transparent}
.theme-page.page-social .preview-stage:before{display:none}
.theme-page .obs-card{min-width:0;padding:16px;gap:14px}
.theme-page .obs-card code{max-width:100%;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.theme-page .obs-grid{margin-top:16px;gap:12px}
.theme-page :is(.export-block,.obs-export){border-color:#ffffff15}
.theme-page .export-copy{gap:12px}
.theme-page .export-copy span{font-size:10px;line-height:1.6;color:#a0a0a0}
.theme-page .chat-panel .panel-head{padding-bottom:20px;min-height:84px}
.theme-page .chat-panel .chat-frame-wrap{height:560px}
.theme-page :is(.preview-head,.chat-header,.chat-bar){background:#1b1b1b;border-color:#ffffff12;color:#ddd}
/* Identical sample wells and footers in all four gallery cards. */
.depth-intro{padding-top:32px}
.depth-eyebrow{color:#d8d8d8;background:var(--tone-ff002b08,#ff002b08);border-color:var(--tone-ff002b26,#ff002b26);font-size:9px}
.depth-eyebrow i{background:var(--tone-ff163a,#ff163a);box-shadow:0 0 12px var(--tone-ff002b7a,#ff002b7a)}
.theme-page .home-center .depth-intro h1{font-size:clamp(44px,4.7vw,64px);line-height:1.08;letter-spacing:-.06em;margin:20px auto 18px;font-weight:650}
.theme-page .home-center .depth-intro h1 em{background:linear-gradient(100deg,var(--tone-ff143c,#ff143c),var(--tone-ff002b,#ff002b) 55%,var(--tone-ff3e54,#ff3e54));background-clip:text;-webkit-background-clip:text;color:transparent;-webkit-text-fill-color:transparent;text-shadow:0 4px 30px var(--tone-ff002b16,#ff002b16)}
.depth-intro p{color:#b7b7b7;font-size:15px}
.depth-intro-meta{color:#909090;font-size:10px;margin-top:16px;gap:14px}
.depth-intro-meta i{background:var(--tone-ff173a,#ff173a);box-shadow:0 0 7px var(--tone-ff002b45,#ff002b45)}
.depth-gallery{margin-top:26px}
.depth-gallery-head{color:#ababab;max-width:1060px}
.depth-gallery-head small{color:#828282}
.depth-stage{height:480px;margin-top:14px}
.depth-halo{filter:none;width:1000px;height:430px;background:radial-gradient(ellipse,var(--tone-ff002b2e,#ff002b2e),transparent 67%);animation:depthBreathe 7s ease-in-out infinite alternate}
.depth-halo i{width:930px;height:170px;border-color:var(--tone-ff163f50,#ff163f50);box-shadow:0 0 24px var(--tone-ff002b18,#ff002b18);transform:translate(-50%,-50%) rotate(-8deg)}
.depth-halo b{width:720px;height:290px;border-color:#ffffff14;box-shadow:none;transform:translate(-50%,-50%) rotate(12deg)}
.depth-rail{background:radial-gradient(ellipse,var(--tone-ff002b23,#ff002b23),transparent 66%)}
.theme-page .tool-card.depth-card{width:620px;height:440px;top:16px;padding:28px;border-radius:24px;gap:0;display:grid;backdrop-filter:none;grid-template-columns:minmax(0,1fr);grid-template-rows:36px auto 156px 40px;row-gap:18px;border-color:#ffffff22;background:linear-gradient(145deg,#242424,#111 75%);box-shadow:inset 0 1px #ffffff22,0 25px 55px #0008;overflow:hidden;transition:transform .8s cubic-bezier(.2,.7,.15,1),filter .8s,opacity .8s,border-color .3s}
.theme-page .depth-card[data-position=active]{background:radial-gradient(ellipse at var(--light-x,50%) var(--light-y,0%),var(--tone-ff002b10,#ff002b10),transparent 60%),linear-gradient(145deg,#242424,#111 75%);border-color:var(--tone-ff163f60,#ff163f60);box-shadow:inset 0 1px #ffffff26,0 0 0 1px var(--tone-ff002b08,#ff002b08),0 25px 65px #000b,0 0 55px var(--tone-ff002b0d,#ff002b0d)}
.theme-page .tool-card.depth-card:before{background:linear-gradient(130deg,#ffffff05,transparent 35%,transparent 75%,var(--tone-ff002b07,#ff002b07))}
.theme-page .tool-card.depth-card:after{left:20%;right:20%;background:linear-gradient(90deg,transparent,var(--tone-ff002b,#ff002b),transparent);box-shadow:0 0 13px var(--tone-ff002b88,#ff002b88)}
.theme-page .tool-card.depth-card .tool-top{margin:0;align-items:center}
.theme-page .depth-card .tool-icon{width:36px;height:36px;background:linear-gradient(145deg,var(--tone-ff173a,#ff173a),var(--tone-cb0024,#cb0024));color:#fff;border-color:var(--tone-ff758d70,#ff758d70);box-shadow:inset 0 1px var(--tone-ffb4c177,#ffb4c177),inset 0 -3px var(--tone-80001660,#80001660),0 7px 18px var(--tone-ff002b1c,#ff002b1c)}
.theme-page .depth-card .tool-icon svg{width:20px;height:20px}
.theme-page .depth-card .tool-number{color:#909090;font-size:10px}
.theme-page .tool-card.depth-card .tool-copy{display:flex;flex-direction:column;justify-content:center;min-height:0}
.theme-page .tool-card.depth-card .tool-kicker{color:var(--tone-ff677c,#ff677c);font-size:9px;line-height:1.5;letter-spacing:.15em}
.theme-page .tool-card.depth-card .tool-copy h2{font-size:30px;line-height:1.15;margin:6px 0 10px;letter-spacing:-.045em;font-weight:600}
.theme-page .tool-card.depth-card .tool-copy p{font-size:12px;line-height:1.65;color:#bcbcbc;max-width:530px;margin:0;text-wrap:pretty}
.depth-card .tool-sample{height:156px;min-height:0;margin:0;padding:16px 18px;display:flex;justify-content:center;background:linear-gradient(145deg,#ffffff03,transparent),#080808;border:1px solid #ffffff15;box-shadow:inset 0 1px #0008;border-radius:14px;overflow:hidden;flex:none}
.depth-card .sample-counter strong{color:var(--tone-ff284a,#ff284a);font-size:36px;line-height:1.1;letter-spacing:-.045em}
.depth-card .sample-counter .sample-chart{height:55px;width:50%;overflow:hidden}
.depth-card .sample-live{color:var(--tone-ff4562,#ff4562);font-size:8px}
.depth-card .sample-live:before{background:var(--tone-ff002b,#ff002b);box-shadow:0 0 7px var(--tone-ff002b88,#ff002b88)}
.depth-card .sample-counter small{font-size:8px;color:#8f8f8f}
.depth-metrics{font-size:7px;letter-spacing:.08em;padding-top:12px;margin-top:12px;color:#969696}
.depth-metrics b{font-size:12px;line-height:1.2;color:#e0e0e0;margin-top:5px}
.depth-card .sample-chat{gap:8px}
.depth-card .sample-chat .sample-message:last-child{display:flex}
.depth-card .sample-message,.depth-card .sample-message b{font-size:10px;line-height:1.35}
.depth-card .sample-message{gap:8px;color:#b6b6b6}
.depth-card .sample-avatar{width:20px;height:20px;font-size:8px;background:var(--tone-e40028,#e40028);color:#fff}
.depth-card .sample-avatar.a1{background:#444}.depth-card .sample-avatar.a2{background:var(--tone-a40023,#a40023)}.depth-card .sample-avatar.a3{background:#686868}
.depth-chat-status{font-size:8px;margin-top:10px;padding-top:9px;color:#aaa}
.depth-chat-status i,.depth-card-note i{background:var(--tone-ff173a,#ff173a);box-shadow:0 0 8px var(--tone-ff002b44,#ff002b44)}
.depth-card .sample-social{gap:14px}
.depth-card .sample-brand{width:36px;height:36px;border-radius:10px}
.depth-card .sample-handle{font-size:15px;color:#fff;margin-top:11px}
.depth-card .sample-handle span{font-size:7px;color:#aaa;margin-top:5px}
.depth-social-status{font-size:8px;color:#a0a0a0;margin-top:11px;padding-top:10px;gap:10px}
.depth-social-status i{background:var(--tone-ff002b,#ff002b)}
.depth-card .sample-goal>div:first-child{font-size:11px;color:#ddd}
.depth-card .sample-goal>small{font-size:9px;color:#999;margin-top:6px}
.depth-card .sample-goal strong{color:#fff;font-size:14px}
.depth-card .sample-track{height:7px;margin-top:10px;background:#2a2a2a}
.depth-card .sample-track i{background:linear-gradient(90deg,var(--tone-ee002c,#ee002c),var(--tone-ff3e54,#ff3e54));box-shadow:0 0 10px var(--tone-ff002b36,#ff002b36)}
.depth-card .sample-donation{background:var(--tone-ff002b0d,#ff002b0d);border-color:var(--tone-ff002b32,#ff002b32);padding:9px 10px;margin-top:11px}
.depth-card .sample-donation b{font-size:10px;color:#eee}
.depth-card .sample-donation small{font-size:8px;color:#aaa}
.depth-card .sample-donation em{font-size:6px;color:var(--tone-ff6b7e,#ff6b7e)}
.depth-card .sample-heart{color:var(--tone-ff2348,#ff2348)}
.theme-page .tool-card.depth-card .tool-footer{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:0;padding:0;height:40px}
.theme-page .tool-card.depth-card .tool-open{height:40px;display:flex;align-items:center;border-radius:10px;font-size:11px;padding:11px 15px;color:#fff;background:linear-gradient(135deg,var(--tone-ec002b,#ec002b),var(--tone-c80023,#c80023));border-color:var(--tone-ff577150,#ff577150);box-shadow:inset 0 1px var(--tone-ff92a350,#ff92a350),inset 0 -2px var(--tone-81001766,#81001766),0 7px 18px var(--tone-ff002b18,#ff002b18);gap:18px}
.depth-card-note{font-size:8px;color:#a0a0a0}
.depth-controls{height:36px;margin:0 auto 22px;gap:16px}
.depth-arrow{width:34px;height:34px;border-color:#ffffff24;color:#ddd;background:#151515}
.depth-pause{width:28px;height:28px;background:#151515}
.depth-arrow:hover,.depth-pause:hover{color:#fff;background:var(--tone-ff002b24,#ff002b24);border-color:var(--tone-ff163f70,#ff163f70)}
.depth-pagination{font-size:9px;color:#999}
.depth-pagination>span:first-child{color:var(--tone-ff4f6a,#ff4f6a)}
.depth-progress{width:64px;height:3px}
.depth-progress i{background:var(--tone-ff002b,#ff002b);box-shadow:0 0 9px var(--tone-ff002b66,#ff002b66)}
.depth-selectors{gap:12px}
.tool-selector{min-width:160px;min-height:48px;font-size:12px;background:linear-gradient(160deg,#ffffff06,transparent),#171717;border-color:#ffffff20;color:#bbb;backdrop-filter:none}
.tool-selector.selected{background:linear-gradient(140deg,var(--tone-e8002a,#e8002a),var(--tone-b70022,#b70022));border-color:var(--tone-ff396750,#ff396750);color:#fff;box-shadow:inset 0 1px var(--tone-ff9aae50,#ff9aae50),0 7px 24px var(--tone-ff002b25,#ff002b25)}
.tool-selector:hover{color:#fff;border-color:var(--tone-ff163f50,#ff163f50);box-shadow:0 8px 25px var(--tone-ff002b14,#ff002b14)}
.depth-workflow{margin-top:64px;gap:48px;border-color:#ffffff17;padding:36px 0}
.depth-workflow-copy>span{color:var(--tone-ff5670,#ff5670);font-size:9px}
.depth-workflow-copy h2{font-size:31px;color:#fff}
.depth-workflow-copy p,.depth-workflow li p{color:#aaa;font-size:11px}
.depth-workflow h3{font-size:13px;color:#eee}
.depth-workflow li>span{color:#fff;background:linear-gradient(140deg,var(--tone-ff002b26,#ff002b26),#171717);border-color:var(--tone-ff002b38,#ff002b38);box-shadow:inset 0 1px #ffffff14,inset 0 -2px #0004}
.theme-page .quick-access{padding:22px 24px;background:linear-gradient(130deg,var(--tone-ff002b07,#ff002b07),transparent),#161616;border-color:#ffffff19;backdrop-filter:none}
.quick-copy b{color:#ddd;font-size:9px}
.quick-copy small{color:#999;font-size:10px}
.quick-grid-icon i{background:var(--tone-ff002b,#ff002b)}
.quick-links a{color:#c3c3c3;font-size:10px;padding:13px 12px;border-color:#ffffff12}
.quick-links svg{stroke:var(--tone-ff3e5d,#ff3e5d)}
.theme-page .home-footer{color:#888;font-size:9px}
@keyframes cubeOrbit{from{transform:rotateX(-20deg) rotateY(25deg) rotateZ(-10deg)}to{transform:rotateX(340deg) rotateY(385deg) rotateZ(-10deg)}}
@keyframes ringOrbit{0%,100%{transform:rotateY(35deg) rotateX(25deg) translateY(0)}50%{transform:rotateY(-25deg) rotateX(40deg) translateY(-14px)}}
@keyframes sphereDrift{from{transform:translateY(0)}to{transform:translateY(-18px)}}
.depth-card[data-position=active] .sample-chart path:last-child{stroke-dasharray:480;animation:traceLive 1.7s ease backwards}
.depth-card[data-position=active] .sample-track i{transform-origin:left;animation:sampleFill 1s cubic-bezier(.2,.8,.2,1) backwards}
.depth-card[data-position=active] .sample-message{animation:messageIn .5s ease backwards}
.depth-card[data-position=active] .sample-message:nth-child(2){animation-delay:.12s}
.depth-card[data-position=active] .sample-message:nth-child(3){animation-delay:.24s}
.depth-card[data-position=active] .sample-message:nth-child(4){animation-delay:.36s}
.depth-card[data-position=active] .sample-brand{animation:brandIn .65s cubic-bezier(.2,.9,.2,1) backwards}
.depth-card[data-position=active] .sample-brand:nth-child(2){animation-delay:.08s}
.depth-card[data-position=active] .sample-brand:nth-child(3){animation-delay:.16s}
.depth-card[data-position=active] .sample-brand:nth-child(4){animation-delay:.24s}
.depth-card[data-position=active] .sample-brand:nth-child(5){animation-delay:.32s}
@keyframes traceLive{from{stroke-dashoffset:480}to{stroke-dashoffset:0}}
@keyframes sampleFill{from{transform:scaleX(.1)}to{transform:scaleX(1)}}
@keyframes messageIn{from{opacity:0;transform:translateX(12px);filter:blur(3px)}to{opacity:1;transform:translateX(0);filter:blur(0)}}
@keyframes brandIn{from{opacity:0;transform:perspective(200px) rotateY(-40deg) translateY(8px) scale(.8)}to{opacity:1;transform:perspective(200px) rotateX(5deg)}}
@media(max-width:1100px){.theme-page .tool-card.depth-card{width:570px}.object-a{left:4%;--object-size:34px}.object-b{right:3%}.object-c{right:7%}.theme-page .preview-panel{position:static}.theme-page .settings-panel{padding:26px}}
@media(max-width:1000px){.site-header-inner{grid-template-columns:1fr;grid-template-rows:auto auto auto;gap:14px;width:calc(100% - 40px)}.site-brand{grid-column:1;grid-row:1;justify-self:center}.theme-page .site-account-slot{grid-column:1;grid-row:2;justify-self:center;max-width:100%}.site-nav{grid-column:1;grid-row:3}.site-nav-link{font-size:11px}.theme-page :is(.workspace,.studio-grid){grid-template-columns:minmax(0,1fr)}.theme-page .preview-column{order:-1;position:static}.theme-page .preview-stage{max-height:none}}
@media(max-width:780px){.theme-page .tool-card.depth-card{width:480px;height:448px;padding:26px;grid-template-rows:36px auto 156px 40px;row-gap:16px}.depth-stage{height:490px}.theme-page .home-center .depth-intro h1{font-size:52px}.theme-page .tool-card.depth-card .tool-copy p{font-size:11px}.theme-page .tool-card.depth-card .tool-copy h2{font-size:28px}.depth-workflow{gap:28px}.object-a{--object-size:28px}.object-c{right:4%;opacity:.35}.scene-ring{width:40px;height:40px;border-width:6px}.theme-page .preview-panel .preview-stage{height:300px}.theme-page .preview-panel .preview-stage.vertical-preview{height:450px}.theme-page .quick-access{padding:20px}.quick-links a{font-size:10px}}
@media(max-width:560px){.site-header-inner{width:calc(100% - 32px);gap:14px;padding-top:20px}.site-nav-link{font-size:10px;min-height:38px}.site-nav{gap:4px}.theme-page :is(.hero,.studio-head){padding:16px 0 28px}.theme-page :is(.hero h1,.studio-head h1){font-size:36px;margin:16px auto}.theme-page :is(.hero p,.studio-head p){font-size:13px;line-height:1.65}.theme-page :is(.settings-panel,.config-panel,.preview-panel){padding:20px}.theme-page :is(.panel-head h2,.panel-title h2){font-size:20px}.theme-page .panel-head{flex-wrap:wrap;gap:14px}.theme-page .field-row{gap:12px;margin-bottom:16px}.theme-page .preview-panel .preview-stage{height:250px;margin-top:20px}.theme-page .preview-panel .preview-stage.vertical-preview{height:400px}.theme-page .preview-top small{font-size:10px}.theme-page .chat-panel .chat-frame-wrap{height:480px}.depth-intro{padding-top:28px}.theme-page .home-center .depth-intro h1{font-size:clamp(29px,9vw,40px);line-height:1.12;margin:18px auto 16px}.depth-eyebrow{font-size:7px;letter-spacing:.16em}.depth-intro p{font-size:12px;max-width:300px}.depth-intro-meta{font-size:9px;gap:10px}.depth-gallery{margin-top:28px}.depth-stage{height:468px;margin-top:16px}.depth-halo{width:560px;height:400px}.depth-halo i{width:530px;height:150px}.depth-halo b{width:400px;height:250px}.theme-page .tool-card.depth-card{width:calc(100% - 48px);height:428px;padding:22px;top:16px;grid-template-rows:32px auto 138px 36px;row-gap:16px;border-radius:22px}.theme-page .tool-card.depth-card .tool-top{margin:0}.theme-page .depth-card .tool-icon{width:32px;height:32px}.theme-page .depth-card .tool-icon svg{width:18px;height:18px}.theme-page .tool-card.depth-card .tool-kicker{font-size:8px}.theme-page .tool-card.depth-card .tool-copy h2{font-size:26px;margin:6px 0 9px}.theme-page .tool-card.depth-card .tool-copy p{font-size:11px;line-height:1.6}.depth-card .tool-sample{height:138px;min-height:0;margin:0;padding:13px;border-radius:12px}.depth-card .sample-counter strong{font-size:30px}.depth-card .sample-counter .sample-chart{width:42%;height:48px}.depth-card .sample-counter small{font-size:7px}.depth-card .sample-live{font-size:6px}.depth-metrics{font-size:6px;gap:8px;padding-top:10px;margin-top:10px}.depth-metrics b{font-size:10px}.depth-card .sample-message,.depth-card .sample-message b{font-size:8px}.depth-card .sample-message{gap:6px}.depth-card .sample-chat{gap:6px}.depth-card .sample-avatar{width:17px;height:17px;font-size:7px}.depth-chat-status{font-size:6px;padding-top:8px;margin-top:8px}.depth-card .sample-social{gap:8px}.depth-card .sample-brand{width:29px;height:29px}.depth-card .sample-brand svg{width:17px;height:17px}.depth-card .sample-handle{font-size:13px;margin-top:10px}.depth-card .sample-handle span{font-size:6px}.depth-social-status{font-size:6px;gap:8px;margin-top:9px;padding-top:8px}.depth-card .sample-goal>div:first-child{font-size:10px}.depth-card .sample-goal>small{font-size:7px}.depth-card .sample-goal strong{font-size:12px}.depth-card .sample-donation{padding:8px;margin-top:10px;gap:6px}.depth-card .sample-donation b{font-size:8px}.depth-card .sample-donation small{font-size:6px}.depth-card .sample-track{height:6px;margin-top:8px}.theme-page .tool-card.depth-card .tool-footer{height:36px;gap:8px}.theme-page .tool-card.depth-card .tool-open{height:36px;padding:9px 11px;font-size:9px;gap:10px}.depth-card-note{font-size:6px;letter-spacing:.04em}.depth-controls{margin:0 auto 20px;height:34px;gap:14px}.depth-selectors{width:calc(100% - 40px);gap:10px}.tool-selector{min-width:0;min-height:46px;font-size:10px;padding:13px 10px}.depth-workflow{padding:30px 0;margin-top:42px;gap:28px}.depth-workflow-copy h2{font-size:27px}.depth-workflow li>span{width:36px;height:36px}.depth-workflow li p{font-size:10px}.depth-workflow h3{font-size:12px}.theme-page .quick-access{padding:20px}.quick-links a{font-size:9px;padding:12px 9px}.theme-page .home-footer{font-size:8px;line-height:1.5}.object-a{left:-10px;top:27%;--object-size:24px;opacity:.35}.object-b,.object-d{display:none}.object-c{right:-12px;top:48%;opacity:.3}.scene-ring{width:35px;height:35px;border-width:5px}}
@media(prefers-reduced-motion:reduce){.reactive-scene .scene-cube,.reactive-scene .scene-ring,.reactive-scene .scene-sphere{animation:none}.reactive-scene .scene-cube{transform:rotateX(-20deg) rotateY(25deg) rotateZ(-10deg)}.reactive-scene .scene-ring{transform:rotateY(35deg) rotateX(25deg)}.theme-page :is(.primary-btn,.accent-btn,.platform-btn.primary):hover{transform:none}.reactive-scene{--scene-x:0px!important;--scene-y:0px!important}}
