:root{font-family:system-ui,sans-serif;color:#193a46;background:#edf3f4;font-size:14px}*{box-sizing:border-box}body{margin:0;height:100dvh;display:flex;flex-direction:column;overflow:hidden}header,.toolbar,.mobile-tabs{flex-shrink:0}header{display:flex;align-items:center;gap:24px;background:white;padding:15px 24px;border-bottom:1px solid #d5e0e4}header div{flex:1}h1{font-size:25px;margin:3px 0}h2{font-size:19px;margin:0 0 14px}h3{font-size:15px}a{color:#087b78}button,input,select{font:inherit}button{cursor:pointer;border:1px solid #bdd1d6;background:white;color:#254c59;padding:10px 12px;border-radius:8px}button:hover{background:#e7f2f0}button:disabled{opacity:.48;cursor:default}.primary{background:#087b78;color:white;border-color:#087b78}.primary:hover{background:#086861}.toolbar{display:flex;align-items:center;gap:10px;padding:10px 24px;background:#fff;border-bottom:1px solid #d5e0e4;flex-wrap:wrap}.toolbar label{display:flex;gap:8px;align-items:center;margin:0}.toolbar select{width:auto;margin:0}.toolbar strong{margin-left:auto;font-variant-numeric:tabular-nums}main{display:grid;grid-template-columns:275px minmax(360px,1fr) 285px;gap:14px;padding:14px;flex:1;min-height:0}aside,section{min-height:0;min-width:0;background:white;border-radius:14px;padding:18px;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable}label{display:block;margin:16px 0;line-height:1.5}input:not([type=checkbox]),select{width:100%;margin-top:6px;padding:8px;border:1px solid #c4d5d9;border-radius:7px;background:white}input[type=range]{padding:0;accent-color:#087b78}output{display:block;font-weight:700;color:#087b78;margin-top:4px}p{line-height:1.6}.hint,#machine-note,details{font-size:12px;color:#516b77}.check{display:flex;gap:8px;align-items:flex-start}#machine-list h3{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:#65808c;margin:24px 0 9px}.machine-option{display:flex;width:100%;align-items:center;text-align:left;gap:10px;margin-bottom:8px;flex-shrink:0;padding:8px}.machine-option[aria-pressed=true]{border:2px solid #087b78;background:#eaf5f2;padding:7px}.machine-option svg{width:66px;flex:0 0 66px;height:46px;background:#152c3b;border-radius:6px}.machine-option span{min-width:0;line-height:1.4;font-weight:650;font-size:12px}.machine-option small{display:block;color:#647b85;font-weight:400;margin-top:4px;font-size:11px}.machine-heading{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.eyebrow{font-size:10px;letter-spacing:.12em;color:#60818b;font-weight:700}.badge{font-size:11px;background:#edf4f2;padding:6px 9px;border-radius:20px;white-space:nowrap}.machine-scene{background:#152c3b;border-radius:18px;overflow:hidden}.machine-scene svg{width:100%;display:block;min-height:270px}.specs{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px}.specs div{background:#f0f5f6;border-radius:8px;padding:10px;font-size:11px}.specs strong{display:block;font-size:16px;color:#284d5a;margin-top:5px}.notice{background:#fff4dd;border-left:3px solid #d8a04d;padding:10px 13px;font-size:12px;min-height:45px}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.cards div{border:1px solid #d5e6e3;border-radius:9px;padding:12px;font-size:11px}.cards strong{display:block;color:#087b78;font-size:21px;margin-top:6px}canvas{width:100%;background:#f6f9f9;border-radius:10px}.plot-heading{display:flex;justify-content:space-between;gap:12px;align-items:center}.plot-heading span{font-size:10px;color:#68818a}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;font-size:11px}td,th{padding:9px;border-bottom:1px solid #deeaec;text-align:right}caption{text-align:left;margin:15px 0}details{margin-top:20px}summary{cursor:pointer;font-weight:600}#journal{padding-left:18px;font-size:11px}#journal li{line-height:1.6;padding-bottom:10px}#balance{font-size:12px}.mobile-tabs{display:none}.running .rotor{animation:spin 1.5s linear infinite;transform-box:view-box}.running .counter-rotor{animation:counter 1.5s linear infinite;transform-box:view-box}.running .jaw-motion{animation:jaw .7s ease-in-out infinite alternate;transform-box:view-box}.running .gyration{animation:gyration .8s ease-in-out infinite alternate}.running .falling{animation:fall 1.4s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@keyframes counter{to{transform:rotate(-360deg)}}@keyframes jaw{to{transform:rotate(3deg)}}@keyframes gyration{to{transform:translateX(7px)}}@keyframes fall{to{transform:translateY(50px);opacity:0}}@media(prefers-reduced-motion:reduce){.running svg *{animation:none!important}}@media(min-width:1500px){main{grid-template-columns:300px minmax(600px,1fr) 310px}}@media(max-width:1100px){main{grid-template-columns:230px minmax(340px,1fr)}#controls{grid-column:1/-1;max-height:65vh}main{overflow:auto;height:auto}#machines,#workspace{height:75vh}.toolbar{padding:10px 14px}.specs{grid-template-columns:1fr 1fr}}@media(max-width:700px){header{padding:12px;gap:10px}header>a{font-size:11px}h1{font-size:19px}header>button{font-size:11px}.toolbar button{font-size:12px;padding:8px}.toolbar strong{font-size:12px}.mobile-tabs{display:flex;padding:8px 14px;gap:8px}.mobile-tabs button{flex:1}main{display:block;padding-top:0;height:calc(100dvh - 240px);min-height:0}main>aside,main>section{display:none;height:100%;max-height:none}body[data-panel=machines] #machines,body[data-panel=workspace] #workspace,body[data-panel=controls] #controls{display:block}.machine-scene svg{min-height:230px}.cards strong{font-size:17px}.specs{grid-template-columns:1fr 1fr}.plot-heading{display:block}.badge{white-space:normal}}
