*{box-sizing:border-box}body{margin:0;background:#f2f5f8;color:#172f43;font:16px/1.6 system-ui,sans-serif}header{background:#173b50;color:white;padding:28px max(24px,calc((100vw - 1220px)/2))}header span{font-size:13px;color:#b9dce7}h1{margin:5px 0;font-size:30px}header p{margin:0}main{max-width:1268px;margin:auto;padding:24px;display:grid;grid-template-columns:420px 1fr;gap:22px}section{background:white;border:1px solid #dce5eb;border-radius:14px;padding:24px}h2{font-size:18px;margin:22px 0 10px}h2:first-child{margin-top:0}label{display:block;font-size:14px}input:not([type=radio]),select{width:100%;padding:10px;border:1px solid #a8b9c5;border-radius:6px;font:inherit;background:white}input[type=range]{padding:5px 0}input[type=radio]{accent-color:#147c82}button{border:0;border-radius:6px;background:#087c80;color:white;padding:11px 16px;font:600 14px system-ui;cursor:pointer;white-space:nowrap}button:disabled{opacity:.45;cursor:default}button.secondary{background:#eaf0f4;color:#24475d}button:focus-visible,a:focus-visible{outline:3px solid #e9a624;outline-offset:3px}.row{display:flex;gap:10px;margin:10px 0}.row>*{min-width:0}.row label{flex:1}.note,p[role=status]{font-size:13px;color:#526b7a}.reading{display:flex;align-items:baseline;gap:10px;padding:12px 18px;background:#edf7f6;border-radius:8px;margin:18px 0}.reading strong{font-size:38px}.reading b{margin-left:auto;color:#087c80}.gameTop{display:flex;justify-content:space-between;gap:10px;align-items:baseline}.gameTop a{font-size:13px}a{color:#08777f}.game iframe{width:100%;height:510px;border:0;background:#eaf0f4;border-radius:10px}.game p{font-size:14px}.pad{display:flex;justify-content:center;gap:10px}.pad button{touch-action:none;min-width:44px}.instructions{grid-column:1/-1}.instructions p,.instructions li{font-size:14px}summary{cursor:pointer;font-weight:600}code{background:#edf1f3;padding:3px 6px}@media(max-width:900px){main{grid-template-columns:1fr;padding:14px}.game{grid-row:1}.game iframe{height:400px}header{padding:22px}h1{font-size:25px}}

.rule{border:1px solid #ccdae2;border-radius:9px;padding:14px;margin:16px 0}.rule legend{font-weight:600;font-size:14px}.rule .row{align-items:end}.rule .assignments{flex-wrap:wrap}.assignments label{min-width:95px}.ruleValue{font-size:14px;margin:14px 0 8px}.ruleError{color:#a43120;font-size:12px}.rule input[type=checkbox]{width:auto;accent-color:#087c80}.testControl{background:#edf7f6;padding:10px;border-radius:6px}.remove{padding:10px}.game{align-self:start;position:sticky;top:16px}@media(max-width:900px){.game{position:static}}

/* Game first, with controller settings below it. */
header{padding:16px max(24px,calc((100vw - 1440px)/2))}header span,header p{display:none}h1{font-size:25px}
main{max-width:1488px;display:flex;flex-direction:column;gap:18px}.loader{padding:16px 24px}.loader h2{margin-bottom:6px}.loader .row input{flex:1}.loader #sample{margin-right:12px}.loader #gameStatus{display:inline}
.game{position:static;width:100%;padding:20px}.game iframe{display:block;height:75vh;min-height:360px;max-height:960px}.gameTop{margin-bottom:10px}.pad{margin-top:14px}
.settings{width:100%}#rules{display:grid;grid-template-columns:repeat(auto-fit,minmax(330px,1fr));gap:16px}.rule{min-width:0;margin:0}.settings>.row{max-width:640px}.settings .reading{max-width:640px}
@media(max-width:600px){header{padding:12px 16px}h1{font-size:21px}main{padding:10px}.loader,.settings{padding:16px}.game{padding:10px}.game iframe{height:65vh;min-height:280px}#rules{grid-template-columns:1fr}.loader #gameStatus{display:block}.gameTop{flex-wrap:wrap}.gameTop h2{margin-bottom:0}}

[hidden]{display:none!important}.settings>.row{max-width:none;flex-wrap:wrap}.tm-layout{display:flex;gap:24px;flex-wrap:wrap;margin-top:20px}#tm-preview{width:300px;max-width:100%;background:#eaf0f4;border-radius:8px}#tm-classes{flex:1;min-width:240px}.tm-class{display:grid;grid-template-columns:minmax(80px,1fr) 90px minmax(60px,1fr) 50px;gap:12px;align-items:center;margin-bottom:12px}.tm-class progress{width:100%;accent-color:#087c80}#tm-url{flex:1}#tm-panel>.row{flex-wrap:wrap}