:root {
  --red: #AE1915;
  --black: #000001;
  --white: #F7F5F0;
  --paper: #fffdfa;
  --muted: #6d6964;
  --line: #ded8d1;
}
* { box-sizing: border-box; }
[hidden] { display:none !important; }
.visually-hidden { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }
body { margin:0; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color:var(--black); background-color:var(--white); background-image:linear-gradient(rgba(0,0,1,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(0,0,1,.025) 1px,transparent 1px); background-size:64px 64px; }
button,input,textarea { font:inherit; }
button { cursor:pointer; }
button:disabled { cursor:wait; opacity:.65; }
.topbar { background:var(--black); color:white; padding:12px clamp(20px,5vw,70px); display:flex; justify-content:space-between; align-items:center; gap:24px; border-bottom:5px solid var(--red); }
h1,h2,h3,p { margin-top:0; }
.topbar h1 { margin:1px 0 0; font-size:clamp(22px,3vw,32px); line-height:1; letter-spacing:.055em; }
.app-identity { display:flex; align-items:center; gap:14px; }
.brand-line { margin:5px 0 0; color:#c9c5c0; font-size:9px; font-weight:900; letter-spacing:.18em; }
.eyebrow { font-size:12px; letter-spacing:.18em; font-weight:900; margin-bottom:5px; }
.red { color:var(--red); }
.status,.approval { font-weight:900; font-size:12px; border:1px solid #555; padding:8px 10px; letter-spacing:.08em; }
.shell { width:min(1120px, calc(100% - 32px)); margin:26px auto 80px; }
.card { background:var(--paper); border:1px solid var(--line); box-shadow:0 14px 40px rgba(0,0,0,.06); padding:clamp(20px,4vw,42px); }
.hero { display:grid; grid-template-columns:1fr auto; gap:30px; align-items:center; border-left:8px solid var(--red); }
.hero h2 { font-size:clamp(27px,4vw,44px); line-height:1.05; max-width:800px; margin-bottom:16px; }
.hero p:not(.eyebrow) { max-width:760px; line-height:1.6; color:#3d3a37; }
.brand-logo { width:52px; height:48px; flex:0 0 52px; object-fit:contain; }
.sensei-image { width:150px; height:150px; object-fit:cover; border:1px solid #2b2522; box-shadow:6px 6px 0 var(--red); }
.sensei-image.small { width:78px; height:78px; flex:0 0 78px; box-shadow:4px 4px 0 var(--red); }
.sensei-introduction { display:flex; align-items:flex-start; gap:18px; }
.steps { display:grid; grid-template-columns:repeat(5,1fr); margin:20px 0; gap:8px; }
.step { border:1px solid var(--line); background:#eeeae5; padding:14px; text-align:left; font-weight:900; color:#706c67; }
.step span { margin-left:8px; }
.step.active { background:var(--black); color:white; border-color:var(--black); }
.view { display:none; }
.view.active { display:block; }
.section-heading { display:flex; justify-content:space-between; gap:20px; align-items:flex-start; margin-bottom:24px; }
.section-heading h2 { margin-bottom:0; font-size:clamp(25px,4vw,40px); }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.assessment-choice { max-width:680px; padding:26px; border-left:7px solid var(--red); background:#f3f0eb; }
.assessment-choice > p { margin-bottom:16px; }
.start-options { display:flex; gap:12px; flex-wrap:wrap; }
.miro-import { max-width:820px; }
.miro-import h3,.miro-review-heading h3,.import-review-block h3 { margin-bottom:8px; letter-spacing:.025em; }
.miro-source { min-height:280px; margin-top:8px; font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; line-height:1.5; }
.miro-review-heading { margin-bottom:22px; padding-bottom:18px; border-bottom:1px solid var(--line); }
.miro-review-heading p:last-child { margin-bottom:0; color:var(--muted); }
.import-review-block { padding:18px; background:#f3f0eb; border-left:5px solid var(--red); }
.import-review-block > p { color:var(--muted); margin-bottom:8px; }
.import-review-block summary { cursor:pointer; font-size:12px; font-weight:900; letter-spacing:.08em; }
.miro-rollup { max-width:760px; margin:0 auto; padding:clamp(20px,4vw,34px); border-top:7px solid var(--red); background:#f3f0eb; }
.miro-rollup .sensei-introduction { margin-bottom:22px; }
.miro-rollup h3 { margin-bottom:7px; }
.miro-rollup-progress { color:var(--muted); }
.rollup-originals { margin:18px 0; padding:16px 18px; background:white; border:1px solid var(--line); }
.field-label { margin-bottom:7px; font-size:12px; font-weight:900; letter-spacing:.12em; }
.hint { margin-top:7px; color:var(--muted); font-size:13px; line-height:1.45; }
label { display:grid; gap:7px; font-size:13px; font-weight:850; letter-spacing:.02em; }
input,textarea { width:100%; border:1px solid #cfc8c0; background:white; padding:13px 14px; border-radius:0; outline:none; }
textarea { min-height:92px; resize:vertical; }
input:focus,textarea:focus { border-color:var(--red); box-shadow:0 0 0 3px rgba(174,25,21,.24); }
button:focus-visible,input:focus-visible,textarea:focus-visible { outline:3px solid #2673d9; outline-offset:3px; }
.wide { grid-column:1/-1; }
.actions { display:flex; justify-content:flex-end; gap:12px; margin-top:8px; }
.split { justify-content:space-between; }
.primary,.ghost { border:1px solid transparent; padding:13px 18px; font-weight:900; letter-spacing:.015em; }
.primary { background:var(--red); color:white; box-shadow:inset 0 -3px 0 rgba(0,0,0,.22); }
.primary:hover { background:#8f1411; }
.ghost { background:#ece7e1; color:var(--black); border-color:#d8d0c8; }
.ghost:hover { background:#ded7cf; border-color:#c5bbb2; }
.empty { padding:36px; border:2px dashed #cfc8c0; text-align:center; color:var(--muted); font-weight:800; }
.goal-lines { display:grid; gap:10px; }
.goal-row { display:grid; grid-template-columns:130px 1fr; align-items:start; gap:12px; }
.goal-row strong { background:var(--black); color:white; padding:11px 12px; text-transform:uppercase; font-size:12px; letter-spacing:.12em; }
.goal-row textarea { min-height:58px; }
.pitch-preview { margin:24px 0; padding:22px; background:var(--black); color:white; border-left:8px solid var(--red); }
.pitch-preview p:last-child { margin:0; font-size:18px; line-height:1.55; }
.product-goal-artifact { position:relative; margin:26px 0; padding:clamp(25px,5vw,50px); background:#fffefa; color:var(--black); border:1px solid #cfc7be; border-left:10px solid var(--red); box-shadow:10px 10px 0 var(--black); }
.product-goal-artifact::before,.product-goal-artifact::after { content:""; position:absolute; left:18px; right:18px; height:1px; background:rgba(0,0,1,.15); }
.product-goal-artifact::before { top:12px; }
.product-goal-artifact::after { bottom:12px; }
.product-goal-artifact .artifact-heading { color:var(--red); }
.product-goal-artifact p:last-child { max-width:900px; font-size:clamp(19px,2.5vw,27px); line-height:1.5; font-weight:650; }
.goal-structure { margin:20px 0; border:1px solid var(--line); background:#f3f0eb; }
.goal-structure summary,.known-summary summary,.review-note summary { cursor:pointer; padding:14px; font-size:12px; font-weight:900; letter-spacing:.08em; }
.goal-structure .goal-lines { padding:0 14px 14px; }
.optional { color:var(--muted); font-size:11px; }
.approved-actions { margin-top:24px; padding:18px; border:2px solid var(--red); border-left-width:8px; background:#fff8f5; }
.approved-actions p { display:inline-block; margin:0 16px 0 0; font-weight:800; }
.evidence-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.evidence-grid article { border:1px solid var(--line); padding:16px; }
.evidence-grid h3 { font-size:12px; letter-spacing:.1em; color:var(--red); }
ul { padding-left:18px; margin-bottom:0; }
li { margin:7px 0; line-height:1.4; }
.quality { margin-top:14px; }
.quality .issue { background:#fff1ef; border-left:4px solid var(--red); padding:10px 12px; margin:8px 0; }
.quality .good { background:#eff7ef; border-left:4px solid #2a7b3f; padding:10px 12px; }
.approval.approved { width:88px; min-height:88px; display:grid; place-items:center; align-content:center; padding:10px; border:3px double var(--red); border-radius:50%; background:transparent; color:var(--red); text-align:center; line-height:1.15; transform:rotate(-4deg); }
.inspection-board { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; align-items:start; }
.review-column { border-top:7px solid var(--black); background:#f3f0eb; padding:16px; min-height:240px; }
.review-column.known { border-color:#2a7b3f; }
.review-column.assumption { border-color:#b26a16; }
.review-column.learn { border-color:var(--red); }
.review-column > p { color:var(--muted); font-size:13px; min-height:38px; }
.review-item { background:white; border:1px solid var(--line); padding:13px; margin:12px 0; display:grid; gap:9px; }
.review-item.focused { max-width:720px; margin:18px auto; padding:clamp(20px,4vw,38px); border-top:7px solid var(--red); box-shadow:0 10px 25px rgba(0,0,0,.07); }
.review-statement { font-size:clamp(20px,3vw,28px); line-height:1.35; font-weight:750; }
.review-progress { text-align:center; color:var(--muted); font-size:12px; font-weight:900; letter-spacing:.12em; }
.review-complete { max-width:720px; margin:18px auto; padding:32px; text-align:center; background:#eff7ef; border-left:6px solid #2a7b3f; }
.known-summary { max-width:720px; margin:22px auto; border:1px solid var(--line); color:var(--muted); }
.known-summary > div { padding:0 18px 18px; }
.review-note { border-top:1px solid var(--line); margin-top:8px; }
.review-note textarea { margin:0 14px 14px; width:calc(100% - 28px); }
.review-item textarea { min-height:62px; }
.review-meta { display:flex; justify-content:space-between; gap:8px; font-size:11px; color:var(--muted); text-transform:uppercase; font-weight:850; }
.review-actions { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.review-actions button { border:1px solid var(--line); background:#f2eee9; padding:8px; font-size:10px; font-weight:900; text-align:left; }
.review-actions .reject { color:var(--red); }
.review-actions button[aria-pressed="true"] { background:var(--black); color:white; border-color:var(--black); }
.rejected-items { margin-top:18px; border:1px dashed #aaa; padding:14px; }
.change-notice { background:#fff1ef; border-left:6px solid var(--red); padding:13px; margin-bottom:16px; font-weight:950; }
.adapt-note { margin-top:18px; }
.actions.compact { margin:0; }
.box-workspace { display:grid; grid-template-columns:minmax(280px,.8fr) minmax(380px,1.2fr); gap:24px; }
.box-fields { display:grid; align-content:start; gap:13px; }
.box-fields textarea { min-height:66px; }
.product-box { min-height:650px; background:linear-gradient(145deg,#fffdfa,#f0ebe4); border:2px solid var(--black); position:relative; overflow:hidden; padding:34px; box-shadow:16px 16px 0 var(--black); }
.product-box::before { content:""; position:absolute; inset:0; background:linear-gradient(90deg,transparent 48%,rgba(0,0,0,.04) 49%,transparent 50%); pointer-events:none; }
.shoji { position:absolute; inset:0; opacity:.07; background-image:linear-gradient(var(--black) 1px, transparent 1px),linear-gradient(90deg,var(--black) 1px,transparent 1px); background-size:72px 72px; }
.box-kicker { position:relative; color:var(--red); font-size:12px; letter-spacing:.18em; font-weight:950; }
.product-box h2 { position:relative; font-size:clamp(38px,6vw,72px); line-height:.9; margin-bottom:12px; max-width:80%; text-transform:uppercase; }
.box-tagline { position:relative; font-size:19px; line-height:1.35; max-width:75%; font-weight:750; }
.asset-slot { position:relative; width:48%; min-height:160px; margin:30px 0 20px; border:2px dashed rgba(0,0,0,.25); display:grid; place-items:center; text-align:center; font-size:11px; font-weight:900; letter-spacing:.08em; color:#8c8580; }
.benefit-stack { position:absolute; right:26px; top:190px; width:43%; display:grid; gap:10px; }
.benefit { background:var(--black); color:white; padding:13px 14px; border-left:7px solid var(--red); font-weight:850; line-height:1.25; }
.box-bottom { position:absolute; left:0; right:0; bottom:0; background:var(--black); color:white; padding:18px 28px; display:grid; gap:5px; }
.box-bottom strong { color:var(--red); letter-spacing:.06em; }
.box-bottom span { font-size:12px; }
footer { padding:25px; background:var(--black); color:#c9c5c0; font-size:12px; display:flex; justify-content:center; gap:18px; flex-wrap:wrap; }
.logo-layout { display:grid; grid-template-columns:minmax(280px,.9fr) minmax(300px,1.1fr); gap:28px; align-items:start; }
.creative-brief { display:grid; gap:16px; }
.creative-brief dl { display:grid; grid-template-columns:100px 1fr; gap:9px 14px; margin:0; }
.creative-brief dt { font-size:11px; font-weight:900; letter-spacing:.08em; color:var(--red); }
.creative-brief dd { margin:0; }
.logo-preview { min-height:430px; display:grid; place-items:center; align-content:center; gap:20px; background:white; border:2px solid var(--black); box-shadow:12px 12px 0 var(--black); padding:30px; }
.logo-preview img { width:min(100%,320px); aspect-ratio:1; object-fit:contain; }
.logo-preview h3 { font-size:clamp(28px,5vw,48px); text-align:center; }
.logo-placeholder { width:260px; aspect-ratio:1; border:2px dashed var(--line); display:grid; place-items:center; color:var(--muted); font-weight:900; }
.logo-candidates { display:flex; gap:10px; margin-top:22px; flex-wrap:wrap; }
.logo-candidates button { padding:6px; background:white; border:2px solid var(--line); }
.logo-candidates img { width:72px; height:72px; object-fit:contain; }
.artifact-list { display:grid; gap:12px; padding:0; list-style:none; }
.artifact-list li { display:grid; grid-template-columns:48px 1fr auto; gap:14px; align-items:start; padding:16px; background:white; border:1px solid var(--line); }
.artifact-list li>strong { color:var(--red); font-size:20px; }
.artifact-list input,.artifact-list textarea { margin-bottom:8px; }
.artifact-list textarea { min-height:70px; }
.artifact-list small { color:var(--muted); text-transform:uppercase; font-weight:850; }
.item-actions { display:grid; gap:6px; }
.item-actions button { padding:7px 9px; font-size:11px; }
footer strong { color:white; letter-spacing:.12em; }
@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { scroll-behavior:auto !important; transition-duration:.01ms !important; animation-duration:.01ms !important; animation-iteration-count:1 !important; }
}
@media (max-width: 820px) {
  .form-grid,.evidence-grid,.box-workspace,.inspection-board,.logo-layout,.artifact-list li { grid-template-columns:1fr; }
  .steps { grid-template-columns:1fr; }
  .wide { grid-column:auto; }
  .hero { grid-template-columns:1fr; }
  .hero .sensei-image { width:112px; height:112px; justify-self:start; }
  .step span { display:block; margin:3px 0 0; font-size:10px; }
  .goal-row { grid-template-columns:1fr; }
  .review-actions { grid-template-columns:1fr; }
  .benefit-stack { position:relative; top:auto; right:auto; width:100%; margin:20px 0 120px; }
  .asset-slot { width:100%; }
  .product-box h2,.box-tagline { max-width:100%; }
}
@media (max-width: 560px) {
  .topbar { align-items:flex-start; }
  .brand-logo { width:42px; height:39px; flex-basis:42px; }
  .topbar .status { max-width:112px; text-align:right; font-size:9px; }
  .hero .sensei-image { width:72px; height:72px; }
  .sensei-introduction .sensei-image { width:58px; height:58px; flex-basis:58px; }
  .product-goal-artifact { box-shadow:6px 6px 0 var(--black); }
  .approval.approved { width:auto; min-height:0; border-radius:0; transform:none; }
}
