/* One set of quiet input cards is shared by the welcome and controls panels. */
header{z-index:6}
.header-controls{display:flex;align-items:center;gap:12px;pointer-events:auto}
#tiltMenu{border:0;background:none;box-shadow:none;padding:0;width:58px;height:58px;border-radius:50%;touch-action:manipulation}
#tiltIndicator{display:block;width:58px;height:58px}
#panel{z-index:7;top:calc(96px + env(safe-area-inset-top));max-height:calc(100dvh - 180px - env(safe-area-inset-top));width:360px}
.brand #levelButton{min-height:40px;position:relative;z-index:1}
.intro{width:340px;max-height:calc(100dvh - 210px);overflow:auto;scrollbar-width:thin}
.intro h2{font-size:30px}
.input-heading{font-size:24px;font-weight:400;letter-spacing:-.4px;margin:22px 0 13px}
#panel .panel-heading{position:sticky;top:-23px;padding:6px 0 10px;background:#f5f3e8;z-index:2}
body.alpine #panel .panel-heading{background:#f0f5f7}
body.toy #panel .panel-heading{background:#faf1f5}
.input-picker{border-radius:13px;scroll-margin-top:12px}
.input-picker .input-summary{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;min-height:48px;margin:0 0 9px;padding:12px;border:1px solid #51634938;border-radius:10px;background:#fff8;color:#344b36;font:13px Arial;text-align:left}
.input-summary span,.input-choice span{float:none!important}
.input-change{font-size:10px;color:#6a7563;white-space:nowrap}
#introInputs>.input-summary{display:none}
.input-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.input-picker .input-choice{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:8px;width:100%;min-height:104px;padding:13px 12px;margin:0;border:1px solid #5263462d;border-radius:12px;background:#fff9;color:#344b36;font:13px Arial;text-align:left;transition:background .2s,border-color .2s,box-shadow .2s}
.input-picker .input-choice:hover{background:#e9eddfe8;border-color:#6f82625c}
.input-picker .input-choice[aria-checked=true]{background:#e5ebd9;color:#2c442b;border-color:#61794e;box-shadow:inset 0 0 0 1px #61794e20}
.input-icon{display:flex;align-items:center;gap:5px;min-height:27px;font:23px/1.1 'Segoe UI Emoji','Apple Color Emoji',sans-serif}
.input-mini{display:block;width:27px;height:27px}
.input-copy{display:flex;flex-direction:column;gap:5px;min-width:0}
.input-copy strong{font-size:13px;font-weight:500}
.input-picker .input-copy small{display:block;font:10px/1.4 Arial;opacity:1;color:#68755f;margin:0}
.input-tick{position:absolute;right:10px;top:10px;font:12px Arial;color:#4c6742;opacity:0}
.input-choice[aria-checked=true] .input-tick{opacity:1}
#neutral{margin-top:10px;min-height:44px}
.field-chooser{min-height:44px;background:#e4eadbd9;text-align:left}
#panel .input-attention{animation:input-nudge 2.4s ease-out}
@keyframes input-nudge{0%,100%{box-shadow:0 0 0 0 #b19b5a00}25%,65%{box-shadow:0 0 0 5px #b19b5a36}}
body.alpine .input-picker .input-choice,body.alpine .input-picker .input-summary{background:#f9fcffb8;color:#345563;border-color:#52748438}
body.alpine .input-picker .input-choice[aria-checked=true]{background:#dceaf0;border-color:#668c9a;color:#284e60}
body.toy .input-picker .input-choice[aria-checked=true]{background:#eadfeb;border-color:#9a7ca0}
@media(max-width:600px){
 .header-controls{gap:8px;margin-top:-4px}
 #tiltMenu,#tiltIndicator{width:49px;height:49px}
 .intro{width:min(340px,calc(100vw - 40px));bottom:90px;top:auto;padding:21px}
 #panel{left:14px;right:14px;width:auto;padding:20px;top:calc(88px + env(safe-area-inset-top));max-height:calc(100dvh - 158px - env(safe-area-inset-top))}
 .input-picker .input-choice{min-height:99px;padding:12px}
 .brand #levelButton{max-width:180px}
}
@media(max-height:600px){.intro{top:140px;bottom:auto;max-height:calc(100dvh - 205px);padding:18px}.intro h2{font-size:25px}.input-picker .input-choice{min-height:86px;padding:10px;gap:5px}}
@media(prefers-reduced-motion:reduce){#panel .input-attention{animation:none;outline:2px solid #b19b5a66;outline-offset:4px}}
