:root {
  --ink: #4b3028;
  --muted: #806b60;
  --line: rgba(111, 71, 51, .2);
  --paper: #fff8ec;
  --pink: #d9879e;
  --pink-deep: #a94f6f;
  --mint: #a9cfa9;
  --mint-deep: #598765;
  --warn: #c85942;
  --cute: "YouYuan", "幼圆", "Microsoft YaHei UI", "PingFang SC", sans-serif;
  --pixel: "Courier New", Consolas, monospace;
}

* { box-sizing: border-box; }
html { background: #f7ead8; color-scheme: light; }
body {
  min-width: 320px;
  margin: 0;
  color: var(--ink);
  background:
    linear-gradient(rgba(250, 237, 218, .82), rgba(248, 229, 209, .88)),
    radial-gradient(circle, rgba(190, 112, 130, .12) 0 2px, transparent 2.5px);
  background-size: auto, 31px 31px;
  font: 14px/1.45 var(--cute);
}

button, input, select { font: inherit; }
button, a, label { -webkit-tap-highlight-color: transparent; }
button:focus-visible, input:focus-visible, select:focus-visible, label:focus-visible {
  outline: 2px solid #c46f8a;
  outline-offset: 2px;
}

.scoop-header {
  position: sticky;
  z-index: 20;
  top: 0;
  min-height: 68px;
  padding: 10px 4vw;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  border-bottom: 1px solid var(--line);
  background: rgba(255, 249, 237, .93);
  backdrop-filter: blur(12px);
}
.scoop-brand { display: inline-flex; align-items: center; gap: 10px; color: inherit; text-decoration: none; }
.brand-mark { display: grid; width: 40px; height: 40px; place-items: center; border: 2px solid #78472f; background: #efc5cc; box-shadow: 3px 3px 0 rgba(91, 51, 32, .13); }
.brand-mark canvas { width: 36px; height: 36px; image-rendering: pixelated; }
.scoop-brand strong, .scoop-brand small { display: block; }
.scoop-brand strong { font-size: 14px; font-weight: 900; letter-spacing: .08em; }
.scoop-brand small { margin-top: 2px; color: var(--muted); font: 700 7px/1 var(--pixel); letter-spacing: .08em; }
.local-note { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: 9px; font-weight: 800; }
.local-note i { width: 6px; height: 6px; background: var(--mint-deep); box-shadow: 0 0 0 4px rgba(89, 135, 101, .12); }
.back-link { justify-self: end; color: var(--ink); font-size: 10px; font-weight: 900; text-decoration: none; }

.scoop-hero {
  width: min(1240px, calc(100% - 40px));
  margin: 26px auto 18px;
  padding: 34px 34px 28px;
  display: grid;
  grid-template-columns: 1fr .65fr;
  align-items: end;
  gap: 50px;
  border: 1px solid var(--line);
  border-top: 9px solid transparent;
  border-image: repeating-linear-gradient(90deg, #6d412d 0 28px, #d89a6c 28px 56px) 9;
  background: linear-gradient(rgba(255, 249, 237, .9), rgba(255, 239, 232, .92));
  box-shadow: 5px 6px 0 rgba(102, 61, 39, .08);
}
.scoop-hero p { margin: 0 0 12px; color: var(--pink-deep); font: 800 8px/1 var(--pixel); letter-spacing: .13em; }
.scoop-hero h1 { margin: 0; font-size: clamp(32px, 4vw, 56px); font-weight: 900; line-height: 1.12; letter-spacing: -.04em; }
.hero-note { padding-left: 22px; border-left: 1px solid var(--line); }
.hero-note b, .hero-note span { display: block; }
.hero-note b { margin-bottom: 8px; color: var(--pink-deep); font-size: 13px; }
.hero-note span { color: var(--muted); font-size: 11px; line-height: 1.8; }

.scoop-workbench {
  width: min(1480px, calc(100% - 40px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(286px, 320px) minmax(540px, 1fr) minmax(235px, 270px);
  gap: 12px;
  align-items: start;
}
.scoop-controls, .scoop-stage, .scoop-result {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgba(255, 249, 237, .96);
  box-shadow: 5px 6px 0 rgba(100, 59, 38, .08);
}
.scoop-controls { padding: 18px 16px 24px; }
.section-heading { margin: 4px 0 13px; display: flex; align-items: flex-start; gap: 10px; }
.section-heading:not(:first-child) { margin-top: 24px; padding-top: 19px; border-top: 1px solid var(--line); }
.section-heading > span { display: grid; width: 24px; height: 24px; flex: 0 0 24px; place-items: center; border: 1px solid #ba7652; background: #f4cca1; font: 800 8px/1 var(--pixel); }
.section-heading b, .section-heading small { display: block; }
.section-heading b { font-size: 14px; font-weight: 900; }
.section-heading small { margin-top: 3px; color: var(--muted); font-size: 8px; }

.scoop-drop {
  min-height: 122px;
  padding: 20px 12px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border: 1px dashed #c58e6a;
  border-radius: 7px;
  background: linear-gradient(rgba(255, 250, 239, .92), rgba(255, 244, 237, .92)), repeating-linear-gradient(45deg, #f5dfca 0 7px, #fff5e5 7px 14px);
  cursor: pointer;
}
.scoop-drop input, .cutout-sources input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.scoop-drop > span { display: grid; width: 32px; height: 32px; margin-bottom: 8px; place-items: center; border: 1px solid #a56b4d; background: #f2c995; font: 900 16px/1 var(--pixel); }
.scoop-drop b { font-size: 11px; }
.scoop-drop small { margin-top: 5px; color: var(--muted); font-size: 8px; }
.scoop-drop.is-dragging { border-color: var(--pink-deep); box-shadow: 0 0 0 4px rgba(217, 135, 158, .15); }
.sample-button { width: 100%; margin-top: 8px; padding: 10px 11px; display: flex; justify-content: space-between; border: 1px solid var(--line); border-radius: 5px; background: #fffaf0; color: var(--ink); font-size: 9px; font-weight: 900; cursor: pointer; }
.element-panel { margin: 10px 0 4px; padding: 10px; border: 1px solid #bd7188; border-radius: 7px; background: #fff8f4; box-shadow: 0 6px 18px rgba(96,52,61,.08); }
.element-panel-heading { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.element-panel-heading span, .element-panel-heading b, .element-panel-heading small { display: block; }
.element-panel-heading b { font-size: 9px; }
.element-panel-heading small { margin-top: 3px; color: var(--muted); font-size: 7px; }
.element-panel-heading button { padding: 5px 7px; border: 1px solid #d2acb8; border-radius: 4px; background: #fff; color: #8d4b63; font-size: 7px; font-weight: 900; cursor: pointer; }
#scoopElementCanvas { width: 100%; max-height: 188px; margin-top: 8px; display: block; border: 1px solid #d7c2aa; border-radius: 5px; background: #fff; cursor: pointer; object-fit: contain; }
.element-panel > p { margin: 7px 1px; color: var(--muted); font-size: 7px; line-height: 1.55; }
.element-actions { display: grid; grid-template-columns: repeat(3, 1fr); gap: 5px; }
.element-actions button { min-height: 32px; padding: 5px; border: 1px solid #d0af99; border-radius: 4px; background: #fffaf2; color: #725642; font-size: 7px; font-weight: 900; cursor: pointer; }
.element-actions button:last-child { border-color: #a95875; background: #f4c8d5; color: #75364e; }

.field-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.field-grid label { color: var(--muted); font-size: 8px; font-weight: 800; }
.field-grid select { width: 100%; min-height: 39px; margin-top: 5px; padding: 8px; border: 1px solid #d3b99c; border-radius: 5px; background: #fffaf2; color: var(--ink); font-size: 9px; font-weight: 900; }
.edit-sliders { margin-top: 10px; padding: 10px; display: grid; gap: 9px; border: 1px solid #d3b99c; border-radius: 6px; background: #fffaf2; }
.edit-sliders label { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 5px; color: var(--muted); font-size: 8px; font-weight: 800; }
.edit-sliders output { color: var(--pink-deep); font: 800 8px/1 var(--pixel); }
.edit-sliders input { grid-column: 1 / -1; width: 100%; accent-color: var(--pink-deep); }
.edit-sliders.compact { margin-top: 8px; background: rgba(255,255,255,.55); }
.transform-buttons { margin-top: 8px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 5px; }
.transform-buttons button { min-height: 31px; padding: 5px; border: 1px solid #d1b79e; border-radius: 4px; background: #fffaf2; color: #725642; font-size: 8px; font-weight: 900; cursor: pointer; }
.transform-buttons button[aria-pressed="true"] { border-color: #a95875; background: #f5d7df; color: #8c3f5c; }

.mode-switch { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.mode-switch label { cursor: pointer; }
.mode-switch input { position: absolute; opacity: 0; }
.mode-switch span { min-height: 59px; padding: 10px; display: flex; flex-direction: column; justify-content: center; border: 1px solid #d2b79f; border-radius: 6px; background: #fffaf2; }
.mode-switch input:checked + span { border-color: #a95875; background: #f8dce1; box-shadow: inset 0 0 0 1px #c97291; }
.mode-switch b, .mode-switch small { display: block; }
.mode-switch b { font-size: 10px; }
.mode-switch small { margin-top: 4px; color: var(--muted); font-size: 7px; }
.thickness-card { margin-top: 9px; padding: 12px; border: 1px solid #d3b99c; border-radius: 7px; background: linear-gradient(145deg, #fffaf2, #f7eadb); transition: opacity .2s; }
.thickness-card.is-disabled { opacity: .48; }
.thickness-card > div:first-child { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.thickness-card label { font-size: 9px; font-weight: 900; }
.thickness-card output { padding: 5px 8px; border-radius: 10px; background: #f0ddd0; color: var(--pink-deep); font: 900 9px/1 var(--pixel); }
#scoopThickness { width: 100%; margin: 12px 0 9px; accent-color: var(--pink-deep); }
.thickness-presets { display: grid; grid-template-columns: repeat(4, 1fr); gap: 5px; }
.thickness-presets button { min-height: 30px; border: 1px solid #d6bea6; border-radius: 4px; background: #fffaf2; color: #725642; font: 800 8px/1 var(--pixel); cursor: pointer; }
.thickness-presets button.is-active { border-color: #b06d78; background: #f8dce1; color: #824858; }
.base-color { min-height: 55px; margin-top: 9px; padding: 9px 10px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border: 1px solid #d3b99c; border-radius: 5px; background: #fffaf2; }
.base-color label, .base-color b, .base-color small { display: block; }
.base-color label { cursor: pointer; }
.base-color b { font-size: 9px; }
.base-color small { margin-top: 3px; color: var(--muted); font-size: 7px; }
.base-color-actions { display: flex; align-items: center; gap: 6px; }
.base-color-actions button { min-height: 32px; padding: 5px 7px; border: 1px solid #c8a78b; border-radius: 4px; background: #f7e7d8; color: #76543e; font-size: 7px; font-weight: 900; cursor: pointer; }
.base-color input { width: 44px; height: 34px; padding: 2px; border: 1px solid #b99a7d; border-radius: 4px; background: white; cursor: pointer; }
.body-color-preview { display: grid; grid-template-columns: 22px auto; align-items: center; gap: 4px; color: var(--muted); font-size: 7px; font-weight: 900; }
.body-color-preview i { grid-row: 1; width: 22px; height: 22px; border: 2px solid #fff; border-radius: 50%; background: #d4a174; box-shadow: 0 0 0 1px #b99a7d; }
.body-color-preview small { margin: 0; }
.palette-card { margin-top: 9px; padding: 10px; border: 1px solid #d7c2aa; border-radius: 6px; background: #fffaf2; }
.palette-heading { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.palette-heading span { color: var(--muted); font-size: 8px; font-weight: 800; }
.palette-heading b { color: var(--pink-deep); font: 800 7px/1 var(--pixel); white-space: nowrap; }
#scoopPalette { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
#scoopPalette i { width: 25px; height: 25px; border: 2px solid #fff; border-radius: 5px; background: #e8ded4; box-shadow: 0 0 0 1px #baa08a; }
#scoopPalette button { position: relative; width: 29px; height: 29px; padding: 0; border: 3px solid #fff; border-radius: 6px; box-shadow: 0 0 0 1px #baa08a; cursor: pointer; }
#scoopPalette button[aria-pressed="true"] { box-shadow: 0 0 0 2px #9f4968, 0 3px 8px rgba(84, 48, 36, .2); transform: translateY(-1px); }
#scoopPalette button[aria-pressed="true"]::after { content: "✓"; position: absolute; right: -4px; bottom: -5px; width: 13px; height: 13px; display: grid; place-items: center; border-radius: 50%; background: #9f4968; color: #fff; font: 900 8px/1 Arial, sans-serif; }
#scoopPalette button[aria-pressed="false"] { opacity: .46; filter: saturate(.65); }

.cutout-toggle { min-height: 52px; padding: 10px; display: flex; align-items: center; gap: 10px; border: 1px solid #d3b99c; border-radius: 6px; background: #fffaf2; cursor: pointer; }
.cutout-toggle input { width: 17px; height: 17px; accent-color: var(--pink-deep); }
.cutout-toggle b, .cutout-toggle small { display: block; }
.cutout-toggle b { font-size: 10px; }
.cutout-toggle small { margin-top: 3px; color: var(--muted); font-size: 7px; }
.cutout-panel { margin-top: 8px; padding: 9px; border: 1px solid #d3b99c; border-radius: 6px; background: #f8ecdd; transition: opacity .2s; }
.cutout-panel.is-disabled { opacity: .46; }
.cutout-sources { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.cutout-sources button, .cutout-sources label { min-height: 62px; padding: 7px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; border: 1px solid #cfae92; border-radius: 5px; background: #fffaf2; color: var(--ink); font-size: 8px; font-weight: 900; cursor: pointer; }
.cutout-sources i { color: var(--pink-deep); font: normal 900 20px/1 var(--cute); }
.cutout-panel > p { margin: 8px 2px 0; color: var(--muted); font-size: 7px; line-height: 1.5; }

.printability-card { margin-top: 16px; padding: 11px; border: 1px solid #9fc2a7; border-radius: 7px; background: #edf6e8; }
.printability-card.is-warning { border-color: #d98973; background: #fff0e4; }
.printability-card > div { display: flex; justify-content: space-between; gap: 10px; }
.printability-card b { color: #477257; font-size: 9px; }
.printability-card.is-warning b, .printability-card.is-warning span { color: var(--warn); }
.printability-card span { color: #477257; font: 800 8px/1 var(--pixel); }
.printability-card p { margin: 6px 0 8px; color: #617263; font-size: 8px; line-height: 1.55; }
.printability-card button { padding: 0; border: 0; background: transparent; color: #477257; font-size: 8px; font-weight: 900; cursor: pointer; }
.geometry-note { margin-top: 9px; padding: 11px; border: 1px solid #9fc2a7; border-radius: 7px; background: #edf6e8; }
.geometry-note b { color: #477257; font-size: 9px; }
.geometry-note p { margin: 5px 0 0; color: #617263; font-size: 8px; line-height: 1.6; }

.scoop-stage { position: sticky; top: 80px; height: calc(100vh - 96px); min-height: 700px; display: flex; flex-direction: column; }
.stage-toolbar { min-height: 62px; padding: 10px 14px; display: flex; align-items: center; justify-content: space-between; gap: 15px; border-bottom: 1px solid var(--line); background: rgba(255, 251, 243, .97); }
.stage-toolbar b, .stage-toolbar small { display: block; }
.stage-toolbar b { font-size: 11px; }
.stage-toolbar small { margin-top: 3px; color: var(--muted); font-size: 8px; }
.view-tabs { display: flex; padding: 3px; border: 1px solid #d4bca5; border-radius: 6px; background: #f5e7d7; }
.view-tabs button { min-height: 28px; padding: 4px 8px; border: 0; border-radius: 4px; background: transparent; color: var(--muted); font-size: 8px; font-weight: 900; cursor: pointer; }
.view-tabs button.is-active { background: #fffaf1; color: var(--pink-deep); box-shadow: 0 1px 4px rgba(82,48,35,.12); }
.canvas-wrap { position: relative; flex: 1; min-height: 520px; overflow: hidden; isolation: isolate; background: radial-gradient(ellipse at 50% 38%, #ffffff 0%, #fffefc 54%, #f2eee9 100%); }
.canvas-wrap::after { content: ""; position: absolute; z-index: 0; left: 12%; right: 12%; bottom: 9%; height: 24%; border-radius: 50%; background: radial-gradient(ellipse, rgba(89, 62, 47, .1), transparent 67%); filter: blur(24px); pointer-events: none; }
#scoopModelCanvas, #scoopSliceCanvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
#scoopModelCanvas { z-index: 1; touch-action: none; cursor: grab; }
#scoopModelCanvas:active { cursor: grabbing; }
#scoopSliceCanvas { z-index: 1; padding: 42px 70px 54px; object-fit: contain; image-rendering: pixelated; background: rgba(255,255,255,.88); }
.model-watermark { position: absolute; z-index: 6; left: 50%; top: 50%; transform: translate(-50%, -50%); color: rgba(255, 255, 255, .82); font: 400 clamp(34px, 5vw, 62px)/1 Georgia, "Times New Roman", serif; letter-spacing: .025em; text-shadow: 0 1px 2px rgba(54, 38, 30, .34), 0 0 16px rgba(255, 255, 255, .2); white-space: nowrap; pointer-events: none; user-select: none; }
.canvas-wrap.has-interacted .model-watermark { color: rgba(255, 255, 255, .72); }
.is-hidden { display: none !important; }
.empty-state { position: absolute; z-index: 3; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; pointer-events: none; }
.empty-state.is-compact { align-items: flex-start; justify-content: flex-end; padding: 22px; text-align: left; }
.empty-state canvas { width: 92px; height: 92px; image-rendering: pixelated; filter: drop-shadow(0 8px 2px rgba(90, 53, 34, .09)); }
.empty-state b { margin-top: 8px; font-size: 13px; }
.empty-state p { max-width: 330px; margin: 7px 16px; color: var(--muted); font-size: 9px; line-height: 1.6; }
.preview-badge { position: absolute; z-index: 4; top: 13px; left: 50%; transform: translateX(-50%); padding: 6px 8px; border: 1px solid rgba(89, 54, 36, .12); border-radius: 12px; background: rgba(255, 255, 255, .88); color: var(--muted); font: 800 8px/1 var(--pixel); box-shadow: 0 5px 18px rgba(70,45,34,.05); pointer-events: none; }
.model-label { position: absolute; z-index: 4; top: 14px; min-width: 112px; padding: 7px 9px; border: 1px solid rgba(88,56,43,.13); border-radius: 6px; background: rgba(255,255,255,.82); box-shadow: 0 8px 24px rgba(81,51,38,.07); backdrop-filter: blur(8px); pointer-events: none; }
.model-label b, .model-label span { display: block; }
.model-label b { font-size: 9px; }
.model-label span { margin-top: 2px; color: var(--muted); font-size: 7px; }
.label-lid { left: 14px; }
.label-body { right: 14px; text-align: right; }
.slice-legend { position: absolute; z-index: 4; right: 14px; bottom: 14px; padding: 8px 10px; display: flex; gap: 12px; border: 1px solid var(--line); border-radius: 6px; background: rgba(255,250,240,.92); font-size: 7px; }
.slice-legend span { display: flex; align-items: center; gap: 5px; }
.slice-legend i { width: 10px; height: 10px; border-radius: 2px; }
.slice-legend .printable { background: var(--pink); }
.slice-legend .lost { background: #db594b; }
.stage-checks { min-height: 72px; display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); background: #fffaf1; }
.stage-checks > div { padding: 10px; display: grid; grid-template-columns: 19px 1fr; align-content: center; column-gap: 7px; border-right: 1px solid var(--line); }
.stage-checks > div:last-child { border-right: 0; }
.stage-checks span { grid-row: 1 / 3; display: grid; width: 18px; height: 18px; place-items: center; border: 1px solid #b7a699; border-radius: 50%; font-size: 9px; }
.stage-checks span.is-good { border-color: #709244; background: #dff0a8; color: #4a6818; }
.stage-checks span.is-warning { border-color: #c75d48; background: #ffe0d4; color: #a33928; }
.stage-checks b { font-size: 9px; }
.stage-checks small { margin-top: 2px; color: var(--muted); font-size: 7px; }

.scoop-result { position: sticky; top: 80px; padding: 18px 15px; }
.result-heading { display: flex; align-items: center; justify-content: space-between; padding-bottom: 13px; border-bottom: 1px solid var(--line); }
.result-heading b { font-size: 13px; }
.result-heading span { padding: 5px 7px; border-radius: 10px; background: #eee5dc; color: var(--muted); font: 800 7px/1 var(--pixel); }
.result-heading span.is-good { background: #dfefa9; color: #486316; }
.result-heading span.is-warning { background: #ffe0d4; color: #9f3b29; }
.scoop-result dl { margin: 10px 0 15px; }
.scoop-result dl div { min-height: 48px; padding: 9px 0; display: flex; align-items: center; justify-content: space-between; gap: 10px; border-bottom: 1px solid var(--line); }
.scoop-result dt { color: var(--muted); font-size: 9px; }
.scoop-result dd { margin: 0; text-align: right; font: 800 8px/1.4 var(--pixel); }
.downloads { display: grid; gap: 8px; }
.downloads button { min-height: 52px; padding: 8px 12px; display: flex; align-items: center; justify-content: space-between; border: 1px solid #9b654b; border-radius: 6px; background: #81503c; color: #fffaf0; cursor: pointer; }
.downloads button span, .downloads button b, .downloads button small { display: block; text-align: left; }
.downloads button b { font-size: 10px; }
.downloads button small { margin-top: 3px; color: rgba(255,255,255,.72); font-size: 7px; }
.downloads button i { font: 900 15px/1 var(--pixel); }
.downloads .lid-download { border-color: #a95875; background: #cf718f; }
.downloads button:disabled { cursor: not-allowed; filter: grayscale(.55); opacity: .38; }
.scoop-result > p { margin: 13px 2px 0; color: var(--muted); font-size: 8px; line-height: 1.65; }
footer { width: min(1240px, calc(100% - 40px)); margin: 26px auto 0; padding: 18px 0 24px; display: flex; justify-content: space-between; color: var(--muted); font: 800 8px/1 var(--pixel); }
.image-intent-dialog { width: min(620px, calc(100% - 30px)); padding: 0; border: 1px solid #ba806c; border-radius: 12px; background: #fffaf3; color: var(--ink); box-shadow: 0 28px 80px rgba(54,31,24,.28); }
.image-intent-dialog::backdrop { background: rgba(48, 31, 26, .46); backdrop-filter: blur(5px); }
.image-intent-dialog form { padding: 25px; }
.intent-step { color: var(--pink-deep); font: 900 8px/1 var(--pixel); letter-spacing: .08em; }
.image-intent-dialog h2 { margin: 9px 0 7px; font: 900 24px/1.2 var(--cute); }
.image-intent-dialog form > p { margin: 0; color: var(--muted); font-size: 9px; line-height: 1.6; }
.intent-options { margin-top: 18px; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.intent-options button { min-height: 112px; padding: 15px; display: flex; align-items: center; gap: 12px; border: 1px solid #d0b49b; border-radius: 9px; background: #fff; color: var(--ink); text-align: left; cursor: pointer; transition: transform .16s, border-color .16s, box-shadow .16s; }
.intent-options button:hover { transform: translateY(-2px); border-color: #ae5874; box-shadow: 0 10px 24px rgba(104,56,68,.12); }
.intent-options i { display: grid; width: 46px; height: 46px; flex: 0 0 46px; place-items: center; border-radius: 50%; background: #f5d5dc; color: #9b4764; font: normal 900 22px/1 var(--cute); }
.intent-options span, .intent-options b, .intent-options small { display: block; }
.intent-options b { font-size: 11px; }
.intent-options small { margin-top: 6px; color: var(--muted); font-size: 8px; line-height: 1.45; }

@media (max-width: 1160px) {
  .scoop-workbench { grid-template-columns: 300px minmax(0, 1fr); }
  .scoop-result { position: static; grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1.2fr; gap: 20px; }
  .scoop-result .downloads { align-content: start; }
  .scoop-result > p { grid-column: 2; }
}
@media (max-width: 790px) {
  .scoop-header { grid-template-columns: 1fr auto; }
  .local-note { display: none; }
  .scoop-hero { grid-template-columns: 1fr; gap: 18px; padding: 26px 20px 22px; }
  .hero-note { padding: 14px 0 0; border-top: 1px solid var(--line); border-left: 0; }
  .scoop-workbench { grid-template-columns: 1fr; }
  .scoop-controls, .scoop-stage, .scoop-result { grid-column: auto; }
  .scoop-stage { position: static; height: min(720px, calc(100vh - 20px)); min-height: 590px; }
  .scoop-result { grid-template-columns: 1fr; }
  .scoop-result > p { grid-column: auto; }
}
@media (max-width: 520px) {
  .scoop-header { padding-inline: 14px; }
  .scoop-brand small { display: none; }
  .scoop-hero, .scoop-workbench, footer { width: calc(100% - 20px); }
  .scoop-hero h1 { font-size: 31px; }
  .stage-toolbar { align-items: flex-start; }
  .stage-checks { grid-template-columns: 1fr; }
  .stage-checks > div { border-right: 0; border-bottom: 1px solid var(--line); }
  .model-label { min-width: 92px; }
  .model-watermark { font-size: clamp(30px, 11vw, 48px); }
  .intent-options { grid-template-columns: 1fr; }
  #scoopSliceCanvas { padding: 50px 18px; }
  footer { gap: 18px; flex-direction: column; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; }
}
