:root{font-family:system-ui,-apple-system,sans-serif;color:#183c2b;background:#edf3ef;font-synthesis:none}*{box-sizing:border-box}body{margin:0}header{max-width:1120px;margin:auto;padding:25px;display:flex;justify-content:space-between;align-items:center}.brand{font-size:27px;font-weight:800;letter-spacing:-1px;text-decoration:none;color:inherit}.brand small{display:block;font-size:10px;letter-spacing:3px}main{max-width:1070px;margin:20px auto;padding:0 24px 45px}h1{font-size:clamp(32px,6vw,56px);line-height:1.08;letter-spacing:-1.5px}h2{font-size:25px}p{line-height:1.65}.kicker{font-size:12px;letter-spacing:2px;font-weight:700}.grid{display:grid;grid-template-columns:1.5fr 1fr;gap:24px}.card{background:#fff;border-radius:20px;padding:25px;box-shadow:0 8px 28px #123c2610}.poster{border-radius:15px;background:#d6ef80;padding:35px;color:#16351d;position:relative;overflow:hidden}.poster h2{font-size:clamp(40px,8vw,70px);line-height:.98;letter-spacing:2px;margin:24px 0}.poster:after{content:'?';position:absolute;right:20px;bottom:-20px;font-size:170px;opacity:.12;font-weight:900}button{background:#22543a;color:white;border:0;border-radius:10px;padding:12px 18px;font:600 15px system-ui;cursor:pointer;min-height:44px}button:hover{filter:brightness(1.1)}button:disabled{opacity:.5;cursor:default}button.secondary{background:#dfeae3;color:#224733}button.danger{background:#893d38}input,select{font:16px system-ui;width:100%;border:1px solid #b2c5b9;padding:12px;border-radius:9px;margin:7px 0 16px;background:white;color:#183c2b}label{font-size:14px;font-weight:600}small,.muted{color:#526c5d}.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.row>*{flex-shrink:0}.row input{width:auto;flex:1;min-width:110px;margin:0}.player{display:flex;align-items:center;justify-content:space-between;padding:12px 0;border-bottom:1px solid #e0e8e3;gap:10px}.dead{opacity:.55}.badge{padding:5px 10px;border-radius:30px;background:#e6efdf;font-size:12px}.roles{display:grid;grid-template-columns:1fr 1fr;gap:10px}.roles input{margin:4px 0}.times{display:grid;grid-template-columns:1fr 1fr;gap:12px}.status{background:#22543a;color:white;padding:20px 25px;border-radius:17px;margin-bottom:20px;display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap}.status small{color:#d6ef80}.status h2{margin:5px 0}.secret{background:#eef4e4;border-radius:12px;padding:18px;margin:16px 0}.chat{max-height:310px;overflow:auto;margin-bottom:18px}.msg{padding:10px 0;border-bottom:1px solid #e6ede8;overflow-wrap:anywhere}.msg strong{font-size:13px}.log{max-height:230px;overflow:auto;font-size:14px}.log p{margin:8px 0}.wide{width:100%;margin-top:10px}.note{padding:14px;background:#f5f1da;border-radius:10px;font-size:14px}.cover{text-align:center;padding:60px 20px}.cover h2{font-size:32px}#error{max-width:1020px;margin:0 auto 20px;color:#9b2626;padding:0 25px}dialog{border:0;border-radius:20px;max-width:720px;width:calc(100% - 32px);max-height:85vh;overflow:auto;padding:25px;color:#183c2b}dialog::backdrop{background:#102a22aa}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #859e37;outline-offset:3px}@media(max-width:720px){.grid{grid-template-columns:1fr}main{padding:0 16px 30px}header{padding:20px 16px}.card{padding:20px}.roles{grid-template-columns:1fr 1fr}h1{margin-top:15px}.poster h2{font-size:50px}}
/* RwYouth v1.1 · Game club */
.game-shell{--game-bg:#edf3ef;--game-panel:#fff;--game-ink:#193d2b;--game-muted:#526b5b;--game-edge:#d7e3db;background:var(--game-bg);color:var(--game-ink);padding:20px;border-radius:20px}.game-shell.night{--game-bg:#14261f;--game-panel:#20372c;--game-ink:#edf6ee;--game-muted:#b6cabb;--game-edge:#3b5345}.game-top{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:20px}.game-shell .badge{background:var(--game-panel);color:var(--game-ink)}.game-status{background:#294934;color:#f2f9ed}.game-status p{margin:8px 0;font-size:14px}.game-status h2{font-size:26px}.game-clock{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:110px;gap:4px}.game-clock strong{font-size:32px;font-variant-numeric:tabular-nums}.game-clock>span{font-size:23px}.game-clock small{color:#d9e7d4;font-size:11px}.game-layout{display:grid;grid-template-columns:270px minmax(0,1fr);gap:20px}.role-card{background:var(--game-panel);padding:20px;border-radius:16px;text-align:center}.role-heading{display:flex;justify-content:space-between;gap:12px;color:var(--game-muted);font-size:11px;letter-spacing:.5px}.role-emblem{margin:22px auto 14px;display:grid;place-items:center;width:75px;height:85px;border:1px solid var(--game-edge);border-radius:32px 32px 16px 16px;color:#9aba63;background:var(--game-bg);font-size:38px}.role-card h2{font-size:23px}.role-card p{font-size:14px}.game-shell .secondary{background:var(--game-bg);color:var(--game-ink);border:1px solid var(--game-edge)}.game-hint{padding:14px;font-size:13px;background:var(--game-panel);border-radius:10px;color:var(--game-muted);overflow-wrap:anywhere}.private-result{padding-top:12px;border-top:1px solid var(--game-edge);text-align:left}.game-content{background:var(--game-panel);border-radius:16px;padding:22px;min-width:0}.game-tabs{display:flex;gap:5px;border-bottom:1px solid var(--game-edge);padding-bottom:12px;margin-bottom:22px}.game-tabs button{flex:1;padding:10px 6px;font-size:14px;background:transparent;color:var(--game-muted);min-width:0}.game-tabs button[aria-selected=true]{background:var(--game-bg);color:var(--game-ink)}.people-heading{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:15px}.people-heading h3{margin:0}.game-shell small{color:var(--game-muted)}.game-status small{color:#d6ef80}.target-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.target-card{position:relative;display:flex;flex-direction:column;align-items:center;gap:7px;background:var(--game-bg);color:var(--game-ink);border:2px solid transparent;padding:17px 8px;min-width:0}.target-card strong{font-size:15px;overflow-wrap:anywhere}.target-card small{font-size:11px;overflow-wrap:anywhere}.target-card:disabled{filter:none;opacity:1;cursor:default}.target-card.dead{opacity:.5}.target-card[data-target][aria-pressed=true]{border-color:#a9cf60;background:#324c2b;color:#eff9e9}.target-card[aria-pressed=true] small{color:#d4e9c4}.target-card .avatar{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:var(--game-panel);color:var(--game-ink);font-size:15px}.target-check{display:none;position:absolute;right:9px;top:5px;color:#d6ef80}.target-card[aria-pressed=true] .target-check{display:block}.target-card:disabled:not(.dead):not([aria-pressed=true]) small{opacity:.8}.action-area{margin-top:20px;padding-top:15px;border-top:1px solid var(--game-edge)}.action-area p{color:var(--game-muted);font-size:14px}.game-shell button:not(.secondary):not(.danger):not(.target-card):not([role=tab]){background:#d6ef80;color:#1b3723}.pilate-buttons{display:flex;gap:8px;flex-wrap:wrap}.pilate-buttons button{flex:1;min-width:140px}.game-shell input{background:var(--game-bg);color:var(--game-ink);border-color:var(--game-edge)}.game-shell .msg{border-color:var(--game-edge)}.game-shell .muted{color:var(--game-muted)}.game-events p{border-left:2px solid var(--game-edge);padding:10px 15px;margin:10px 0;font-size:14px}.end-banner{background:var(--game-panel);padding:25px;border-radius:16px;text-align:center;margin-bottom:20px}.end-symbol{font-size:42px;color:#8ba64c}.phase-notice{background:#d6ef80;color:#1b3723;padding:16px 22px;border-radius:12px;margin-bottom:15px;font-weight:600;text-align:center}[hidden]{display:none!important}@media(max-width:760px){.game-layout{grid-template-columns:1fr}.game-shell{padding:12px}.game-content{padding:17px}.role-card{padding:15px}.role-emblem{width:55px;height:65px;margin:15px auto 8px;font-size:30px}.game-status h2{font-size:22px}.game-status{padding:18px}.game-clock{min-width:85px}.game-clock strong{font-size:27px}.target-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.game-tabs button{font-size:13px}.role-card #roleBack p{margin:5px 0}.role-card h2{margin:8px 0}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}
/* v1.2 · Thẻ vai + bàn chơi + hội thoại */
main:has(.table-layout),header{max-width:1380px}.table-layout{grid-template-columns:230px minmax(0,1.3fr) minmax(290px,1fr);gap:16px;align-items:start}.table-layout .game-content{padding:20px}.table-layout .target-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.table-layout .role-card{padding:18px}.role-collapse summary{display:none}.game-conversation{background:var(--game-panel);padding:20px;border-radius:16px;min-width:0}.conversation-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid var(--game-edge);padding-bottom:13px;margin-bottom:12px}.conversation-heading small{font-size:10px;letter-spacing:1px}.conversation-heading h3{font-size:19px;margin:6px 0 0}.conversation-heading .badge{font-size:10px}.conversation-feed{max-height:470px;overflow-y:auto;overflow-wrap:anywhere;scrollbar-width:thin;overscroll-behavior:contain}.feed-event{display:flex;gap:9px;background:var(--game-bg);border-radius:10px;padding:11px;margin:12px 0;color:var(--game-muted)}.event-dot{color:#91b452;flex-shrink:0}.feed-event small{font-size:10px;letter-spacing:.5px}.feed-event p{font-size:12px;margin:3px 0;line-height:1.55}.feed-message{display:flex;gap:10px;margin:15px 0}.mini-avatar{display:grid;place-items:center;width:30px;height:30px;background:var(--game-bg);border-radius:50%;font-size:10px;flex-shrink:0}.feed-message strong{font-size:12px}.feed-message small{font-size:10px;margin-left:8px}.feed-message p{font-size:13px;margin:4px 0;line-height:1.6}.chat-form{margin-top:15px;padding-top:13px;border-top:1px solid var(--game-edge)}.chat-form label{font-size:11px;color:var(--game-muted)}.chat-form>div{display:flex;gap:8px;align-items:center;margin-top:6px}.chat-form input{min-width:0;margin:0;width:100%;padding:11px}.chat-form button{flex-shrink:0}.end-banner{display:flex;gap:14px;align-items:center;justify-content:space-between;flex-wrap:wrap;text-align:left;padding:18px 20px}.end-banner .end-symbol{display:none}.end-banner h2{font-size:21px;margin:0}.end-banner p{font-size:13px;margin:0;flex:1;min-width:200px}.end-banner button{font-size:13px}.game-reveal{margin-top:20px;padding:24px;background:var(--game-panel);border-radius:16px}.game-reveal h2{font-size:23px}.revealed-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.revealed-person{display:flex;gap:10px;align-items:center;background:var(--game-bg);border-radius:12px;padding:14px;min-width:0}.revealed-person .avatar{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--game-panel);flex-shrink:0;font-size:12px}.revealed-person strong,.revealed-person span,.revealed-person small{display:block;overflow-wrap:anywhere}.revealed-person strong{font-size:14px}.revealed-person span{font-size:13px}.revealed-person small{font-size:11px;margin-top:4px}.game-story{max-width:900px}.game-story h3{font-size:18px;border-top:1px solid var(--game-edge);padding-top:18px;margin-top:25px}.game-story p{font-size:14px;line-height:1.7;margin:10px 0;padding-left:13px;border-left:2px solid var(--game-edge)}@media(max-width:1100px){.table-layout{grid-template-columns:190px minmax(0,1fr)}.game-conversation{grid-column:2}.role-aside{grid-row:span 2}.revealed-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:760px){.table-layout{grid-template-columns:1fr}.role-aside{grid-row:auto}.game-conversation{grid-column:auto}.role-collapse summary{display:block;font-size:13px;padding:12px;background:var(--game-panel);border-radius:10px;min-height:44px}.role-collapse[open] summary{border-radius:10px 10px 0 0}.table-layout .target-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.conversation-feed{max-height:350px}.game-conversation{padding:17px}.revealed-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.game-reveal{padding:17px}.revealed-person{padding:10px}.revealed-person .avatar{display:none}}