:root{color:#172a3d;background:#eef3f7;font-family:Inter,PingFang SC,Microsoft YaHei,system-ui,sans-serif}*{box-sizing:border-box}body{margin:0;min-height:100vh}button,input{font:inherit}button{cursor:pointer}[hidden]{display:none!important}.control-shell{width:min(560px,100%);min-height:100vh;margin:0 auto;padding:28px 18px 40px}.control-header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px}.control-kicker{color:#4d78a2;font-size:11px;font-weight:800;letter-spacing:.16em}h1{margin:7px 0 0;font-size:clamp(25px,7vw,34px);letter-spacing:0}h2{margin:0;font-size:20px}p{color:#6c7f90;font-size:14px;line-height:1.6}.state-pill{padding:7px 10px;border-radius:999px;color:#6d7b87;background:#e2e9ef;font-size:12px;font-weight:800;white-space:nowrap}.state-pill.is-active{color:#176a4a;background:#d8f2e6}.control-panel{padding:22px;border:1px solid #d7e1e8;border-radius:14px;background:#fff;box-shadow:0 14px 34px #28425814}.control-panel+.control-panel{margin-top:14px}.control-form{display:grid;gap:14px;margin-top:20px}label{display:grid;gap:7px;color:#496275;font-size:13px;font-weight:800}input{width:100%;height:46px;padding:0 13px;border:1px solid #cbd8e2;border-radius:9px;color:#172a3d;background:#fbfdff;outline:none}input:focus{border-color:#3979c9;box-shadow:0 0 0 3px #3979c926}.control-form button{height:46px;border:0;border-radius:9px;color:#fff;background:#286ec5;font-weight:800}.control-panel-heading{display:flex;justify-content:space-between;gap:12px;align-items:start}.control-panel-heading p{margin:8px 0 0}.quiet-button{min-height:34px;padding:0 12px;border:1px solid #cedae3;border-radius:8px;color:#496275;background:#fff;font-weight:700}.dice-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:18px}.dice-grid button{aspect-ratio:1;border:1px solid #cad8e4;border-radius:12px;color:#23435d;background:#f8fbfd;font-size:clamp(28px,10vw,44px);font-weight:900}.dice-grid button:hover,.dice-grid button.is-selected{border-color:#286ec5;color:#fff;background:#286ec5}.random-button{width:100%;height:44px;margin-top:12px;border:1px solid #c9d6df;border-radius:9px;color:#496275;background:#fff;font-weight:800}.control-message{min-height:22px;margin:13px 0 0;color:#557084;font-size:13px}.control-message.is-error{color:#b03f35}@media(max-width:420px){.control-shell{padding:20px 12px 30px}.control-panel{padding:17px}}