:root{--paper:#f7f0e6;--surface:#fffdf9;--ink:#2e2a26;--muted:#75695f;--line:#dfd2c2;--brick:#b64d3d;--brick-dark:#8c3e33;--green:#376e4b;--green-soft:#e7f3eb}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;min-height:100vh;background:var(--paper);color:var(--ink);font:18px/1.6 -apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;-webkit-font-smoothing:antialiased}
button,input{font:inherit;color:inherit}
.app{max-width:520px;margin:0 auto;padding:max(24px,env(safe-area-inset-top)) 16px max(24px,env(safe-area-inset-bottom))}
.view[hidden]{display:none}
.muted{color:var(--muted);margin:0}
.brand{display:flex;align-items:center;gap:14px;margin:24px 0 28px}
.brand .mark{display:grid;place-items:center;width:56px;height:56px;border-radius:16px;background:var(--brick);color:#fff;font-size:28px;font-weight:800}
.brand h1{margin:0;font-size:30px;letter-spacing:.04em}
.brand p{margin:2px 0 0;color:var(--muted);font-size:16px}
h2{font-size:22px;margin:0 0 6px}
.card{margin-top:16px;padding:20px 16px;border:1px solid var(--line);border-radius:18px;background:var(--surface)}
label{display:block;margin-bottom:14px;font-size:16px;font-weight:600}
input{display:block;width:100%;height:54px;margin-top:6px;padding:0 14px;border:1px solid var(--line);border-radius:12px;background:#fff;font-size:20px;outline:none}
input:focus{border-color:var(--green);box-shadow:0 0 0 3px rgba(55,110,75,.15)}
.primary{width:100%;height:58px;border:0;border-radius:14px;background:var(--brick);color:#fff;font-size:20px;font-weight:700}
.primary:disabled{opacity:.6}
.error{min-height:1.4em;margin:0 0 10px;color:var(--brick-dark);font-size:16px}
.top{display:flex;align-items:flex-start;justify-content:space-between;margin:8px 0 20px}
.top h1{margin:0;font-size:28px}
.text-button{border:0;background:none;padding:8px;color:var(--muted);font-size:16px}
.start{display:block;width:100%;padding:28px 20px;border:0;border-radius:22px;background:var(--green);color:#fff;text-align:left}
.start strong{display:block;font-size:26px}
.start span{display:block;margin-top:6px;font-size:16px;opacity:.9}
.start:disabled{opacity:.75}
.note{margin:10px 4px 22px;color:var(--muted);font-size:15px}
.tiles{display:grid;gap:12px}
.tile{padding:18px 16px;border:1px solid var(--line);border-radius:16px;background:var(--surface)}
.tile strong{display:block;font-size:20px}
.tile span{color:var(--muted);font-size:15px}
