.tool-heading{display:flex;gap:18px;align-items:center;flex-wrap:wrap}.tool-heading h1{margin-bottom:0}.tool-heading .pill{margin-top:18px}.tool-lead{color:#b8c5d9;margin:12px 0 24px}.input-panel{background:#111926;border:1px solid #344059;border-radius:16px;overflow:hidden}.tool-bar{display:flex;gap:16px;flex-wrap:wrap;align-items:center;justify-content:space-between;background:#182234;padding:18px 22px}.tool-state{display:flex;align-items:center;gap:9px;font-weight:700}.tool-state:before{content:"";width:9px;height:9px;flex-shrink:0;border-radius:50%;background:#8092ad}.input-panel[data-state=active] .tool-state:before{background:#84ecb9}.tool-actions{display:flex;gap:10px;flex-wrap:wrap}.tool-actions button,.tool-select{min-height:48px;border-radius:9px;border:1px solid #516077;background:#202c42;color:#eef1f7;padding:10px 16px;font-family:inherit;font-size:15px;font-weight:600;cursor:pointer}.tool-actions button.primary{background:#ffba60;border-color:#ffba60;color:#192131}.tool-actions button:disabled{opacity:.45;cursor:default}.input-panel button:focus-visible,.tool-select:focus-visible,.key-surface:focus-visible{outline:3px solid #ffcc86;outline-offset:3px}.tool-empty{padding:36px 24px;text-align:center;max-width:650px;margin:auto}.tool-empty svg{width:120px;height:72px;color:#ffba60}.tool-empty h2{font-size:23px;margin:20px 0 12px}.tool-empty p{color:#aebed4;font-size:15px;line-height:1.7}.tool-empty .quiet{color:#8a9ab2;font-size:13px}.tool-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#344059;border-block:1px solid #344059}.tool-stats>div{background:#141e30;padding:14px 20px}.tool-stats small{display:block;color:#aab9cf;font-size:12px}.tool-stats b{font-size:23px;color:#f5f7fb;font-variant-numeric:tabular-nums}.tool-body{padding:20px 22px}.tool-notice{border-left:3px solid #ffba60;background:#1a2434;padding:13px 16px;color:#c8d3e3;font-size:14px}.tool-privacy{font-size:13px;color:#a9b8cb}.tool-select{max-width:100%;font-size:14px}.controller-meta{display:flex;gap:14px;flex-wrap:wrap;align-items:center;margin-bottom:20px}.controller-meta label{display:grid;gap:6px;max-width:100%;font-size:12px;color:#aab9cf}.controller-layout{display:grid;grid-template-columns:1.1fr 1fr;gap:24px}.controller-layout h3{margin:0 0 15px;font-size:16px}.controller-buttons{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.controller-button{border:1px solid #44516a;background:#1d283c;border-radius:10px;padding:9px 6px;text-align:center;position:relative;overflow:hidden}.controller-button span{position:relative;display:block;font-size:12px}.controller-button b{position:relative;display:block;font-variant-numeric:tabular-nums;font-size:17px;margin-top:3px}.controller-button i{position:absolute;bottom:0;left:0;width:100%;height:var(--pressure,0%);background:#ffba6030}.controller-button[data-pressed=true]{border-color:#ffca80;background:#493a27;color:#ffe4bb}.controller-button[data-tested=true]:after{content:"✓";position:absolute;top:1px;right:4px;font-size:10px;color:#80e7b2}.axis-readings{display:grid;gap:12px}.axis-row{display:grid;grid-template-columns:60px 1fr 52px;gap:10px;align-items:center;font-size:13px}.axis-row b{font-variant-numeric:tabular-nums;text-align:right}.axis-track{position:relative;background:#29354c;height:8px;border-radius:5px}.axis-track:before{content:"";position:absolute;height:16px;width:1px;left:50%;top:-4px;background:#91a2bd}.axis-track i{position:absolute;width:10px;height:16px;top:-4px;border-radius:3px;background:#ffba60;left:var(--axis,50%);transform:translate(-50%)}.stick-pads{display:flex;gap:20px;flex-wrap:wrap;margin:20px 0}.stick-pad{text-align:center;color:#aebed4;font-size:12px}.stick-plot{width:112px;height:112px;border-radius:50%;border:1px solid #62728d;position:relative;margin-top:8px;background:linear-gradient(transparent 49.5%,#49566d 50%,transparent 50.5%),linear-gradient(90deg,transparent 49.5%,#49566d 50%,transparent 50.5%),#1b263a}.stick-dot{width:12px;height:12px;border-radius:50%;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background:#ffba60}.device-hint{font-size:13px;color:#aab9cf;margin:12px 0 0}.key-surface{padding:20px;outline-offset:-4px}.key-surface:focus{box-shadow:inset 0 0 0 2px #ffba60}.keyboard-scroll{overflow-x:auto;padding-bottom:8px}.keyboard{min-width:690px;display:grid;gap:6px}.key-row{display:flex;gap:5px}.key{display:flex;align-items:center;justify-content:center;flex:1;min-width:0;min-height:43px;background:#202b40;border:1px solid #43516a;border-bottom:3px solid #35445e;border-radius:6px;color:#c7d1e1;font:500 12px Inter,sans-serif;position:relative}.key.wide{flex:1.8}.key.space{flex:6}.key[data-tested=true]{border-color:#6cad8b;color:#a5e3c1}.key[data-tested=true]:after{content:"·";position:absolute;right:5px;top:0;color:#8ce1b6}.key[data-pressed=true]{background:#ffba60;border-color:#ffe0a9;color:#142032}.key-surface .device-hint{margin:14px 0 0}.key-current{padding:15px 20px;border-top:1px solid #344059;color:#b5c3d6;font-size:14px;min-height:54px;overflow-wrap:anywhere}.key-current strong{color:#fff;font-variant-numeric:tabular-nums}.tool-message{padding:12px 22px;color:#aebdd2;font-size:13px;margin:0}.input-panel [hidden]{display:none!important}.tool-page .related{grid-template-columns:repeat(2,minmax(0,1fr))}@media(max-width:650px){.tool-heading h1{font-size:29px}.tool-heading{gap:8px}.tool-heading .pill{margin:0}.tool-lead{font-size:14px;margin-bottom:18px}.tool-bar{padding:14px}.tool-actions{width:100%}.tool-actions button{flex:1}.tool-stats>div{padding:12px 10px}.tool-stats b{font-size:20px}.tool-stats small{font-size:11px}.tool-body{padding:16px}.controller-layout{grid-template-columns:1fr}.tool-empty{padding:25px 16px}.tool-empty h2{font-size:21px}.tool-empty p{font-size:14px}.key-surface,.key-current{padding:14px}.tool-message{padding:12px 14px}.tool-page .related{grid-template-columns:1fr}.keyboard-scroll{scrollbar-color:#ffba60 #223149}.controller-buttons{grid-template-columns:repeat(4,minmax(0,1fr))}}@media(max-width:420px){header.site .coinchip{display:none}header.site .wrap{gap:12px}header.site nav.main a{padding:8px}}
