:root{font-family:Inter Tight,-apple-system,BlinkMacSystemFont,PingFang SC,Noto Sans SC,sans-serif;color:#f8f4ed;background:#14110e;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:#14110e}button,input,textarea{font:inherit}button{-webkit-tap-highlight-color:transparent}.page{min-height:100vh;padding:0 0 64px}.shell{width:min(100% - 40px,580px);margin:0 auto}.top{display:flex;justify-content:space-between;gap:16px;align-items:center;padding:22px 0 14px;border-bottom:1px solid #3a342c;font:500 11px/1.4 JetBrains Mono,monospace;letter-spacing:2px}.top button{color:#8a8177;background:none;border:0;padding:4px 0;cursor:pointer}.hero{margin:30px 0 22px}.hero h1{margin:0 0 5px;font:700 clamp(38px,10vw,48px)/1 "Fraunces",Georgia,serif}.hero h1 span,.orange{color:#d85a30}.hero p{margin:0;color:#8a8177;font-size:14px;letter-spacing:4px}.note{color:#8a8177;font-size:14px;line-height:1.75;margin:0 0 20px}.role-list{display:grid;gap:11px}.role-card{width:100%;min-height:86px;border:1px solid #3a342c;border-radius:6px;padding:16px;color:#f8f4ed;background:transparent;cursor:pointer;display:grid;grid-template-columns:34px 1fr 24px;gap:12px;align-items:center;text-align:left}.role-card:hover,.role-card:focus-visible{border-color:#d85a30;background:#d85a3014;outline:none}.role-index{color:#d85a30;font-size:11px;align-self:start;padding-top:4px}.role-card strong{display:block;font-size:20px;line-height:1.25}.role-card small{display:block;color:#8a8177;font-size:12px;line-height:1.6;margin-top:5px}.role-arrow{color:#d85a30;font-size:22px;text-align:right}.card{border:1px solid #3a342c;border-radius:6px;padding:16px;margin-bottom:11px;cursor:pointer;display:flex;justify-content:space-between;gap:12px;align-items:center}.card.active{border:2px solid #d85a30;background:#d85a301a;padding:15px}.dot{width:20px;height:20px;border:2px solid #8a8177;border-radius:50%;flex:0 0 auto}.active .dot{border-color:#d85a30;background:#d85a30;box-shadow:inset 0 0 0 4px #14110e}.btn{width:100%;min-height:52px;border-radius:5px;border:0;background:#d85a30;color:#f8f4ed;font-weight:700;font-size:16px;letter-spacing:2px;cursor:pointer;padding:14px 18px}.btn-link{display:flex;align-items:center;justify-content:center;text-decoration:none;margin-top:22px}.stack .btn-link{margin-top:0}.btn:disabled{opacity:.38;cursor:not-allowed}.btn.ghost{background:transparent;border:1px solid #3a342c;color:#b1a89d}.btn.danger{color:#e97b61;border-color:#623327}.stack{display:grid;gap:10px}.score{padding:0 0 20px;margin:0 0 22px;border-bottom:1px solid #3a342c}.score-head{display:flex;justify-content:space-between;gap:12px;align-items:baseline;margin-bottom:12px;font-size:17px;font-weight:600}.muted{color:#8a8177}.mono{font-family:JetBrains Mono,monospace}.score-buttons{display:grid;grid-template-columns:repeat(10,1fr);gap:5px}.score-buttons button{min-width:0;height:44px;border:1px solid #3a342c;border-radius:4px;background:transparent;color:#8a8177;font:700 14px JetBrains Mono,monospace;cursor:pointer}.score-buttons button.on{color:#f8f4ed;background:#d85a30;border-color:#d85a30}.banner{border:1px solid #d85a30;background:#d85a301c;border-radius:5px;padding:14px 16px;margin-bottom:24px;line-height:1.65}.result{margin-bottom:19px}.result-line{display:flex;justify-content:space-between;gap:12px;align-items:baseline;margin-bottom:7px}.bar{height:14px;background:#3a342c;border-radius:2px;overflow:hidden}.bar>div{height:100%;background:#a8552f;transition:width .4s}.result:first-child .bar>div{background:#d85a30}.detail{color:#8a8177;font:500 10px/1.6 JetBrains Mono,monospace;margin-top:5px}.input{width:100%;color:#f8f4ed;background:transparent;border:1px solid #3a342c;border-radius:5px;padding:14px 15px;outline:none}.input:focus{border-color:#d85a30}textarea.input{resize:vertical;line-height:1.7}.section-title{font:700 27px/1.2 Fraunces,Georgia,serif;margin:5px 0 8px}.toast{position:fixed;z-index:5;left:50%;bottom:28px;transform:translate(-50%);width:max-content;max-width:calc(100% - 40px);padding:12px 20px;border-radius:4px;color:#14110e;background:#f8f4ed;font-weight:700;box-shadow:0 4px #d85a30}.empty{text-align:center;color:#8a8177;padding:60px 0;line-height:1.8}.final-page{min-height:100vh;background:#f8f4ed;color:#14110e;padding:0 20px 72px}.final-shell{width:min(100%,820px);margin:0 auto}.final-brand{padding:28px 0 18px;border-bottom:1px solid #cfc6bb;font-size:11px;letter-spacing:2px;display:flex;justify-content:space-between;gap:18px;align-items:center}.final-brand button{border:0;background:none;color:#756c63;padding:0;cursor:pointer;font:inherit;letter-spacing:0}.final-heading{padding:54px 0 42px;display:grid;grid-template-columns:1fr auto;align-items:end;gap:4px 24px}.final-heading p{grid-column:1;margin:0;color:#d85a30;font:700 13px/1.4 JetBrains Mono,monospace}.final-heading h1{grid-column:1;margin:0;font:700 54px/1.05 Fraunces,Georgia,serif}.final-heading span{grid-column:2;grid-row:1 / span 2;color:#756c63;font:600 11px/1.4 JetBrains Mono,monospace;letter-spacing:2px;padding-bottom:7px}.final-list{border-top:3px solid #14110e}.final-row{min-height:92px;display:grid;grid-template-columns:70px 1fr auto;gap:18px;align-items:center;border-bottom:1px solid #cfc6bb}.final-rank{color:#756c63;font-size:16px}.final-row strong{min-width:0;overflow-wrap:anywhere;font-size:24px;line-height:1.25}.final-score{color:#d85a30;font-size:28px;font-weight:700}.final-row.rank-1{min-height:116px}.final-row.rank-1 .final-rank,.final-row.rank-1 .final-score{color:#d85a30}.final-row.rank-1 strong{font-size:32px}.final-foot{color:#756c63;text-align:right;padding-top:18px;font-size:10px}.pending-results .banner{margin-top:24px;color:#14110e}.complete-page{min-height:100vh;display:grid;place-items:center;padding:32px 20px;background:#14110e;color:#f8f4ed}.complete-shell{width:min(100%,520px);text-align:center}.complete-mark{width:72px;height:72px;margin:0 auto 28px;display:grid;place-items:center;border:1px solid #d85a30;border-radius:50%;color:#d85a30;font-size:34px}.complete-shell p{margin:0 0 18px;color:#d85a30;font-size:11px;letter-spacing:2px}.complete-shell h1{margin:0 0 14px;font:700 46px/1.1 Fraunces,Georgia,serif}.complete-shell span{color:#8a8177;font-size:15px}@media(max-width:440px){.score-buttons{grid-template-columns:repeat(5,1fr)}.top{letter-spacing:1px}.final-heading{padding:42px 0 32px;grid-template-columns:1fr}.final-heading h1{font-size:44px}.final-heading span{grid-column:1;grid-row:auto;padding:8px 0 0}.final-row{min-height:82px;grid-template-columns:42px minmax(0,1fr) auto;gap:10px}.final-row strong{font-size:19px}.final-score{font-size:22px}.final-row.rank-1 strong{font-size:24px}}
