@import"https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@400;600;700&family=Barlow:wght@400;500;600&family=Share+Tech+Mono&display=swap";:root{--cyan: #00c2ff;--orange: #ff6b00;--green: #00d47e;--red: #ff4d4d;--bg: #04070d;--bg2: #07111e;--surface: #0c1a2b;--surface2: #112238;--border: rgba(0, 194, 255, .12);--border-strong: rgba(0, 194, 255, .26);--text: #e8f4ff;--text-dim: rgba(232, 244, 255, .7);--text-muted: rgba(232, 244, 255, .45);--font-display: "Barlow Condensed", sans-serif;--font-ui: "Barlow", sans-serif;--font-mono: "Share Tech Mono", monospace;--radius: 10px;--radius-sm: 6px}[data-theme=light]{--cyan: #0078a8;--orange: #bb4d00;--green: #0a7a46;--red: #c12727;--bg: #eef3f8;--bg2: #dde6f0;--surface: #ffffff;--surface2: #f4f7fb;--border: rgba(0, 90, 155, .14);--border-strong: rgba(0, 90, 155, .28);--text: #102033;--text-dim: rgba(16, 32, 51, .72);--text-muted: rgba(16, 32, 51, .46)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{min-height:100dvh;font-family:var(--font-ui);font-size:14px;background:radial-gradient(circle at top,rgba(0,194,255,.1),transparent 45%),linear-gradient(180deg,var(--bg2),var(--bg));color:var(--text);-webkit-font-smoothing:antialiased}button,input{font:inherit}.app-shell{min-height:100dvh}.shell{width:min(980px,calc(100vw - 32px));margin:0 auto;padding:0 0 56px}.page{display:flex;flex-direction:column;gap:24px;padding-top:24px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 0;border-bottom:1px solid var(--border)}.topbar-brand,.topbar-actions{display:flex;align-items:center;gap:10px}.topbar-brand-link{display:inline-flex;align-items:center;gap:10px;color:var(--text);text-decoration:none}.topbar-brand-mark{display:inline-flex;align-items:center;justify-content:center}.shared-brand__logo{width:28px;height:28px;object-fit:contain}.shared-brand__logo--light,[data-theme=light] .shared-brand__logo--dark{display:none}[data-theme=light] .shared-brand__logo--light{display:block}.topbar-title{font-family:var(--font-display);font-size:1.08rem;font-weight:700;letter-spacing:.03em;color:var(--text)}.topbar-title em{font-style:normal;color:var(--cyan)}.topbar-other-wrap{position:relative}.topbar-other-btn{display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:5px 10px;border:1px solid var(--border);border-radius:var(--radius-sm);background:color-mix(in srgb,var(--surface) 80%,transparent);color:var(--text-dim);cursor:pointer;text-transform:uppercase;letter-spacing:.08em;font-family:var(--font-mono);font-size:.72rem;transition:color .15s ease,border-color .15s ease,background .15s ease}.topbar-other-btn:hover{color:var(--text);border-color:var(--border-strong);background:var(--surface)}.topbar-other-chevron{font-size:10px;line-height:1}.topbar-dropdown{position:absolute;top:calc(100% + 8px);right:0;z-index:80;min-width:220px;padding:6px;border:1px solid var(--border-strong);border-radius:var(--radius);background:var(--surface);box-shadow:0 20px 40px #00000047;display:flex;flex-direction:column;gap:2px}[data-theme=light] .topbar-dropdown{background:var(--surface);border-color:var(--border-strong);box-shadow:0 18px 36px #13477a29}.topbar-dropdown__item{display:flex;flex-direction:column;gap:2px;padding:9px 10px;border-radius:var(--radius-sm);color:var(--text);text-decoration:none;transition:background .12s ease}.topbar-dropdown__item:hover{background:color-mix(in srgb,var(--surface2) 88%,transparent)}[data-theme=light] .topbar-dropdown__item{color:var(--text)}[data-theme=light] .topbar-dropdown__item:hover{background:#f4f7fb}[data-theme=light] .topbar-dropdown__label{color:#102033}[data-theme=light] .topbar-dropdown__subtitle{color:#1020339e}[data-theme=light] .topbar-other-btn{background:#fff;color:#0078a8;border-color:#005a9b47}[data-theme=light] .topbar-other-btn:hover{background:#f4f7fb;color:#102033;border-color:#005a9b61}.topbar-dropdown__item--current{opacity:.45;cursor:default;pointer-events:none}.topbar-dropdown__label{display:inline-flex;align-items:center;gap:6px;font-size:.88rem;font-weight:600;white-space:nowrap}.topbar-dropdown__subtitle{color:var(--text-muted);font-size:.72rem}.topbar-dropdown__flag{display:inline-flex;align-items:center;justify-content:center;min-height:16px;padding:0 5px;border:1px solid rgba(255,107,0,.32);border-radius:999px;background:#ff6b001f;color:var(--orange);font-family:var(--font-mono);font-size:.58rem;letter-spacing:.08em;text-transform:uppercase}.theme-toggle{display:inline-flex;align-items:center;justify-content:center;min-height:32px;padding:5px 9px;border:1px solid var(--border);border-radius:var(--radius-sm);background:color-mix(in srgb,var(--surface) 80%,transparent);color:var(--text-dim);cursor:pointer;transition:color .15s ease,border-color .15s ease,background .15s ease}.theme-toggle:hover{color:var(--text);border-color:var(--border-strong);background:var(--surface)}.gear-hero{display:grid;gap:8px;padding:6px 0 4px}.gear-hero h1{font-family:var(--font-display);font-size:clamp(2.2rem,6vw,3.4rem);line-height:.98;letter-spacing:-.02em}.gear-hero__sub{max-width:640px;color:var(--text-dim);font-size:1rem;line-height:1.5}.eyebrow{color:var(--cyan);font-family:var(--font-mono);font-size:.72rem;letter-spacing:.11em;text-transform:uppercase}.tab-bar{display:flex;gap:6px;padding:4px;width:fit-content;border:1px solid var(--border);border-radius:999px;background:#06121e8c}[data-theme=light] .tab-bar{background:#ffffffb8}.tab-btn{padding:10px 18px;border:none;border-radius:999px;background:transparent;color:var(--text-dim);font-weight:600;cursor:pointer;transition:color .15s ease,background .15s ease}.tab-btn:hover{color:var(--text)}.tab-btn--active{background:#00c2ff24;color:var(--cyan)}.test-panel{display:flex;flex-direction:column;gap:18px}.test-empty,.controller-id,.axes-raw,.stat-card,.frame-graph,.ball-track,.drift-detector{border:1px solid var(--border);border-radius:var(--radius);background:color-mix(in srgb,var(--surface) 88%,transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.test-empty{display:flex;flex-direction:column;align-items:center;gap:10px;padding:56px 24px;text-align:center}.test-empty__icon{font-size:2.4rem;opacity:.55}.test-empty__title{font-size:1.16rem;font-weight:600}.test-empty__sub{max-width:380px;color:var(--text-dim)}.test-empty__hint{color:var(--text-muted);font-size:.82rem}.controller-id{display:flex;flex-direction:column;gap:4px;padding:14px 16px}.controller-id__name{color:var(--text);font-family:var(--font-mono);font-size:.85rem;word-break:break-all}.dz-controls{display:flex;flex-wrap:wrap;gap:14px}.dz-label{display:flex;align-items:center;gap:10px;flex:1 1 240px;color:var(--text-dim)}.dz-label strong{min-width:3ch;color:var(--cyan);font-family:var(--font-mono)}.dz-slider{flex:1;accent-color:var(--cyan);cursor:pointer}.sticks-row{display:flex;align-items:flex-start;justify-content:center;gap:24px;flex-wrap:wrap}.stick-viz,.trigger-viz{display:flex;flex-direction:column;align-items:center;gap:6px}.stick-label,.trigger-label{color:var(--text-dim);font-size:.75rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase}.stick-pad{width:140px;height:140px}.stick-vals{display:flex;gap:10px;color:var(--text-muted);font-family:var(--font-mono);font-size:.72rem}.triggers-col{display:flex;align-items:flex-end;gap:16px;padding-top:18px}.trigger-track{position:relative;display:flex;align-items:flex-end;width:28px;height:120px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);overflow:hidden}.trigger-fill{width:100%;min-height:0;border-radius:var(--radius-sm) var(--radius-sm) 0 0;background:linear-gradient(180deg,var(--cyan),color-mix(in srgb,var(--cyan) 55%,white));transition:height .04s linear}.trigger-val{color:var(--text-muted);font-family:var(--font-mono);font-size:.68rem}.buttons-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(78px,1fr));gap:8px}.btn-cell{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:54px;padding:8px 6px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);transition:border-color .12s ease,background .12s ease,transform .12s ease}.btn-cell--pressed{border-color:var(--cyan);background:#00c2ff24;transform:translateY(-1px)}.btn-cell--analog{border-color:#00c2ff66}.btn-name{color:var(--text-dim);font-size:.72rem;font-weight:600;text-align:center}.btn-cell--pressed .btn-name,.btn-analog-val{color:var(--cyan)}.btn-analog-val{font-family:var(--font-mono);font-size:.64rem}.axes-raw{display:flex;flex-direction:column;gap:8px;padding:14px 16px}.axis-row{display:grid;grid-template-columns:52px 1fr 64px;align-items:center;gap:10px}.axis-label,.axis-val{color:var(--text-muted);font-family:var(--font-mono);font-size:.72rem}.axis-val{text-align:right}.axis-bar-track{position:relative;height:10px;border-radius:999px;background:var(--surface2);overflow:hidden}.axis-bar-fill{position:absolute;top:0;height:100%;border-radius:999px;background:var(--cyan);transition:width .04s linear,left .04s linear}.axis-bar-center{position:absolute;top:0;left:50%;width:1px;height:100%;background:var(--border-strong)}.screen-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.stat-card{display:flex;flex-direction:column;gap:5px;padding:14px 16px}.stat-card span{color:var(--text-muted);font-size:.7rem;letter-spacing:.06em;text-transform:uppercase}.stat-card strong{color:var(--text);font-family:var(--font-display);font-size:1.6rem;line-height:1}.stat-card--warn{border-color:#ff6b006b;background:#ff6b0014}.stat-card--warn strong{color:var(--orange)}.hz-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.hz-label{color:var(--text-dim);font-size:.8rem;margin-right:4px}.hz-btn{padding:6px 14px;border:1px solid var(--border);border-radius:999px;background:var(--surface);color:var(--text-dim);font-family:var(--font-mono);font-size:.8rem;cursor:pointer;transition:border-color .15s ease,color .15s ease,background .15s ease,transform .15s ease}.hz-btn:hover{color:var(--text);border-color:var(--border-strong);transform:translateY(-1px)}.hz-btn--active{color:var(--cyan);border-color:var(--cyan);background:#00c2ff1a}.hz-btn--recommended{box-shadow:inset 0 0 0 1px #ff6b006b}.drift-detector{display:grid;gap:6px;padding:14px 16px}.drift-detector__title{color:var(--text-dim);font-size:.76rem;letter-spacing:.15em;text-transform:uppercase}.drift-detector__message{color:var(--text);font-size:.94rem;line-height:1.45}.drift-detector__facts{display:flex;flex-wrap:wrap;gap:10px 16px;color:var(--text-dim);font-size:.76rem}.drift-detector__facts strong{color:var(--text);font-family:var(--font-mono);font-size:.82rem}.drift-detector__hint{color:var(--text-muted);font-size:.76rem;line-height:1.45}.drift-detector--ok{border-color:#00d47e73;background:#00d47e14}.drift-detector--warn{border-color:#ff6b0073;background:#ff6b0014}.frame-graph{position:relative;display:flex;align-items:flex-end;gap:1px;height:112px;padding:4px 4px 0;overflow:hidden}.frame-graph__target{position:absolute;left:0;right:0;height:1px;background:var(--cyan);opacity:.55;pointer-events:none}.frame-bar{flex:1;min-height:2px;border-radius:2px 2px 0 0;background:#00c2ff94}.frame-bar--slow{background:#ff6b00c2}.frame-bar--stutter{background:#ff4d4de6}.frame-graph__legend,.ball-caption{color:var(--text-muted);font-size:.74rem;line-height:1.5}.ball-section{display:flex;flex-direction:column;gap:8px}.ball-track{position:relative;height:44px;overflow:hidden}.ball-head{position:absolute;top:50%;left:0%;width:22px;height:22px;border-radius:50%;background:var(--cyan);box-shadow:0 0 14px #00c2ff73;transform:translate(-50%,-50%)}.notice-center{position:relative;display:inline-flex}.notice-button{display:inline-flex;align-items:center;justify-content:center;min-height:32px;gap:6px;padding:5px 10px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);color:var(--text);cursor:pointer}.notice-button__badge{display:inline-flex;align-items:center;justify-content:center;min-width:18px;min-height:18px;padding:0 5px;border:1px solid rgba(255,107,0,.32);border-radius:999px;background:#ff6b001f;color:var(--orange);font-family:var(--font-mono);font-size:.58rem}.notice-panel{position:absolute;top:calc(100% + 10px);right:0;z-index:50;width:min(360px,calc(100vw - 32px));padding:14px;border:1px solid var(--border-strong);border-radius:14px;background:var(--surface);box-shadow:0 20px 40px #00000047;animation:notice-pop .18s ease}.notice-panel__header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px;color:var(--text-dim);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase}.notice-panel__list{display:grid;gap:10px}.notice-item{display:grid;gap:6px;padding:12px;border:1px solid var(--border);border-radius:12px;background:var(--surface2)}.notice-item__date{color:var(--text-muted);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase}.notice-item__title{color:var(--text);font-size:.96rem}.notice-item__message{color:var(--text-dim);line-height:1.5}.notice-item__link{color:var(--cyan);font-weight:600;text-decoration:none}.notice-item__link:hover{text-decoration:underline}@keyframes notice-pop{0%{opacity:0;transform:translateY(-4px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@media(max-width:760px){.topbar{align-items:flex-start;flex-direction:column}.topbar-actions{flex-wrap:wrap}.topbar-dropdown{left:0;right:auto;width:min(320px,calc(100vw - 32px))}.screen-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:560px){.shell{width:min(100vw - 20px,980px)}.screen-stats{grid-template-columns:1fr}.sticks-row{flex-direction:column;align-items:center}.triggers-col{padding-top:0}.tab-bar{width:100%}.tab-btn{flex:1;text-align:center}}