/* Fælles opgavedesign for måltavler, dart og grubleopgaver. */
body{margin:0;min-height:100vh;color:#214b72;font-family:'Trebuchet MS',Arial,sans-serif;background:radial-gradient(ellipse at 12% 15%,#fff9,transparent 35%),linear-gradient(145deg,#b8e9fc,#e4f5ed 65%,#fff1d6);text-align:left}
main.dart-page,main.page,main.brain-page{width:100%;max-width:1150px;padding:24px;margin:auto;text-align:center}
.brain-nav{text-align:left;font-size:14px;flex-wrap:wrap}.brain-nav span{font-size:11px;letter-spacing:1px;background:#fff9;border-radius:30px;padding:9px 14px}
.brain-header{margin:30px 0 25px}.brain-header h1{color:#214b72;font-size:clamp(30px,5vw,50px);letter-spacing:-1.5px;margin:8px 0}.brain-header p{max-width:650px;margin:12px auto;color:#477b8f;font-size:17px}
button{font:inherit;font-weight:bold;margin:0;padding:12px 18px;min-height:44px;border:2px solid white;border-radius:14px;background:#ffffffc9;color:#214b72;box-shadow:0 4px 12px #24567e12;cursor:pointer}button:hover{background:#e8edff;color:#214b72}button:focus-visible,a:focus-visible{outline:3px solid #5369d7;outline-offset:3px}
.button-container,#controls{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:22px 0 10px}.button-container button:last-child,#controls button:first-child{background:#c8eacb;border-color:#70a77d;color:#285e3c}
.game-layout{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:24px;align-items:start;margin-top:20px}
.dartboard-wrap{border:3px solid white;border-radius:24px;background:linear-gradient(180deg,#fafdff,#eefaff);box-shadow:0 18px 38px #24567e18;margin:auto}
.side-panel,.setup-panel,.scale-card,.answer-panel,.controls,#table-selection{border:3px solid white;border-radius:24px;background:#ffffffdc;box-shadow:0 18px 38px #24567e18;padding:22px}
.side-panel{min-width:0;gap:14px;width:100%;text-align:center}
.target-score{display:inline-block;border:2px solid white;background:#e9edff;color:#354ea6;border-radius:18px;font-size:clamp(20px,3vw,28px);padding:14px 22px;margin:0 0 8px}
.current-score,.current-average,.remaining-score,.dart-count,.darts-left{font-size:22px;color:#214b72;line-height:1.5}
.dart,.throw,.scoreboard{border-color:#c1d8e5;border-radius:13px;color:#214b72}.dart.used{background:#e3f7e8}
.turn-banner{border-radius:14px;margin:12px 0;color:#214b72;background:#fff9;padding:12px}
.rules-button{z-index:2;font-size:13px;padding:7px 12px;min-height:36px;border-radius:12px}
.rules-box{max-height:85vh;overflow:auto;border:3px solid white;border-radius:24px;color:#214b72;padding:24px;max-width:calc(100vw - 30px)}
#message{font-size:18px;min-height:26px;color:#214b72}.progress-indicator{flex-wrap:wrap;gap:7px}.progress-dot{width:15px;height:15px}
.setup-panel{max-width:700px;margin:auto}.name-fields input,select,input[type=number]{font:inherit;color:#214b72;border:2px solid #b5cddd;border-radius:11px;background:white;padding:10px;max-width:100%;min-width:0}select{margin:10px}.setup-panel button{background:#5369d7;color:white}.name-fields{gap:12px}
.scales{gap:20px}.scale-card{padding:20px}.scale{grid-template-columns:minmax(0,1fr) 70px minmax(0,1fr);gap:10px}.pan{border-color:#81a9bd;background:#f0f8fc}.answer-panel{margin-top:22px;gap:16px}.answer-card{border-color:#c1d8e5;border-radius:16px;background:#f3f9fc}.answer-card input{width:110px}
#table-selection{gap:9px;margin:0 auto 24px;max-width:750px}#table-selection button{width:48px;height:48px;background:#e9edff;border:2px solid white;color:#214b72;border-radius:14px}#table-selection button.selected{background:#5369d7;color:white;box-shadow:0 0 0 2px #5369d7}
#grid{width:min(100%,650px);grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;margin:20px auto;padding:22px;border:3px solid white;border-radius:26px;background:#ffffffdc;box-shadow:0 18px 38px #24567e18}#grid .circle{width:100%;height:auto;aspect-ratio:1;min-width:0;background:#fff2ce;border:2px solid #e8d397;color:#214b72;font-size:clamp(14px,3vw,23px)}
#congratulations,#oops{position:fixed;top:45%;padding:20px;font-size:clamp(26px,6vw,46px);max-width:90vw;text-shadow:none;background:#214b72ee;border:3px solid white;border-radius:24px}
.controls{gap:12px;margin-bottom:22px}.controls label{margin:0;border:0;gap:8px;background:#eff7fb;border-radius:12px}.controls input{width:64px}.controls button{background:#e9edff;color:#214b72}#checkBtn{background:#5369d7;color:white}#newBtn{background:#c8eacb;color:#285e3c}
#wrap{border:3px solid white;border-radius:24px;background:#ffffffdc;padding:20px;box-shadow:0 18px 38px #24567e18;text-align:left}#board{max-width:none}.fo-input input{font:700 18px 'Trebuchet MS',sans-serif;color:#214b72;padding:0;border-radius:0}#wrap:focus-visible{outline:3px solid #5369d7;outline-offset:3px}
@media(max-width:760px){main.dart-page,main.page,main.brain-page{padding:14px}.game-layout{grid-template-columns:1fr;gap:18px}.brain-nav{font-size:12px}.brain-header p{font-size:15px}.side-panel,.setup-panel,.scale-card,.answer-panel,.controls{padding:16px}.dartboard-wrap{width:100%}.scale{grid-template-columns:minmax(0,1fr) 42px minmax(0,1fr);gap:5px}.pan{padding:7px;gap:5px}.answer-panel{display:flex;flex-wrap:wrap;justify-content:center}.answer-card{flex:1 1 120px}#grid{padding:12px;gap:7px}.name-fields{grid-template-columns:1fr}.rules-box{padding:18px}}
@media(max-width:420px){.dartboard-wrap .dartboard{width:calc(100vw - 62px);height:calc(100vw - 62px)}.dartboard-wrap{height:calc(100vw - 36px)}.scale .shape{transform:scale(.8)}#table-selection{padding:12px;gap:7px}#table-selection button{width:40px;height:44px}.brain-nav span{display:none}}
.dartboard-wrap{height:auto;aspect-ratio:1}.dartboard-wrap .dartboard{width:84%;height:auto;aspect-ratio:1}
.setup-panel.hidden,.button-container.hidden{display:none}
.brain-header h1.hidden{display:block}.remaining-score{background:#e2f3fa;border-radius:14px;padding:12px 16px}
.brain-scroll-tip{font-size:14px;color:#477b8f;text-align:left;margin:12px 4px}
.button-container button[onclick^="checkAnswers"]{background:#5369d7;color:white}.button-container button[onclick^="newPuzzle"]{background:#c8eacb;color:#285e3c}
@media(max-width:760px){.scale .stand{display:grid;height:140px}.scale .pivot{border-left-width:17px;border-right-width:17px;border-bottom-width:65px}.scale .beam{display:block;width:100%;max-width:100%;height:5px}.scale .pan{min-height:110px}.scale .symbol{width:25px;height:25px}.scale .symbol.triangle{width:0;height:0;border-left-width:14px;border-right-width:14px;border-bottom-width:25px}.scale .weight{font-size:16px;min-width:32px;height:34px;padding:0 4px}}
@media print{body{background:white}main.brain-page{padding:0}.brain-nav,.brain-header p,.brain-header .eyebrow,.controls{display:none}#wrap{border:0;box-shadow:none;padding:0}#board{max-width:100%}}
