:root{color:#eee9df;background:#0c0912;font-family:Microsoft YaHei,PingFang SC,sans-serif;font-synthesis:none;--gold: #d9b66f;--gold-light: #f4dfad;--red: #a73f49;--surface: rgba(25, 20, 35, .88);--line: rgba(217, 182, 111, .2)}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:radial-gradient(circle at 50% -10%,#39233b 0,#161020 34%,#09070d 75%)}button,input{font:inherit}button{cursor:pointer}.app-shell{position:relative;min-height:100vh;overflow:hidden;padding:70px 18px 56px}.app-shell:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;opacity:.3;background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);background-size:28px 28px;-webkit-mask-image:radial-gradient(circle,black,transparent 75%);mask-image:radial-gradient(circle,black,transparent 75%)}.topbar{position:fixed;z-index:5;top:0;left:0;right:0;height:52px;padding:0 18px;display:flex;align-items:center;justify-content:space-between;color:#b8afc0;background:#08060cb8;border-bottom:1px solid rgba(255,255,255,.06);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);font-size:12px;letter-spacing:.12em}.topbar span:first-child{color:var(--gold);font-family:STSong,SimSun,serif;font-weight:700}.connection-status{display:flex;align-items:center;gap:5px}.connection-status i{width:6px;height:6px;background:#719b69;border-radius:50%;box-shadow:0 0 8px #719b6980}.connection-status i.offline{background:var(--gold);box-shadow:0 0 8px #d9b66f80}footer{position:absolute;bottom:18px;left:0;right:0;color:#6d6573;text-align:center;font-size:11px;letter-spacing:.08em}.hero{padding:24px 0 26px;text-align:center}.moon-mark{width:64px;height:64px;margin:0 auto 15px;display:grid;place-items:center;color:#1a1420;background:var(--gold);border-radius:50%;box-shadow:0 0 45px #d9b66f4d;font-family:STSong,SimSun,serif;font-weight:900;font-size:28px}h1,h2{margin:0;font-family:STSong,SimSun,serif}h1{font-size:clamp(30px,9vw,50px);letter-spacing:.08em}h2{font-size:18px}.eyebrow{margin:0 0 7px;color:var(--gold);font-size:10px;font-weight:700;letter-spacing:.28em;text-transform:uppercase}.subtitle,.help{color:#9c93a3;line-height:1.65}.subtitle{margin:10px auto 0;max-width:420px;font-size:13px}.help{margin:5px 0 12px;font-size:12px}.panel{position:relative;width:min(100%,540px);margin:0 auto;padding:22px;background:linear-gradient(150deg,#221b2df2,#120e1af5);border:1px solid var(--line);border-radius:20px;box-shadow:0 24px 70px #00000059}.section-title{display:flex;align-items:center;gap:10px;margin-bottom:15px}.section-title:not(:first-child){margin-top:28px}.section-title span{color:var(--gold);font-size:11px;font-weight:700}.count-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.count-card,.side-grid button{color:#aaa0b0;background:#15101d;border:1px solid rgba(255,255,255,.08);border-radius:12px}.count-card{padding:13px 4px}.count-card strong{display:block;color:#eee9df;font-size:21px}.count-card span{font-size:10px}.count-card.selected,.side-grid button.selected{color:var(--gold-light);border-color:var(--gold);background:#d9b66f1a;box-shadow:inset 0 0 20px #d9b66f0f}.composition{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:14px}.composition span{padding:8px 3px;color:#bdb4c3;background:#ffffff09;border-radius:6px;text-align:center;font-size:10px}.role-line{margin:10px 0 0;color:#716978;text-align:center;font-size:10px;line-height:1.7}.password-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}input{width:100%;padding:14px 15px;color:#eee9df;background:#100c17;border:1px solid rgba(255,255,255,.12);border-radius:10px;outline:none}input:focus{border-color:var(--gold);box-shadow:0 0 0 3px #d9b66f14}.primary-button{width:100%;margin-top:18px;padding:15px 20px;color:#17111c;background:linear-gradient(135deg,var(--gold-light),#b98a43);border:0;border-radius:10px;box-shadow:0 8px 30px #be8b4433;font-weight:700;letter-spacing:.08em}.primary-button:active{transform:translateY(1px)}.error{margin:10px 0 0;color:#ec8f98;font-size:12px;text-align:center}.progress{position:relative;max-width:580px;height:3px;margin:0 auto;background:#292130;border-radius:5px}.progress div{height:100%;background:var(--gold);transition:width .35s}.progress span{position:absolute;top:9px;right:0;color:#746c7b;font-size:9px}.center-stage,.reveal-stage,.results-stage{position:relative;z-index:1;max-width:580px;margin:0 auto}.center-stage{min-height:calc(100vh - 150px);padding:50px 0 55px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.sealed-card{position:relative;width:170px;height:250px;margin-bottom:34px;display:grid;place-items:center;background:radial-gradient(circle,#2b2138,#120e19 70%);border:1px solid #7d663d;border-radius:13px;box-shadow:0 22px 60px #00000080,inset 0 0 0 5px #15101d,inset 0 0 0 6px #d9b66f40;transform:rotate(-2deg)}.sealed-card:before{content:"";position:absolute;top:16px;right:16px;bottom:16px;left:16px;border:1px solid rgba(217,182,111,.18);transform:rotate(45deg)}.wolf-sigil,.lock-icon{display:grid;place-items:center;color:var(--gold);border:1px solid var(--gold);border-radius:50%;font-family:STSong,SimSun,serif;font-weight:900}.wolf-sigil{z-index:1;width:76px;height:76px;background:#17111f;font-size:32px;box-shadow:0 0 35px #d9b66f24}.card-runes{position:absolute;top:24px;color:#8a7043}.card-runes.bottom{top:auto;bottom:24px}.draw-button{max-width:380px;margin-top:30px}.reveal-stage{padding:34px 0 70px}.identity-card{min-height:320px;padding:35px 25px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:radial-gradient(circle at 50% 35%,#785b8b40,#140f1cf7 65%);border:1px solid var(--line);border-radius:22px 22px 8px 8px}.identity-card h1{margin:10px 0;font-size:46px}.identity-card>p:last-child{max-width:320px;color:#aaa0b0;font-size:13px;line-height:1.8}.role-icon{width:94px;height:94px;display:grid;place-items:center;color:var(--gold-light);background:#0a080e8c;border:1px solid var(--gold);border-radius:50%;font-family:STSong,SimSun,serif;font-size:34px;box-shadow:0 0 45px #d9b66f2b}.identity-card.role-狼人{background:radial-gradient(circle at 50% 35%,#992f3a4d,#140f1cf7 65%)}.identity-card.role-狼人 .role-icon{color:#f4b6b6;border-color:#b64d56}.identity-form{margin-top:-8px;border-radius:8px 8px 22px 22px}.identity-form label{display:block;margin-bottom:8px;color:#d7cfda;font-size:12px}.side-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:12px 0 22px}.side-grid button{padding:13px 8px}.checkmark{width:78px;height:78px;margin-bottom:25px;display:grid;place-items:center;color:#b9d3ae;background:#5d84501f;border:1px solid #709264;border-radius:50%;font-size:32px}.handoff h1{max-width:450px}.lock-icon{width:82px;height:82px;margin-bottom:25px;background:#d9b66f0f;font-size:27px}.host-form{width:min(100%,360px);margin-top:22px}.host-form input{text-align:center;font-size:25px;letter-spacing:.5em}.text-button{margin-top:20px;color:#918797;background:transparent;border:0;font-size:11px}.danger{color:#b86f76}.results-stage{padding:30px 0 70px}.results-header{margin-bottom:25px;text-align:center}.results-header p:last-child{color:#8f8695;font-size:12px;line-height:1.7}.result-list{display:grid;gap:8px;margin-bottom:25px}.result-card{display:grid;grid-template-columns:38px 1fr auto;gap:12px;align-items:center;padding:14px;background:var(--surface);border:1px solid rgba(255,255,255,.07);border-left:2px solid var(--gold);border-radius:9px}.result-card.role-狼人{border-left-color:#b94b55}.order{color:#6f6675;font-size:12px}.result-card strong,.role-result b{display:block}.result-card small,.role-result em{display:block;margin-top:4px;color:#7d7483;font-size:9px;font-style:normal}.role-result{text-align:right}.role-result b{color:var(--gold-light);font-family:STSong,SimSun,serif}.role-狼人 .role-result b{color:#e28b91}.modal-backdrop{position:fixed;z-index:10;top:0;right:0;bottom:0;left:0;padding:20px;display:grid;place-items:center;background:#050408d1;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.modal{width:min(100%,390px);padding:25px;background:#1b1524;border:1px solid rgba(255,255,255,.1);border-radius:16px;box-shadow:0 25px 80px #0009}.modal p:not(.eyebrow){color:#968d9d;font-size:12px;line-height:1.7}.modal-actions{display:grid;grid-template-columns:1fr 1.3fr;gap:8px;margin-top:20px}.modal-actions button{padding:12px 8px;color:#c4bbc9;background:#110d17;border:1px solid rgba(255,255,255,.09);border-radius:8px;font-size:11px}.modal-actions .danger-solid{color:#f4dcde;background:#7f3038;border-color:#9e3b45}@media(min-width:700px){.app-shell{padding-left:30px;padding-right:30px}.hero{padding-top:48px}.result-list{grid-template-columns:1fr 1fr}}