:root {
  color-scheme: dark; --bg:#15100f; --panel:#211816; --line:#4c3730; --soft:#c7b6a7;
  --text:#f7ebdc; --accent:#edcb98; --copper:#d49b6b; --red:#ff9b91; --secondary-bg:#30231e;
  --display:Georgia, "Times New Roman", serif;
  font-family: "Segoe UI", system-ui, sans-serif;
}
#orientation-dialog {width:min(780px,calc(100% - 28px));max-height:90dvh;overflow:auto;padding:24px;color:var(--text);background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:0 20px 80px #0009}
#orientation-dialog::backdrop {background:#090605c9;backdrop-filter:blur(5px)}
#orientation-status {margin:14px 0;color:var(--soft);line-height:1.5}
#orientation-options {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
#orientation-options button {padding:0 0 12px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--text);overflow:hidden}
#orientation-options button:hover {border-color:var(--accent);background:#382820}
#orientation-options canvas {display:block;width:100%;height:auto;aspect-ratio:4/3}
#orientation-render {position:absolute;left:0;top:0;width:320px;height:240px;visibility:hidden;pointer-events:none}
.orientation-actions {display:flex;flex-wrap:wrap;justify-content:flex-end;gap:12px;margin-top:18px}
@media(max-width:480px) {#orientation-dialog {padding:16px} #orientation-options {gap:8px} #orientation-options button {font-size:12px}}
*,*::before,*::after {box-sizing:border-box}
body {margin:0;background:var(--bg);color:var(--text);min-height:100vh;display:flex;flex-direction:column;isolation:isolate}
body::before {content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 60% 0%,#42231a80,transparent 65%),linear-gradient(180deg,#160d0dc2,#150d0d87 48%,var(--bg)),url('/dragon-coils.webp') center top/cover no-repeat;background-blend-mode:normal,normal,luminosity;background-color:#2c1916}
.top {background:#15100fec;backdrop-filter:blur(12px)}
.studio-head,.shop section {text-shadow:0 2px 18px #130a08}
[hidden] {display:none!important}
main {flex:1}
a {color:inherit;text-decoration:none}
button,input,select {font:inherit}
select {appearance:none;width:100%;min-width:0;padding:7px 30px 7px 8px;border:1px solid #5c443a;border-radius:6px;background:#171211 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='m1 1 5 5 5-5' fill='none' stroke='%23edcb98' stroke-width='1.5'/%3E%3C/svg%3E") right 9px center/12px 8px no-repeat;color:var(--text);cursor:pointer}
select:hover {border-color:var(--copper)}
select:focus-visible {outline:none;border-color:var(--copper)}
select option {background:#171211;color:var(--text)}
button {cursor:pointer}
button:focus-visible,a:focus-visible,canvas:focus-visible {outline:2px solid var(--accent);outline-offset:3px}
.shell,.bar {width:min(1380px,calc(100% - 96px));margin-inline:auto}
.top {border-bottom:1px solid var(--line)}
.bar {min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand {white-space:nowrap;display:inline-flex;align-items:center;gap:11px;color:var(--accent)}
.wordmark {display:grid}
.wordmark strong {font:600 20px/.95 var(--display);letter-spacing:.13em;text-transform:uppercase}
nav {display:flex;gap:30px;color:var(--soft);font-size:14px}
nav a {padding-block:9px;border-bottom:1px solid transparent}
nav a:hover,nav [aria-current=page] {color:var(--accent)}
nav [aria-current=page] {border-color:var(--copper)}
.header-tools {display:flex;align-items:center;gap:14px}
.language button {font:11px Consolas,monospace;min-width:29px}
.eyebrow,.screen-caption,.screen-foot,.footer,.metrics span,.feature-list article>span {font:11px Consolas,monospace;letter-spacing:.11em;color:var(--soft)}
.eyebrow {display:flex;align-items:center;gap:9px;margin:0;color:var(--accent)}
.eyebrow>span:first-child {width:7px;height:7px;background:var(--accent);transform:rotate(45deg)}
h1,h2,p,figure {margin:0}
h1 {font:400 3rem/.99 var(--display);letter-spacing:-.055em}
.lead {color:var(--soft);font-size:17px;line-height:1.65;max-width:420px}
.button {display:inline-flex;align-items:center;justify-content:center;gap:20px;padding:11px 16px;border:1px solid #70514a;border-radius:4px;color:var(--text);background:#362524;font-weight:650;white-space:nowrap}
.button:hover {filter:brightness(1.15)}
.primary {background:linear-gradient(125deg,#f5d8ac,#cd925b);color:#261810;border:0;padding:14px 18px;text-shadow:none;box-shadow:0 5px 22px #160c09a0}
#home {padding-top:28px}
.viewport {position:relative;background:radial-gradient(ellipse at 53% 44%,#4a3025 0%,#2b1c18 53%,#191211 100%);border:1px solid var(--line);border-radius:6px;overflow:hidden}
.collection {margin-bottom:34px}
.collection-head {display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:18px}
.collection-head h2 {font:400 clamp(25px,2.5vw,32px)/1.15 var(--display);letter-spacing:-.035em}
.collection-controls {display:flex;align-items:center;gap:6px}
.collection-controls button {min-height:38px;min-width:40px;border:1px solid #79563f;border-radius:4px;background:#251b17;color:var(--accent);padding:7px 12px}
.collection-controls button:hover {background:#493022}
#collection-pause {display:grid;place-items:center}
#collection-pause svg {fill:currentColor}
.collection-cards {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;overflow:hidden}
.collection-card {min-width:0;border:1px solid #74513c;border-radius:6px;overflow:hidden;background:var(--panel)}
.collection-link {display:block;height:100%}
.collection-link:focus-visible {outline-offset:-3px}
.collection-card:has(a:hover),.collection-card:has(a:focus-visible) {border-color:var(--accent)}
.collection-action {display:block;margin-top:12px;font-size:12px;color:var(--accent)}
.collection-stage {position:relative;height:clamp(220px,23vw,310px);background:radial-gradient(ellipse at 50% 40%,#493126,#201614 78%)}
.collection-stage::before {content:"";position:absolute;inset:24px;background:url('/soulstaff.svg') center/contain no-repeat;opacity:.06;pointer-events:none}
.collection-stage canvas {position:relative;touch-action:pan-y}
.collection-number {position:absolute;z-index:1;top:14px;left:16px;font:11px Consolas,monospace;letter-spacing:.15em;color:var(--copper)}
.collection-error {position:absolute;inset:45% 16px auto;text-align:center;font-size:12px;line-height:1.5;color:var(--soft)}
.collection-caption {border-top:1px solid var(--line);padding:15px 18px 18px}
.collection-caption h3 {margin:0 0 7px;font:400 26px/1.1 var(--display);color:var(--accent)}
.collection-caption p {font-size:12px;line-height:1.5;color:var(--soft)}
.collection-foot {display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px}
.collection-dots {display:flex;gap:2px}
.collection-dots button {width:24px;height:28px;padding:0;border:0;background:transparent;display:grid;place-items:center}
.collection-dots button::before {content:"";width:5px;height:5px;border-radius:50%;background:#856b58;transition:background .2s,transform .2s}
.collection-dots button[aria-pressed=true]::before {background:var(--accent);transform:scale(1.6)}
#collection-position {font:11px Consolas,monospace;color:var(--soft);letter-spacing:.15em;white-space:nowrap;flex-shrink:0}
.screen-caption,.screen-foot {position:absolute;z-index:1;inset-inline:17px;display:flex;align-items:center;justify-content:space-between;gap:8px;pointer-events:none}
.screen-caption {top:16px}.screen-foot {bottom:14px}
.screen-caption span:last-child {color:var(--accent)}
canvas {display:block;width:100%;height:100%;touch-action:none}
#main-canvas {cursor:grab}#main-canvas:active {cursor:grabbing}
.screen-caption button {pointer-events:auto;border:0;padding:3px 0;color:var(--soft);background:none;font-size:11px}
.preview-tools {display:flex;align-items:center;flex-wrap:wrap;gap:10px}
.preview-download {margin-left:auto;padding:7px 12px;background:var(--secondary-bg);font-size:12px}
.preview-download:disabled {opacity:.45;cursor:default}
.mirror-toggle {display:flex;align-items:center;gap:9px;padding:9px;border:1px solid #70533f;border-radius:7px;background:#2c211b;cursor:pointer}
.mirror-toggle:has(input:checked) {border-color:var(--accent);background:#3d2b20}
.mirror-toggle input {accent-color:var(--accent);width:16px;height:16px;margin:0}
.mirror-badge {padding:3px 5px;border:1px solid #76563f;border-radius:4px;color:var(--accent);font:600 13px Consolas,monospace}
.mirror-toggle strong,.mirror-toggle small {display:block}
.mirror-toggle strong {color:var(--text);font-size:13px}
.mirror-toggle small {margin-top:2px;line-height:1.3}
#toggle-motion {padding:4px 6px;border:1px solid #866247;border-radius:4px;color:var(--accent);white-space:nowrap}
#toggle-motion[aria-pressed=true] {background:#412b20}
#toggle-motion:disabled {opacity:.35;cursor:default}
.screen-caption button:hover {color:var(--accent)}
.feature-list {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.feature-list article {padding:21px 24px 24px;border:1px solid var(--line);border-top-color:#8a6046;border-radius:4px;background:var(--panel)}
.feature-list article>span {color:var(--accent)}
.feature-list h2 {font:400 25px/1.1 var(--display);margin:9px 0 6px}
.feature-list p,.status p,.method {font-size:13px;line-height:1.45;color:var(--soft)}
.footer {display:flex;justify-content:space-between;margin-top:45px;padding:19px 0;border-top:1px solid var(--line);gap:8px}
.shop {display:grid;place-items:center;min-height:65vh;text-align:center}
.shop section {display:grid;justify-items:center;gap:25px;padding:60px 0}
.shop h1 {font-size:clamp(44px,7.4vw,96px);max-width:900px}
.studio-head {display:flex;align-items:end;justify-content:space-between;gap:18px;padding:35px 0 25px}
.studio-head h1 {font-size:clamp(30px,4vw,48px)}
.workspace {display:grid;grid-template-columns:minmax(210px,240px) minmax(0,1fr) minmax(290px,340px);grid-template-areas:"settings preview statistics" "summary summary summary";gap:19px;align-items:start}
.preview {grid-area:preview;display:grid;background:var(--panel);border:1px solid #74513c;border-radius:6px;overflow:hidden}
.design-summary {grid-area:summary;container-type:inline-size}
#layout-top {margin-top:10px}
.configuration-sidebar,.statistics-sidebar {display:grid;gap:12px;min-width:0}
.configuration-sidebar {grid-area:settings}
.statistics-sidebar {grid-area:statistics}
.config-panel>summary,.advanced-settings>summary {display:flex;align-items:center;justify-content:space-between;gap:8px;list-style:none;cursor:pointer;user-select:none}
.config-panel>summary::-webkit-details-marker,.advanced-settings>summary::-webkit-details-marker {display:none}
.config-panel>summary::after,.advanced-settings>summary::after {content:"";width:7px;height:7px;flex-shrink:0;border-right:1px solid var(--soft);border-bottom:1px solid var(--soft);transform:rotate(45deg)}
.config-panel[open]>summary::after,.advanced-settings[open]>summary::after {transform:rotate(225deg)}
.controls.config-panel>summary h2 {margin:0}
.config-panel>summary:hover h2 {color:var(--accent)}
.config-panel>summary:focus-visible,.advanced-settings>summary:focus-visible {outline:2px solid var(--accent);outline-offset:5px}
.config-content {padding-top:14px}
.model-measurements {display:grid;gap:14px}
.model-measurements .stat-info p {top:28px;bottom:auto;margin:0}
.model-measurements .stat-info>summary:focus-visible {outline:2px solid var(--accent);outline-offset:2px}
.advanced-settings>summary {padding-top:10px;border-top:1px solid var(--line);color:var(--soft);font-size:12px}
.upload-actions {display:grid;gap:8px}
.upload-actions .button {font-size:13px;background:var(--secondary-bg)}
#upload-dialog {width:min(540px,calc(100% - 28px));max-height:90dvh;overflow:auto;padding:24px;color:var(--text);background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:0 20px 80px #0009}
#upload-dialog::backdrop {background:#090605c9;backdrop-filter:blur(5px)}
.upload-dialog-heading {display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px}
.upload-dialog-heading h2 {font-size:22px;margin:0}
.dialog-close {display:grid;place-items:center;flex-shrink:0;width:32px;height:32px;padding:0;border:1px solid var(--line);border-radius:6px;background:var(--secondary-bg);color:var(--soft);font-size:23px;line-height:1}
.dialog-close:hover {color:var(--accent);border-color:var(--copper)}
#upload-kind,#upload-kind option {background-color:var(--secondary-bg)}
.upload-description {margin:18px 0 10px;font-size:14px;line-height:1.5}
.upload-requirements {padding:12px;border:1px solid var(--line);border-radius:6px;color:var(--soft);font-size:12px;line-height:1.6}
.upload-dropzone {position:relative;display:grid;justify-items:center;align-content:center;gap:12px;min-height:140px;margin:16px 0;padding:20px;border:1px dashed var(--copper);border-radius:8px;background:var(--secondary-bg);cursor:pointer}
.upload-dropzone strong {padding:8px 12px;border:1px solid var(--copper);border-radius:5px;color:var(--accent);font-size:13px}
.upload-dropzone:hover,.upload-dropzone.dragging {border-color:var(--accent);background:#3d2b20}
.upload-dropzone:focus-within {outline:2px solid var(--accent);outline-offset:3px}
.upload-dropzone input {position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.spike-options {padding-top:8px}
.controls {padding:15px 16px;background:var(--panel);border:1px solid var(--line);border-radius:6px}
.controls .statistics-heading {flex-wrap:wrap;gap:5px 8px}
.statistics-heading small {font-size:11px;font-weight:400;color:var(--soft)}
.part-stats {margin:8px 0 0}
.part-stats>div {padding:10px 0;border-bottom:1px solid var(--line)}
.part-stats>div:last-child {border:0;padding-bottom:0}
.part-stats dt {font-size:12px;color:var(--soft)}
.hold-calculation {display:block;margin-top:8px;color:var(--accent)}
.part-stats dd {margin:4px 0 0;font-size:19px;font-weight:600;font-variant-numeric:tabular-nums}
.part-stats small {display:block;margin-top:4px;font-size:10px;line-height:1.4;font-weight:400;color:var(--soft)}
.info-label {position:relative;display:flex;align-items:center;gap:8px}
.stat-info>summary {display:grid;place-items:center;list-style:none;width:22px;height:22px;font-size:13px;line-height:1;cursor:pointer}
.stat-info>summary::-webkit-details-marker {display:none}
.stat-info svg {display:block}
.stat-info[open]>summary {color:var(--accent);border-color:var(--accent)}
.stat-info p {position:absolute;z-index:10;left:0;right:0;bottom:30px;padding:12px;background:#211816;border:1px solid var(--copper);border-radius:6px;box-shadow:0 8px 24px #0008;color:var(--text);font-size:12px;line-height:1.5}
.controls h2 {font-size:15px;letter-spacing:-.016em;margin-bottom:13px;display:flex;align-items:center;gap:10px}
.shots figcaption>span:first-child {font:11px Consolas,monospace;color:var(--accent);border:1px solid #70533f;border-radius:4px;padding:3px 5px}
.two {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.paired {margin-top:9px}
label {display:grid;gap:6px;font-size:12px;color:var(--soft)}
.number-field {display:grid;gap:6px}
.field {position:relative;display:flex;align-items:center;gap:2px;background:#171211;color:var(--soft);border:1px solid #5c443a;border-radius:6px;padding:0 8px 5px;min-height:41px}
.field:focus-within {border-color:var(--accent)}
.field span {white-space:nowrap;font:11px Consolas,monospace}
.field input[type=number] {width:100%;min-width:0;padding:7px 0;background:none;color:var(--text);border:0;outline:0;font-size:14px;font-variant-numeric:tabular-nums}
.model-measurements .field {background:var(--secondary-bg);padding-bottom:0}
.model-measurements input[type=number] {text-align:center;appearance:textfield;-moz-appearance:textfield}
.model-measurements input[type=number]::-webkit-inner-spin-button,.model-measurements input[type=number]::-webkit-outer-spin-button {appearance:none;margin:0}
.field input:disabled {opacity:.6}
.field input[type=range] {appearance:none;position:absolute;inset:auto 0 -1px;width:100%;height:10px;margin:0;padding:0;background:none;cursor:ew-resize;outline:0}
.field input[type=range]::-webkit-slider-runnable-track {height:2px;border-radius:2px;background:linear-gradient(to right,var(--accent) var(--progress),#70533f var(--progress));transform:translateY(4px)}
.field input[type=range]::-webkit-slider-thumb {appearance:none;width:9px;height:9px;border:1px solid #2b1d17;border-radius:50%;background:var(--accent);margin-top:-3.5px}
.field input[type=range]::-moz-range-track {height:2px;border-radius:2px;background:#70533f}
.field input[type=range]::-moz-range-progress {height:2px;background:var(--accent)}
.field input[type=range]::-moz-range-thumb {width:7px;height:7px;border:1px solid #2b1d17;border-radius:50%;background:var(--accent)}
.field input[type=range]:disabled {cursor:default;opacity:.36}
.switch {display:flex;align-items:center;margin-top:10px}
.switch input {accent-color:var(--accent);margin:0}
.hint {font-size:11px;line-height:1.4;color:var(--soft);margin-top:8px}
.segments {display:flex;gap:4px}
.segments button {flex:1;padding:6px 7px;background:var(--secondary-bg);border:1px solid #60483c;border-radius:5px;color:var(--text);font-size:12px;white-space:nowrap}
.segments button[aria-pressed=true] {color:var(--accent);border-color:var(--copper);background:#492d20}
.segments button:hover {border-color:var(--accent)}
.segments button:disabled {opacity:.45;cursor:default;border-color:#60483c}
.presets {margin-bottom:10px}
.stl-row {position:relative;display:flex;align-items:center;flex-wrap:wrap;gap:5px 8px;margin-bottom:10px}
.info-button {width:23px;height:23px;padding:0;border:1px solid #866247;border-radius:50%;background:#32231b;color:var(--accent);font:700 13px Georgia,serif}
.stl-tooltip {position:absolute;z-index:5;top:calc(100% + 6px);left:0;right:0;display:grid;gap:7px;padding:10px 12px;background:#35251f;border:1px solid #866247;border-radius:7px;box-shadow:0 8px 24px #0008;color:var(--soft);font-size:12px;line-height:1.45}
.stl-tooltip strong {color:var(--accent)}
.upload-button {position:relative;cursor:pointer;display:inline-flex;align-items:center;color:var(--accent);background:#37271e;border:1px solid #866247;border-radius:5px;padding:7px 9px;font-weight:650}
.upload-button input {position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.upload-button:focus-within {outline:2px solid var(--accent);outline-offset:3px}
.text-button {border:0;background:none;color:var(--soft);padding:3px 0;font-size:11px;text-decoration:underline;text-underline-offset:3px}
.stl-name {overflow-wrap:anywhere;font-weight:650;margin:-3px 0 8px}
.style-options {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.style-control {display:grid;gap:6px;color:var(--soft);font-size:12px}
.style-control button {padding-inline:4px}
#finish-label + .segments {flex-wrap:wrap}
.mesh-colors button::before {content:"";display:inline-block;width:8px;height:8px;margin-right:4px;border:1px solid #8b7666;border-radius:50%;background:#f7ebdc}
.mesh-colors button[data-mesh-color=black]::before {background:#15100f}
input[type=color] {display:block;width:100%;height:29px;padding:2px 4px;border:1px solid #60483c;border-radius:5px;background:#30231e;cursor:pointer}
input[type=color]::-webkit-color-swatch-wrapper {padding:0}
input[type=color]::-webkit-color-swatch {border:0;border-radius:2px}
input[type=color]::-moz-color-swatch {border:0;border-radius:2px}
.variation {display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:11px}
.variation .switch {margin-top:0}
.variation button:disabled {opacity:.45;cursor:default}
.stl-error {padding:0;margin:0 0 8px}
.pocket-warning {color:var(--red)}
.presets small {display:block;margin-top:2px;color:var(--soft);font-size:10px}
.viewport {min-height:clamp(335px,39vw,510px);display:grid;grid-template-rows:auto minmax(130px,1fr) auto;container-type:inline-size;border:0;border-radius:0}
.model-stage {position:relative;margin:0 8px;overflow:hidden;border-radius:10px;mask-image:linear-gradient(to bottom,transparent 0%,#0008 5%,#000 12%,#000 78%,#0008 91%,transparent 100%)}
.model-stage canvas {position:absolute;inset:0}
.viewport>.screen-caption {position:relative;inset:auto;margin:16px 155px 0 17px;justify-content:flex-start;z-index:4}
.preview-styling,.preview-magnets {position:absolute;z-index:4;top:16px;right:17px;display:grid;gap:6px;width:122px;font-size:11px;color:var(--soft)}
.preview-styling h2 {margin:0;font-size:11px;font-weight:400}
.preview-styling .style-options {gap:6px}
.preview-styling label,.preview-styling .style-control {gap:3px;font-size:11px}
.preview-styling .style-control {grid-column:1/-1}
.preview-styling input[type=color] {height:23px}
.preview-styling .segments {display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
.preview-styling .segments button {padding:4px 2px;min-height:25px;font-size:11px}
.preview-styling .mesh-colors button::before {margin-right:3px;width:7px;height:7px}
.viewport:has(.preview-magnets:not([hidden])) {min-height:450px}
.preview-magnets label {gap:3px;font-size:11px}
.preview-magnets select {padding:5px 26px 5px 4px;background-color:var(--secondary-bg);background-position:right 6px center}
.preview-magnets option {background-color:var(--secondary-bg)}
.preview-magnets .extras {display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
.preview-magnets button {padding:5px 3px;min-height:27px;font-size:11px}
.preview-magnets button:first-child {grid-column:1/-1}
@container (max-width:500px) {
  .viewport .preview-tools {flex-direction:column;align-items:flex-start;gap:3px}
}
@container (max-width:400px) {
  .viewport .status {top:78px}
  .preview-styling,.preview-magnets {right:12px;width:115px}
}
.viewport-foot {position:relative;inset:auto;margin:0 17px 14px;z-index:4}
.viewport-foot {flex-wrap:wrap}
.preview-options {display:flex;align-items:center;justify-content:space-between;gap:8px 12px;flex-wrap:wrap;width:100%;padding:6px 8px;border:1px solid var(--line);border-radius:7px;background:#201715;pointer-events:auto}
.surface-control {display:flex;align-items:center;gap:8px;font-size:12px;letter-spacing:0}
.surface-buttons {flex-wrap:wrap}
.surface-buttons button::after {content:"";display:inline-block;width:9px;height:9px;margin-left:5px}
.surface-buttons button[data-ready=true]::after {content:"✓";color:var(--accent);font-size:10px}
.surface-buttons button[aria-busy=true]::after {border:1px solid #edcb9840;border-top-color:var(--accent);border-radius:50%;animation:progress-spin .8s linear infinite}
.preview-progress {position:absolute;z-index:7;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:16px;border-radius:inherit;background:#160f0ee8;color:var(--accent);text-align:center;font-size:13px;pointer-events:none}
.operation-progress {display:grid;gap:8px;margin:10px 0;font-size:12px;line-height:1.5;color:var(--accent)}
progress {appearance:none;display:block;width:100%;height:4px;border:0;border-radius:2px;overflow:hidden;background:#614636;accent-color:var(--accent)}
progress::-webkit-progress-bar {background:#614636}
progress::-webkit-progress-value {background:var(--accent)}
progress::-moz-progress-bar {background:var(--accent)}
progress:indeterminate {background:linear-gradient(90deg,#614636 25%,var(--accent) 50%,#614636 75%) 0 0/200% 100%;animation:progress-slide 1.4s linear infinite}
progress:indeterminate::-webkit-progress-bar {background:transparent}
.preview-progress progress {max-width:210px}
@keyframes progress-slide {to {background-position:-200% 0}}
@keyframes progress-spin {to {transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce) {progress:indeterminate,.surface-buttons button[aria-busy=true]::after {animation:none}}
.surface-buttons button {min-height:30px;padding-inline:9px}
.view-tools {display:flex;align-items:center;justify-content:flex-start;gap:8px 12px;flex-wrap:wrap;width:100%}
.view-tools .view-modes {flex-shrink:0}
#preview-caption {flex:0 1 auto;min-width:0;max-width:460px;text-align:left;letter-spacing:0;line-height:1.4}
@container (max-width:610px) {
  #preview-caption {font-size:10px;max-width:100%}
}
@media (max-width:440px) {
  .viewport {min-height:385px}
}
@container (max-width:380px) {
  .surface-control {flex-direction:column;align-items:flex-start;width:100%}
  .surface-buttons {width:100%}
}
.view-modes {pointer-events:auto}
.view-modes button {background:#201715}
.status {position:absolute;z-index:5;top:49px;left:18px;right:155px;display:flex;align-items:flex-start;gap:8px 12px;flex-wrap:wrap;color:var(--red);pointer-events:none;text-shadow:0 1px 5px #180f0e,0 0 12px #180f0e}
.status strong {font-size:14px;color:var(--red)}
.status p {margin:3px 0 0;color:var(--red);font-size:12px}
.status .button {pointer-events:auto;padding:5px 9px;min-height:30px;font-size:12px;color:var(--red);background:#211715e8;border-color:#ff9b9166}
.status.bad strong,.input-error,.render-error {color:var(--red)}
.input-error {font-size:12px}
#input-error {margin-top:8px}
.render-error {position:absolute;inset:45% 18px auto;text-align:center;font-size:14px}
.metrics {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid var(--line);border-radius:8px;background:#1d1513;color:var(--soft);text-align:center}
.metrics>div {display:flex;flex-direction:column;gap:3px;padding:10px 12px;border-right:1px solid var(--line)}
.metrics>div:last-child {border-right:0}
.metrics strong {font-size:21px;font-variant-numeric:tabular-nums}
.metrics small {font-size:13px;white-space:nowrap;color:var(--soft)}
.metric-price small {white-space:normal}
.metrics>.shipping-metric {position:relative;align-items:center;gap:6px}
.shipping-metric select {width:100%;max-width:240px;min-height:30px;padding:4px 24px 4px 8px;border-color:transparent;background-color:transparent;font-size:14px;text-align:center;text-align-last:center}
#shipping-city-picker {width:100%;font-size:14px}
#shipping-city-name {cursor:pointer;overflow-wrap:anywhere}
.shipping-city-search {position:absolute;top:90px;left:50%;z-index:10;display:grid;gap:9px;width:min(360px,calc(100vw - 48px));padding:14px;border:1px solid var(--line);border-radius:7px;background:var(--panel);box-shadow:0 8px 28px #0008;transform:translateX(-50%);text-align:left}
.shipping-search-fields {display:flex;align-items:center;gap:8px}
.shipping-search-fields input {width:100%;min-width:0;min-height:36px;padding:8px;border:1px solid var(--line);border-radius:5px;background:#171211;color:var(--text);font-size:13px}
.shipping-search-fields .button {min-height:36px;padding:8px;font-size:12px}
.shipping-cities {display:grid;gap:5px}
.shipping-cities button {padding:9px 12px;border:1px solid var(--line);border-radius:5px;background:var(--secondary-bg);color:var(--text);text-align:left}
.shipping-cities button:hover {border-color:var(--accent)}
.shipping-metric .hint {margin:0;line-height:1.5;font-size:12px}
.shipping-metric a {text-decoration:underline;text-underline-offset:2px}
.shipping-metric small {white-space:normal;line-height:1.4}
#shipping-estimate {font-size:12px;line-height:1.5}
#shipping-estimate summary {cursor:pointer}
#shipping-retry {font-size:12px;padding:4px}
.metrics>.metric-price {justify-content:center}
.price-equation {display:flex;align-items:baseline;justify-content:center;flex-wrap:wrap;gap:4px 6px;font-variant-numeric:tabular-nums}
.metrics .price-equation span {font:inherit;font-size:15px;letter-spacing:0;color:var(--soft)}
.metrics .price-equation strong {font-size:20px;white-space:normal}
@container (max-width:610px) {
  .metrics>div {padding:10px 6px}
  .metrics span {font-size:9px;letter-spacing:.04em;min-height:2.4em}
  .metrics small {font-size:11px}
  .metrics .price-equation span {font-size:12px;min-height:0}
  .metrics .price-equation strong {font-size:16px}
}
.method {font-size:11px;margin-top:7px}
.gallery {margin-top:33px}
.gallery-head {margin-bottom:14px;display:flex;align-items:end;justify-content:space-between;gap:12px}
.shots {display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.shots figure {background:#261b17;border:1px solid var(--line);border-radius:9px;overflow:hidden}
.shots canvas {height:auto;aspect-ratio:1.8}
.shots figcaption {display:flex;align-items:center;gap:8px;padding:9px 11px;border-top:1px solid var(--line);font-size:13px}
@media(max-width:1100px) {
  .workspace {grid-template-columns:repeat(2,minmax(0,1fr));grid-template-areas:"settings statistics" "preview preview" "summary summary"}
}
@media(max-width:950px) {
  .shell,.bar {width:calc(100% - 40px)}
}
@media(max-width:710px) {
  .bar {min-height:64px;gap:9px}nav {gap:12px;font-size:13px}
  .workspace {grid-template-columns:minmax(0,1fr)}
  .workspace {grid-template-areas:"settings" "preview" "statistics" "summary"}
  #home {padding-top:24px}
  .collection-head {align-items:center;gap:12px}
  .collection-head h2 {font-size:22px}
  .collection-controls button {min-width:32px;padding-inline:8px}
  .collection-dots {gap:0}
  .collection-cards {grid-template-columns:minmax(0,1fr)}
  .collection-stage {height:290px}
  .studio-head {align-items:start;flex-direction:column;gap:10px}
  .workspace {gap:14px}.shots {grid-template-columns:1fr}.shots canvas {max-height:280px}
  .feature-list {grid-template-columns:1fr;gap:8px}
  .feature-list article {padding:13px 16px}.feature-list h2 {font-size:21px}
  .footer {font-size:9px}
}
@media(max-width:540px) {
  .bar {display:grid;grid-template-columns:1fr auto;gap:4px 12px;padding-top:12px}
  .bar nav {grid-column:1/-1;grid-row:2;gap:20px}
  .brand img {width:34px;height:34px}
  .wordmark strong {font-size:17px}
}
@media(max-width:360px) {
  .shell,.bar {width:calc(100% - 26px)}
  .status {align-items:flex-start;flex-direction:column}
  .metrics span {font-size:9px}
}