*{box-sizing:border-box}body{margin:0;background:#081322;color:#e9f4ff;font:17px/1.65 system-ui,Segoe UI,sans-serif}a{color:#80e7df}h1,h2,h3{line-height:1.25;color:#f7d68c}header,main,footer{max-width:1120px;margin:auto;padding:24px}header{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}header a{color:#f6d28b;text-decoration:none}.hero{display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:24px}.hero img{width:100%;border-radius:20px;border:1px solid #806b42}.eyebrow{color:#75e3dc;letter-spacing:.08em;text-transform:uppercase;font-size:.8rem}.card{background:#10243a;border:1px solid #2c5365;border-radius:16px;padding:20px;margin:18px 0}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(235px,1fr));gap:15px}.btn,button,select,input{font:inherit}button,.btn{display:inline-block;cursor:pointer;border:1px solid #dfb967;border-radius:10px;padding:9px 15px;background:#d5a953;color:#102032;font-weight:700;text-decoration:none;margin:5px 5px 5px 0}button.secondary,.btn.secondary{background:#153b50;color:#ddfaff;border-color:#4b8c98}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #76efe4}input,select{max-width:100%;padding:9px;background:#0b1c2d;color:white;border:1px solid #668fa4;border-radius:9px}input[type=number]{width:90px}.muted{color:#b7cbd9}.good{color:#8df0b3}.bad{color:#ffb0a5}.steps{display:flex;flex-wrap:wrap;gap:10px}.step{padding:10px 14px;background:#18334b;border:1px solid #43617c;border-radius:10px;min-width:90px;text-align:center}.step small{display:block;color:#a7ced8}.diagram{display:grid;grid-template-columns:1fr .75fr 1fr;gap:12px;text-align:center}.station{border:1px solid #628aa4;border-radius:14px;background:#142d46;padding:15px}.eve{border-color:#d38376}.arrow{color:#78e3ee;font-size:1.2rem}.output{background:#06111f;border-left:4px solid #6ad4cf;padding:13px;white-space:pre-wrap;min-height:48px;border-radius:8px;overflow-wrap:anywhere}.drop{border:2px dashed #78a4b6;min-height:65px;padding:12px;border-radius:10px}.chip{display:inline-block;padding:6px 11px;margin:4px;background:#2d5164;color:white;border:1px solid #8bc3cb;border-radius:9px;cursor:grab}.chip.selected{outline:3px solid #eec778}.pill{padding:4px 10px;border:1px solid #56748c;border-radius:20px;display:inline-block;margin:3px}code{color:#9de8d8}table{border-collapse:collapse;width:100%}td,th{border:1px solid #416075;padding:7px}footer{color:#a8c1ce}@media(max-width:750px){.hero{grid-template-columns:1fr}.diagram{grid-template-columns:1fr}header,main,footer{padding:16px}}@media print{body{background:white;color:black}.card{background:white;color:black}button,.btn,header{display:none}h1,h2,h3{color:black}}
.drop{min-height:65px;border:2px dashed #e3bd63;border-radius:12px;padding:12px;margin:10px 0;display:flex;gap:8px;flex-wrap:wrap}.chip{cursor:grab;background:#203f60;color:#fff;border:1px solid #dfbb67;border-radius:9px;padding:10px 13px;display:inline-block;touch-action:manipulation}.chip.selected{outline:3px solid #63e9db}.good{color:#80e9b4}.bad{color:#ffaaaa}.small{font-size:.9rem}.output{white-space:pre-wrap;line-height:1.7}input,select{max-width:100%;padding:10px;border-radius:8px}button{cursor:pointer}.hero img{object-fit:cover} .flow{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.flow span{border:1px solid #a98b4b;border-radius:10px;padding:10px}.pill{display:inline-block;padding:5px 10px;background:#193d4b;border-radius:8px;margin:4px}