.page{display:flex;flex-direction:column;min-height:100vh}.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:18px clamp(20px,5vw,56px);border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--canvas) 70%,white)}.wordmark{display:inline-flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink)}.wordmark__mark{display:grid;place-items:center;width:38px;height:38px;border-radius:9px;background:var(--petrol);color:#f3efe6;font-family:var(--font-display);font-weight:900;font-size:1.3rem;box-shadow:0 2px 0 var(--petrol-deep)}.wordmark__text{font-family:var(--font-display);font-weight:900;font-size:1.18rem;letter-spacing:.01em}.wordmark__sub{margin-left:8px;font-family:var(--font-mono);font-weight:500;font-size:.72rem;letter-spacing:.22em;color:var(--muted);vertical-align:2px}.trust{margin:0;font-family:var(--font-mono);font-size:.74rem;letter-spacing:.04em;color:var(--petrol)}.appShell{flex:1;width:100%;max-width:1080px;margin:0 auto;padding:clamp(36px,6vw,72px) clamp(20px,5vw,56px) 64px}.hero{position:relative;overflow:hidden;padding:clamp(28px,4vw,44px) clamp(24px,4vw,48px) clamp(32px,4vw,48px);border:1px solid var(--line);border-radius:var(--radius-lg);background:radial-gradient(120% 140% at 100% 0%,rgba(20,64,59,.06),transparent 55%),var(--surface);margin-bottom:24px}.hero__beam{position:absolute;inset:0 auto 0 0;width:38%;background:linear-gradient(90deg,transparent,rgba(220,60,40,.07) 60%,rgba(220,60,40,.22));border-right:2px solid var(--vermilion);transform:translate(-120%);animation:scan 2.4s cubic-bezier(.4,0,.1,1) .3s 1 forwards;pointer-events:none}@keyframes scan{to{transform:translate(360%);opacity:0}}.eyebrow{position:relative;margin:0 0 18px;font-family:var(--font-mono);font-size:.78rem;font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--vermilion)}.eyebrow:before{content:"[ ";color:var(--line-strong)}.eyebrow:after{content:" ]";color:var(--line-strong)}.hero__title{position:relative;margin:0;max-width:18ch;font-family:var(--font-display);font-weight:900;font-size:clamp(2.4rem,6vw,4.6rem);line-height:1.02;letter-spacing:-.01em;color:var(--ink)}.hero__title em{font-style:normal;background:linear-gradient(transparent 64%,#dc3c2842 0)}.lead{position:relative;max-width:46rem;margin:22px 0 0;color:var(--ink-soft);font-size:1.04rem;line-height:1.78}.specimen{position:relative;display:inline-flex;align-items:center;gap:14px;flex-wrap:wrap;margin:28px 0 0;padding:10px 16px;border:1px solid var(--line);border-radius:999px;background:var(--surface-sunken);font-family:var(--font-mono);font-size:.84rem}.specimen__before{color:var(--line-strong);letter-spacing:.1em}.specimen__arrow{color:var(--vermilion);font-weight:600}.specimen__after{color:var(--petrol);font-weight:500}.workspace{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(260px,1fr);gap:20px;align-items:start;margin-bottom:20px}.step{display:grid;grid-template-columns:auto minmax(0,1fr);gap:18px;align-items:start}.step__index{margin:2px 0 0;font-family:var(--font-mono);font-weight:600;font-size:.92rem;letter-spacing:.04em;color:var(--petrol);padding-top:6px;border-top:2px solid var(--vermilion)}.step__body{display:grid;gap:14px;min-width:0}.step__kicker{margin:0;font-family:var(--font-mono);font-size:.74rem;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}.step--result{margin-top:4px}.panel{padding:22px;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface)}.panelTitle,.sectionTitle{margin:0;color:var(--ink);font-family:var(--font-display);font-size:1.16rem;font-weight:700;letter-spacing:.01em}.panelText,.fieldHint,.statusText{margin:0;color:var(--muted);line-height:1.65}.dropZone{display:flex;flex-direction:column;gap:12px;padding:28px;border:1.5px dashed var(--line-strong);border-radius:var(--radius);background:repeating-linear-gradient(-45deg,transparent,transparent 9px,rgba(20,64,59,.025) 9px,rgba(20,64,59,.025) 10px),var(--surface-sunken);cursor:pointer;transition:border-color .16s ease,background-color .16s ease,transform .16s ease}.dropZone:hover{border-color:var(--petrol);transform:translateY(-1px)}.dropZone:focus-within{border-color:var(--petrol);outline:3px solid rgba(20,64,59,.22);outline-offset:3px}.fileName{display:inline-flex;align-self:flex-start;align-items:center;gap:8px;margin-top:4px;padding:7px 14px;border:1px solid var(--line);border-radius:999px;background:var(--surface);color:var(--ink);font-family:var(--font-mono);font-size:.82rem;font-weight:500}.fileName:before{content:"▸";color:var(--vermilion)}.fieldLabel{display:block;margin-bottom:8px;color:var(--ink);font-weight:600;font-size:.95rem}.textField,.resultArea{width:100%;padding:12px 14px;border:1px solid var(--line-strong);border-radius:10px;background:var(--surface);color:var(--ink);font-family:var(--font-mono)}.textField:focus,.resultArea:focus{border-color:var(--petrol);outline:2px solid rgba(20,64,59,.2);outline-offset:1px}.actionPanel{display:grid;gap:16px;align-content:start;position:sticky;top:20px}.primaryButton{width:100%;padding:15px 18px;border:none;border-radius:10px;background:var(--vermilion);color:#fff;font-family:var(--font-display);font-weight:700;font-size:1.02rem;letter-spacing:.04em;cursor:pointer;box-shadow:0 3px 0 var(--vermilion-deep);transition:transform .12s ease,box-shadow .12s ease,background-color .16s ease}.primaryButton:hover:not(:disabled){background:#e6442f}.primaryButton:active:not(:disabled){transform:translateY(3px);box-shadow:0 0 0 var(--vermilion-deep)}.primaryButton:focus-visible{outline:3px solid rgba(220,60,40,.32);outline-offset:3px}.primaryButton:disabled{background:var(--surface-sunken);color:var(--muted);box-shadow:0 3px 0 var(--line);cursor:not-allowed}.statusText{font-family:var(--font-mono);font-size:.82rem;line-height:1.7}.resultHeader{display:grid;gap:6px;margin-bottom:14px}.resultArea{min-height:340px;resize:vertical;line-height:1.7;font-size:.92rem}.errorMessage{margin:0 0 14px;padding:12px 14px;border:1px solid rgba(220,60,40,.4);border-left-width:4px;border-radius:10px;background:#dc3c2812;color:var(--vermilion-deep);font-weight:600}.foot{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:22px clamp(20px,5vw,56px);border-top:1px solid var(--line);color:var(--muted);font-size:.86rem}.foot p{margin:0}.foot__mono{font-family:var(--font-mono);font-size:.76rem;letter-spacing:.06em}.visuallyHidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}@media(max-width:860px){.workspace{grid-template-columns:1fr}.actionPanel{position:static}.hero__title{max-width:none}}@media(max-width:480px){.step{grid-template-columns:1fr;gap:10px}.step__index{display:inline-block;border-top:none;border-left:2px solid var(--vermilion);padding:0 0 0 10px}}@media(prefers-reduced-motion:reduce){.hero__beam{animation:none;display:none}.primaryButton,.dropZone{transition:none}}:root{--ink: #1a1f24;--ink-soft: #2c343a;--muted: #5b645e;--canvas: #e6e8e3;--surface: #fcfcfa;--surface-sunken: #f1f2ed;--petrol: #14403b;--petrol-deep: #0f302c;--vermilion: #dc3c28;--vermilion-deep: #b92f1f;--line: #cdd0c9;--line-strong: #b4b8af;--font-display: "Zen Kaku Gothic New", "IBM Plex Sans JP", system-ui, sans-serif;--font-body: "IBM Plex Sans JP", "Hiragino Kaku Gothic ProN", Meiryo, system-ui, sans-serif;--font-mono: "IBM Plex Mono", "SFMono-Regular", ui-monospace, monospace;--radius: 14px;--radius-lg: 22px;color:var(--ink);background:var(--canvas);font-family:var(--font-body);line-height:1.6;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}html,body,#root{min-width:320px;min-height:100vh}*{box-sizing:border-box}body{margin:0;background-image:linear-gradient(rgba(20,64,59,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(20,64,59,.035) 1px,transparent 1px);background-size:28px 28px;background-position:center top}button,input,textarea,select{font:inherit}