.fp-btn {
    display: inline-block; padding: .55rem 1.2rem; border: 1px solid var(--hud-cyan); background: transparent; color: var(--hud-cyan);
    font-family: "Orbitron", sans-serif; font-size: .8rem; letter-spacing: .12em; text-transform: uppercase; text-decoration: none; cursor: pointer;
    clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 10px 100%, 0 calc(100% - 10px));
}
.fp-btn:hover { color: var(--hud-orange); border-color: var(--hud-orange); }
.fp-btn-main { background: var(--hud-orange); border-color: var(--hud-orange); color: #0a0a0c; }
.fp-btn-main:hover { background: #ff8a2b; color: #0a0a0c; }
.fp-btn-quiet { border-color: rgba(180, 177, 172, .4); color: var(--hud-muted); }
#wrapper.fsm { width: 100%; max-width: 1100px; margin: 50px auto 2.5rem; padding: 0 1rem; }
.fsm-start { margin: 0 0 .9rem; }
.fsm-side h2 { font-family: Orbitron, sans-serif; font-size: .75rem; letter-spacing: .15em; color: var(--hud-cyan, #19b3e6); text-transform: uppercase; margin: 0 0 .8rem; border: 0; padding: 0; }
@media (min-width: 1200px) {
  #wrapper.fsm[data-state="intro"] { max-width: 1440px; display: grid; grid-template-columns: 300px minmax(0, 1fr); grid-template-rows: repeat(7, auto) 1fr; column-gap: 2rem; }
  .fsm[data-state="intro"] > *, .fsm[data-state="intro"] #fsm-intro > * { grid-column: 2; }
  .fsm[data-state="intro"] > .page-head { grid-column: 1 / -1; }
  .fsm[data-state="intro"] #fsm-intro { display: contents; }
  .fsm[data-state="intro"] #fsm-intro > .fsm-side { grid-column: 1; grid-row: 2 / -1; align-self: start; position: sticky; top: 1rem; background: var(--hud-panel, #14151a); border: 1px solid var(--hud-border, rgba(255,113,0,.55)); border-top: 3px solid var(--hud-orange, #ff7100); padding: 1rem; clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 12px 100%, 0 calc(100% - 12px)); }
  .fsm[data-state="intro"] .fsm-legend { grid-template-columns: 1fr; gap: .8rem; font-size: .92rem; }
  .fsm[data-state="intro"] .fsm-find { margin-top: 1rem; }
  .fsm[data-state="intro"] .fsm-go-end { display: none; }
}
.fsm-screen { border: 1px solid var(--hud-border, rgba(255,113,0,.55)); border-radius: 4px; overflow: hidden; background: #050d13; }
.fsm-screen svg { display: block; width: 100%; height: auto; }
.fsm-screen svg text { font-family: Orbitron, sans-serif !important; font-weight: 700; letter-spacing: .02em; }
.fsm-phone .fsm-dt { display: none; }
.fsm-strip, .fsm-coach { text-transform: none; }
.fsm-phone, .fsm-strip, .fsm-ctrl-phone { display: none; }
.fsm-modes, .fsm-go { display: flex; gap: .6rem; flex-wrap: wrap; margin: 0 0 .9rem; }
.fsm-modes { scroll-margin-top: 1rem; }
.fsm-go { margin: 1rem 0 0; }
.fp-btn.is-on { border-color: var(--hud-orange, #ff7100); box-shadow: 0 0 10px rgba(255,113,0,.35); }
.fsm-body { margin-top: 1.2rem; }
.fsm-find { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin-bottom: 1.2rem; }
.fsm-lbl { font-family: Orbitron, sans-serif; font-size: .8rem; letter-spacing: .08em; text-transform: uppercase; color: var(--hud-muted, #b4b1ac); margin-right: .3rem; }
.fsm-chip { background: transparent; color: var(--hud-text, #e8e6e3); border: 1px solid rgba(25,179,230,.6); border-radius: 999px; padding: .35rem .85rem; font: inherit; font-size: .9rem; }
.fsm-chip.is-on { border-color: var(--hud-orange, #ff7100); background: rgba(255,113,0,.18); }
.fsm-legend { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: .9rem 2rem; }
.fsm-legend li { display: flex; gap: .7rem; align-items: flex-start; line-height: 1.45; }
.fsm-legend b { display: block; font-family: Orbitron, sans-serif; font-size: .82rem; letter-spacing: .05em; color: var(--hud-cyan, #19b3e6); text-transform: uppercase; }
.fsm-b { flex: none; display: inline-grid; place-items: center; width: 1.6rem; height: 1.6rem; border-radius: 50%; background: var(--hud-orange, #ff7100); color: #0a0a0c; font: 700 .85rem Orbitron, sans-serif; font-style: normal; }
.fsm-note { margin: 1.2rem 0 0; padding: .7rem 1rem; border-left: 3px solid var(--hud-orange, #ff7100); background: rgba(255,113,0,.08); }
.fsm-ctrl-desk { display: flex; gap: 1.6rem; flex-wrap: wrap; color: var(--hud-muted, #b4b1ac); }
kbd { font: .8rem Orbitron, sans-serif; border: 1px solid rgba(25,179,230,.6); border-radius: 3px; padding: .1rem .4rem; margin: 0 .15rem; color: var(--hud-text, #e8e6e3); }
.fsm-coach { margin-top: 1rem; padding: .8rem 1rem; border: 1px solid rgba(25,179,230,.45); background: rgba(25,179,230,.07); border-radius: 4px; line-height: 1.5; }
.fsm-coach b { font-family: Orbitron, sans-serif; color: var(--hud-cyan, #19b3e6); margin-right: .5rem; text-transform: uppercase; font-size: .8rem; }
.fsm-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 1.2rem; }
.fsm-card { margin: 0; background: var(--hud-panel, #14151a); border: 1px solid rgba(255,113,0,.35); border-radius: 4px; padding: 1rem 1.2rem; }
.fsm-card h3 { margin: 0 0 .8rem; font-family: Orbitron, sans-serif; font-size: 1rem; text-transform: uppercase; letter-spacing: .05em; display: flex; justify-content: space-between; align-items: center; gap: .5rem; }
.fsm-tag { font-size: .7rem; border: 1px solid var(--hud-orange, #ff7100); color: var(--hud-orange, #ff7100); border-radius: 999px; padding: .15rem .6rem; }
.fsm-card dl { display: grid; grid-template-columns: 1fr auto; gap: .35rem 1rem; margin: 0; }
.fsm-card dt { color: var(--hud-muted, #b4b1ac); }
.fsm-card dd { margin: 0; text-align: right; font-family: Orbitron, sans-serif; font-size: .9rem; }
.fsm-card p { margin: .8rem 0 0; color: var(--hud-muted, #b4b1ac); }
@media (max-width: 640px) {
  .fsm-desk, .fsm-ctrl-desk { display: none; }
  .fsm-phone { display: block; }
  .fsm-strip { display: flex; justify-content: space-between; gap: .4rem; padding: .5rem .6rem; border: 1px solid var(--hud-border, rgba(255,113,0,.55)); border-top: 0; font-size: .8rem; color: var(--hud-muted, #b4b1ac); }
  .fsm-strip span { display: flex; align-items: center; gap: .3rem; }
  .fsm-strip b { font-family: Orbitron, sans-serif; color: var(--hud-text, #e8e6e3); }
  .fsm-strip .fsm-b { width: 1.25rem; height: 1.25rem; font-size: .7rem; }
  .fsm-legend, .fsm-cards { grid-template-columns: 1fr; }
  .fsm-ctrl-phone { display: grid; gap: .6rem; }
  .fsm-ctrl-phone p { margin: 0; color: var(--hud-muted, #b4b1ac); font-size: .9rem; }
  .fsm-tune { display: grid; gap: .3rem; font-family: Orbitron, sans-serif; font-size: .8rem; text-transform: uppercase; color: var(--hud-cyan, #19b3e6); }
  .fsm-tune input { width: 100%; accent-color: #ff7100; }
  .fsm-zoom { padding: .9rem; font-size: 1rem; }
}
.fsm-view { touch-action: none; cursor: grab; user-select: none; }
.fsm-view text { font-family: Orbitron, sans-serif; font-weight: 700; letter-spacing: .02em; }
.fsm[data-state="intro"] .fsm-view { cursor: default; }
.fsm:not([data-state="intro"]) .fsm-intro-only { display: none; }
.fsm-status { min-height: 1.4em; margin: .5rem 0 0; color: var(--hud-muted, #b4b1ac); font-size: .9rem; }
.fsm-tips { margin: 1rem 0 0; padding-left: 1.2rem; line-height: 1.6; }
.fsm-timer { font-family: Orbitron, sans-serif; align-self: center; margin-left: auto; color: var(--hud-text, #e8e6e3); }
.fsm-chip { cursor: pointer; }
.fsm-chip:hover, .fsm-chip:focus-visible { box-shadow: 0 0 8px rgba(25,179,230,.45); transform: translateY(-1px); }
#fsm-card { margin-top: 1rem; }
.fsm-pbtns { display: grid; grid-template-columns: 1fr 2fr; gap: .6rem; }
@media (max-width: 640px) { .fsm-strip { border-top: 0; } }
