@font-face{font-family:Fraunces;src:url(/fonts/Fraunces.ttf) format("truetype");font-weight:300 900;font-display:swap}
:root{--bg:#F5F7FA;--line:#E3E8EF;--ink:#1C2430;--blue:#3A6EA5;--orange:#E07A3F;--mute:#7A8696;--r:16px}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;padding-bottom:env(safe-area-inset-bottom)}
h1{font-family:Fraunces,Georgia,serif;font-weight:650;font-size:2rem;line-height:1.15;margin:.2rem 0 .4rem;letter-spacing:-.01em}
.wrap{width:100%;max-width:560px;margin:0 auto;padding:16px}
.top{display:flex;justify-content:space-between;align-items:center;padding-top:calc(12px + env(safe-area-inset-top))}
.mark{font-family:Fraunces,Georgia,serif;font-weight:700;font-size:1.15rem}
.link{background:none;border:0;color:var(--blue);font:inherit;font-size:1rem;padding:12px 4px;min-height:48px;cursor:pointer}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:22px 18px;box-shadow:0 1px 2px rgba(28,36,48,.05),0 8px 24px rgba(28,36,48,.06)}
.eyebrow{color:var(--orange);font-weight:700;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase}
.sub{color:var(--mute);margin:0 0 18px}
.err{background:#FDF0E8;border:1px solid #F2C3A4;color:#8A3B12;border-radius:12px;padding:12px 14px;margin:0 0 16px}
.stack{display:grid;gap:14px}
label{display:grid;gap:6px;font-weight:600}
input:not([type=file]):not([type=hidden]){font:inherit;font-size:18px;padding:14px;border:1px solid #C9D2DE;border-radius:12px;min-height:54px;background:#fff;color:var(--ink)}
input:focus-visible,.btn:focus-within,.btn:focus-visible{outline:3px solid rgba(58,110,165,.35);outline-offset:2px}
.btn{display:flex;align-items:center;justify-content:center;gap:8px;font:inherit;font-weight:650;border-radius:14px;border:1px solid transparent;padding:12px 18px;min-height:52px;cursor:pointer;text-decoration:none;text-align:center;-webkit-tap-highlight-color:transparent}
.btn-big{min-height:60px;font-size:1.08rem;width:100%}
.btn-primary{background:var(--blue);color:#fff}
.btn-ghost{background:#fff;color:var(--ink);border-color:#C9D2DE}
.btn-accent{background:var(--orange);color:#fff;font-size:1.2rem;min-height:68px}
.btn:disabled{background:var(--line);color:var(--mute);cursor:not-allowed}
.vh{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden}
.slot{border:2px dashed #C9D2DE;border-radius:var(--r);padding:14px;margin:0 0 16px;background:var(--bg);position:relative}
.slot.has{border-style:solid;border-color:var(--blue);background:#fff}
.slot.busy{opacity:.6}
legend{font-family:Fraunces,Georgia,serif;font-weight:650;font-size:1.2rem;padding:0 6px}
.pick{display:grid;gap:10px}
.preview{display:grid;gap:6px;margin-bottom:10px}
.preview img{width:100%;max-height:300px;object-fit:contain;background:var(--line);border-radius:12px}
.meta{color:var(--mute);font-size:.85rem}
.redo{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.btn-submit{margin-top:6px}
.hint{text-align:center;color:var(--mute);margin:10px 0 0;font-size:.95rem}
.done{text-align:center}
.check{width:72px;height:72px;margin:6px auto 8px;border-radius:50%;background:var(--blue);color:#fff;font-size:40px;line-height:72px}
.sid{background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:12px;color:var(--mute);margin:0 0 18px}
.sid code{font-size:1.05rem;color:var(--ink);word-break:break-all}
@media (min-width:900px){.wrap{max-width:720px;padding:24px}.card{padding:36px 40px}h1{font-size:2.5rem}
 .slots{display:grid;grid-template-columns:1fr 1fr;gap:16px}.slots .slot{margin:0 0 16px;min-width:0}}
[hidden]{display:none!important}
textarea{font:inherit;font-size:18px;padding:14px;border:1px solid #C9D2DE;border-radius:12px;background:#fff;color:var(--ink);resize:vertical}
.toggle{margin:0 0 12px}.opt{color:var(--mute);font-weight:500}
.manual{display:grid;gap:14px;border:1px solid var(--line);border-radius:var(--r);padding:16px;margin:0 0 16px;background:var(--bg)}
.hint.left{text-align:left;margin:0}
.seg{border:0;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:10px}.seg legend{font-family:inherit;font-size:1rem;font-weight:600;padding:0;margin-bottom:6px}
.seg label{display:flex;align-items:center;gap:10px;justify-content:center;min-height:54px;border:1px solid #C9D2DE;border-radius:12px;background:#fff;cursor:pointer}
.seg label:has(input:checked){border-color:var(--blue);background:#EAF1F8;color:var(--blue)}.seg input{width:22px;height:22px;accent-color:var(--blue)}
@media (min-width:900px){.manual{grid-template-columns:1fr 1fr}.manual .hint,.manual label:has(textarea){grid-column:1/-1}}
.manual>*{min-width:0}.manual input:not([type=radio]),.manual textarea{width:100%}