*{box-sizing:border-box}body{margin:0;background:#f7f8f5;color:#233b33;font-family:"Microsoft YaHei",system-ui,sans-serif}header{display:flex;align-items:center;gap:18px;padding:20px max(24px,calc((100vw - 1100px)/2));background:#ffffffc9;border-bottom:1px solid #e3e9e0;flex-wrap:wrap}a{color:inherit;text-decoration:none}.brand{display:flex;gap:10px;align-items:center;margin-right:auto;font-weight:650;white-space:nowrap}.brand img{width:44px;height:44px;object-fit:contain}main{max-width:1000px;margin:auto;padding:40px 24px}.intro{padding:25px 0 30px}.intro small,.room-head small{letter-spacing:2px;font-size:11px;color:#73877c}h1{font-size:clamp(32px,6vw,52px);letter-spacing:-2px;margin:16px 0}p{line-height:1.8;color:#65796f}h2{font-weight:550}.panel{padding:32px;background:white;border:1px solid #e3e9e0;border-radius:24px;box-shadow:0 12px 40px #233b3305}#auth,#lobby{max-width:560px}form label{display:block;color:#53685d;font-size:13px}input:not([type=checkbox]),select{font:inherit;border:1px solid #d8e0d8;border-radius:10px;background:#fafbf9;color:#233b33;padding:13px 14px;max-width:100%;outline-color:#719883}form label input{display:block;width:100%;margin:9px 0 22px}button{font:inherit;font-size:14px;cursor:pointer;border:1px solid #dce4da;background:#fff;color:#365746;padding:11px 17px;border-radius:24px}button:hover{background:#edf3eb}button:disabled{opacity:.4;cursor:default}.primary{background:#375b48;color:white;border-color:#375b48}.primary:hover{background:#244e36}.actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.hint{font-size:12px;color:#7c8e82;margin:22px 0 0}.join{border-top:1px solid #e9eee5;margin-top:30px;padding-top:24px}.join .actions{margin-top:12px}.join input{width:220px;text-transform:uppercase}.room-head{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:24px}.room-head h2{margin:8px 0;letter-spacing:3px}.players{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:18px}.player{padding:18px;background:#edf1e9;border-radius:16px;min-width:0;overflow-wrap:anywhere}.player strong{display:block;font-size:14px}.player small{display:block;margin-top:8px;color:#708275}.player.active{box-shadow:inset 0 0 0 2px #739b7a;background:#e7efdf}.table{text-align:center;min-height:260px;display:grid;place-items:center}.game-actions{justify-content:center;margin:20px 0}.card{width:94px;min-height:138px;border-radius:16px;display:inline-flex;align-items:center;justify-content:center;color:white;font-size:36px;font-weight:bold;border:5px solid #fff;box-shadow:0 5px 14px #233b3320;background:#3b4642;vertical-align:middle}.card.red{background:#bb534b}.card.blue{background:#5388ad}.card.green{background:#659275}.card.yellow{background:#d5ac48;color:#453d25}.card.wild{background:linear-gradient(140deg,#bb534b,#5388ad 35%,#659275 65%,#d5ac48)}button.card{cursor:pointer;padding:6px;font-size:28px;transition:transform .15s}button.card:not(:disabled):hover{transform:translateY(-7px)}button.card:disabled{opacity:.5}.hand{display:flex;gap:10px;overflow-x:auto;padding:24px 6px 18px}.hand .card{flex-shrink:0;width:78px;min-height:114px}.rules{margin:35px 0;color:#65796f;font-size:13px;max-width:760px}.rules summary{cursor:pointer}#notice{min-height:28px;color:#a34733;margin-top:0}#turn{color:#365746;font-size:18px;margin-top:0}footer{text-align:center;font-size:10px;letter-spacing:2px;color:#8c9b91;margin:50px 0}#account{font-size:13px}#chooseColor{font-size:13px}select{padding:8px}[hidden]{display:none!important}@media(max-width:600px){header{gap:10px;padding:16px}header a:not(.brand){font-size:12px}header button{font-size:12px;padding:8px 12px}main{padding:16px}.panel{padding:24px 18px}.players{grid-template-columns:repeat(2,1fr)}.intro{padding-top:16px}.join input{width:180px}.hand .card{width:68px;min-height:100px}}
