:root{--paper:#f7f6f3;--ink:#151515;--muted:#77746f;--line:#e5e2dc;--glass:rgba(255,255,255,.9)}
body{background:var(--paper);color:var(--ink)}
.topbar{background:rgba(247,246,243,.9);border-bottom:1px solid var(--line);box-shadow:none;backdrop-filter:blur(18px)}
.version-chip{display:none!important}
.brand{letter-spacing:-.035em}
.feature-card,.side-card,.project-card,.production-card{border:1px solid rgba(20,20,20,.055);box-shadow:0 16px 48px rgba(30,25,20,.055);background:#fff}
.feature-card:hover,.project-card:hover{transform:translateY(-2px);box-shadow:0 22px 52px rgba(30,25,20,.09)}
button,.button-like,select,input,textarea{border-radius:12px}
button.primary,.button-like.primary{background:#171717;color:#fff}
.comparison-setup{grid-template-columns:repeat(3,minmax(0,1fr));align-items:end}
.comparison-environment-picker{grid-column:1/-1;border-top:1px solid var(--line);padding-top:18px}
.picker-heading{display:flex;justify-content:space-between;gap:20px;margin-bottom:12px}
.picker-heading span{color:var(--muted);font-size:13px}
.environment-check-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(155px,1fr));gap:8px;margin-bottom:12px}
.environment-check{display:flex!important;align-items:center;gap:9px;padding:10px 12px;border:1px solid var(--line);border-radius:13px;background:#faf9f7;cursor:pointer;font-weight:650}
.environment-check:has(input:checked){background:#171717;color:#fff;border-color:#171717}
.environment-check input{accent-color:#171717}
.comparison-timeline{display:flex;gap:8px;overflow:auto;padding:11px 3px 4px;scrollbar-width:thin}
.comparison-timeline button{white-space:nowrap;background:#fff;border:1px solid var(--line);color:#555}
.comparison-timeline button.active{background:#171717;color:#fff;border-color:#171717}
.comparison-stage,.media-stage{box-shadow:0 20px 60px rgba(0,0,0,.14)}
.comparison-stage.image-enter figure img,.presentation-stage.image-enter>img{animation:memoryReveal 1s cubic-bezier(.2,.75,.25,1) both}
.comparison-stage.image-enter figure:nth-child(2) img{animation-delay:70ms}
@keyframes memoryReveal{0%{opacity:0;transform:scale(1.035) translateX(12px);filter:blur(4px)}100%{opacity:1;transform:scale(1) translateX(0);filter:blur(0)}}
.camera-window,.comparison-camera{object-fit:cover;border:2px solid rgba(255,255,255,.85);box-shadow:0 12px 35px rgba(0,0,0,.28)}
.shape-rounded{border-radius:22px!important}.shape-rectangle{border-radius:3px!important}.shape-square{border-radius:14px!important;aspect-ratio:1/1}.shape-circle{border-radius:50%!important;aspect-ratio:1/1}.shape-vertical{border-radius:22px!important;aspect-ratio:9/16}
.fullscreen-drawing-tools{display:none;position:absolute;z-index:30;right:18px;top:18px;align-items:center;gap:5px;padding:7px;border-radius:16px;background:var(--glass);box-shadow:0 12px 36px rgba(0,0,0,.22);backdrop-filter:blur(14px);color:#111}
:fullscreen .fullscreen-drawing-tools{display:flex}
.fullscreen-drawing-tools button{min-width:36px;height:36px;padding:0 9px;border:0;background:transparent;color:#111;font-size:18px}
.fullscreen-drawing-tools button.selected{background:#171717;color:#fff}
.fullscreen-drawing-tools input[type=color]{width:32px;height:32px;padding:2px;border:0;background:transparent}
.fullscreen-drawing-tools input[type=range]{width:80px}
.fst-grip{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;padding:10px 7px;cursor:move;color:#777}
.import-hint{flex-basis:100%;color:var(--muted);font-size:12px}
:fullscreen{background:#080808!important}
:fullscreen .caption{bottom:22px}
@media(max-width:800px){.comparison-setup{grid-template-columns:1fr}.environment-check-grid{grid-template-columns:1fr 1fr}.fullscreen-drawing-tools{max-width:calc(100% - 16px);overflow:auto;right:8px;top:8px}.fullscreen-drawing-tools input[type=range],.fst-grip{display:none}}
@media(prefers-reduced-motion:reduce){.comparison-stage.image-enter figure img,.presentation-stage.image-enter>img{animation:none}}