@font-face{font-family:Syne;src:url('/assets/fonts/Syne.ttf');font-display:swap}
@font-face{font-family:Manrope;src:url('/assets/fonts/Manrope.ttf');font-display:swap}
:root{color-scheme:dark;--ink:#12131b;--panel:#212232;--line:#4d4e65;--paper:#f5ecdf;--muted:#c2b9ca;--ivory:#f4debf;--coral:#ff9d80;font:14px Manrope,system-ui,sans-serif}
*{box-sizing:border-box}
body{margin:0;background:var(--ink);color:var(--paper)}
a{color:inherit}button{font:inherit;color:inherit;cursor:pointer}
button:disabled{opacity:.55;cursor:default}
:focus-visible{outline:2px solid var(--ivory);outline-offset:4px}
[hidden]{display:none!important}
.shell{width:min(1350px,100%);margin:auto;padding:0 max(22px,env(safe-area-inset-right)) max(32px,env(safe-area-inset-bottom)) max(22px,env(safe-area-inset-left))}
header{min-height:66px;padding-top:env(safe-area-inset-top);display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);gap:12px}
header a{min-height:44px;display:inline-flex;align-items:center;text-decoration:none;gap:9px}
header img{width:21px;height:auto}
header span{color:var(--muted);font-size:.84rem}
.intro{display:flex;align-items:end;justify-content:space-between;gap:20px;margin:clamp(24px,4vw,55px) 0 22px}
h1{font:700 clamp(3.4rem,10vw,8rem)/.78 Syne,sans-serif;margin:0;letter-spacing:-.065em}
.intro p{color:var(--muted);margin:0;font-size:clamp(.85rem,2vw,1.1rem)}
.game{display:grid;grid-template-columns:minmax(0,1fr) minmax(255px,330px);gap:18px;align-items:start}
.stage{position:relative;overflow:hidden;border:1px solid var(--line);background:#171823}
canvas{display:block;width:100%;aspect-ratio:1.52;touch-action:manipulation}
.court-label{position:absolute;inset:12px 14px auto;display:flex;justify-content:space-between;pointer-events:none;color:#d3dfc4;font:600 .66rem Manrope;letter-spacing:.1em}
.side{display:grid;gap:13px;min-width:0}
.metrics{display:grid;grid-template-columns:repeat(4,1fr);margin:0;border-block:1px solid var(--line);padding:10px 0;gap:8px}
.metrics dt{color:var(--muted);font-size:.72rem;line-height:1.2}
.metrics dd{font:650 clamp(1.5rem,5vw,2.25rem)/1.2 Syne,system-ui;margin:2px 0 0;font-variant-numeric:tabular-nums}
.stamina{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.stamina div{min-width:0}
.stamina label{font-size:.73rem;display:flex;justify-content:space-between;gap:5px;margin-bottom:5px}
.stamina meter{display:block;width:100%;height:8px;appearance:none}
meter::-webkit-meter-bar{background:#42425b;border:0}
meter::-webkit-meter-optimum-value{background:var(--ivory)}
.stamina div:last-child meter::-webkit-meter-optimum-value{background:var(--coral)}
.status{border-left:2px solid var(--ivory);padding-left:10px;min-height:42px;color:var(--muted);font-size:.86rem;margin:0;line-height:1.45}
.paces,.extras{display:flex;flex-wrap:wrap;gap:8px}
button{min-height:44px;border:1px solid var(--line);padding:7px 12px;background:transparent;border-radius:3px}
.paces button{flex:1}
button[aria-pressed=true]{border-color:var(--ivory);color:var(--ivory);background:#302b3c}
.primary{background:var(--ivory);border-color:var(--ivory);color:#201b28;font-weight:750}
.primary:not(:disabled):hover{background:#fff0d9}
.extras button{font-size:.74rem;color:var(--muted)}
.timing{height:12px;background:#42425b;position:relative;border-radius:2px}
.timing:before{content:'';position:absolute;inset:0 39% 0 39%;background:#7b6675}
.timing i{position:absolute;left:50%;top:-3px;height:18px;width:3px;background:var(--paper);transform:translateX(-50%)}
dialog{width:min(460px,calc(100% - 32px));max-height:85dvh;overflow:auto;background:var(--panel);color:var(--paper);border:1px solid var(--line);padding:24px}
dialog::backdrop{background:#0e0e19d1}
dialog h2{font-family:Syne,sans-serif;margin-top:0}dialog li{margin:8px 0;line-height:1.55}
@media(max-width:760px){.game{display:flex;flex-direction:column;gap:12px}.stage,.side{width:100%}.side{gap:9px}.intro{align-items:start}.intro p{max-width:105px}.metrics{padding:7px 0}.stamina{gap:10px}.shell{padding-inline:max(12px,env(safe-area-inset-left))}.status{min-height:0}.court-label{font-size:.57rem;inset:9px 9px auto}}
.library-intro{display:block}.library-intro h1{font-size:clamp(2.65rem,9.5vw,7rem);line-height:1.05}.library-intro p{margin-top:12px;max-width:none}.language-links{display:flex;gap:12px;font-size:.75rem}.game-index{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:24px 0}.game-choice{min-height:220px;display:flex;flex-direction:column;justify-content:end;padding:clamp(18px,4vw,42px);border:1px solid var(--line);text-decoration:none;background:#252532}.game-feather{background:#303249}.game-choice:hover{border-color:var(--ivory)}.game-choice small{color:var(--muted);margin-bottom:auto}.game-choice strong{font:650 clamp(1.7rem,6vw,4.2rem)/1.1 Syne,sans-serif;overflow-wrap:anywhere}.game-choice p{color:var(--muted);margin-bottom:0}.confluence-install-launch button{border-color:var(--ivory)}@media(max-width:580px){.game-index{grid-template-columns:1fr}.game-choice{min-height:154px}.game-choice small{margin-bottom:18px}}
canvas{touch-action:none;aspect-ratio:1.48}
.flight-controls{display:grid;grid-template-columns:minmax(68px,.63fr) minmax(0,1.37fr);gap:8px}
#float{min-height:49px;touch-action:none;user-select:none;display:flex;align-items:center;justify-content:center;gap:10px}
#float i{display:block;width:min(92px,40%);height:5px;background:#49455d}
#float b{display:block;width:100%;height:100%;background:var(--ivory);transform-origin:left}
.court-callout{position:absolute;pointer-events:none;top:11%;left:50%;transform:translateX(-50%);width:max-content;max-width:86%;background:#211c2eed;border:1px solid #ac7d79;padding:6px 10px;color:#ffe7cc;font-size:.75rem;text-align:center}
@media(max-width:580px){canvas{aspect-ratio:1.12}.court-label{inset:8px 8px auto}.flight-controls button{min-height:48px}}
canvas{touch-action:pan-y}
canvas[data-active=true]{touch-action:none}
.game-feather{background:linear-gradient(180deg,#1414201f 10%,#191925ed 85%),url('/assets/feather/night-court-arena.jpg') center 47%/cover}
.game-choice h2{font:650 clamp(1.7rem,5vw,4.2rem)/1 Syne,sans-serif;margin:0;overflow-wrap:anywhere}.game-choice p{line-height:1.5}.game-choice small{display:block;margin-bottom:24px}.game-confluence{background:linear-gradient(0deg,#20212bed,#20212b26),url('/assets/brand/confluence-card-nov11.jpg') center/cover}.game-choice{min-height:280px}.game-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}.game-actions a{display:inline-flex;min-height:44px;align-items:center;padding:8px 11px;border:1px solid #a28f9e;background:#201d2bea;text-decoration:none}.game-actions a:first-child{background:var(--ivory);color:var(--ink);border-color:var(--ivory)}.game-actions a:hover{outline:1px solid var(--ivory)}.individual-install{margin-top:20px;padding-top:16px;border-top:1px solid var(--line);color:var(--muted)}.individual-install button{color:var(--paper)}.individual-install p{margin-top:0}#confluence-install{scroll-margin:90px 0}.metrics dt{overflow-wrap:anywhere}
@media(max-width:580px){.game-choice{min-height:220px}.game-actions{margin-top:12px}.game-index{gap:10px}}
.game-confluence{background:linear-gradient(90deg,#242534 5%,#28243282 100%),url('/assets/brand/artegy-mark-white.svg') right -18px center/53% auto no-repeat,#2b293d}
.game-feather{background:linear-gradient(180deg,#19192565 0%,#191925ed 88%),url('/assets/feather/night-court-arena.jpg') center 47%/cover}
.difficulty{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.difficulty button{padding-inline:3px;font-weight:650;font-size:.83rem;overflow-wrap:anywhere}
.difficulty-note{min-height:30px;color:var(--muted);font-size:.79rem;line-height:1.42;margin:0}
.feather-standalone .shell{width:min(1530px,100%)}
.feather-standalone .intro{margin:clamp(16px,3vw,42px) 0 16px}
.feather-standalone h1{font-size:clamp(3.1rem,8.2vw,7.1rem)}
.feather-standalone .game{grid-template-columns:minmax(0,1fr) minmax(248px,305px)}
.feather-standalone canvas{aspect-ratio:1.45}
@media(max-width:760px){.feather-standalone .shell{padding-inline:max(9px,env(safe-area-inset-left)) max(9px,env(safe-area-inset-right))}.feather-standalone canvas{aspect-ratio:1.02}.feather-standalone .stage{order:0}}
@media(max-width:760px){.feather-standalone canvas{scroll-margin-top:8px}.feather-standalone[data-rally-mode="playing"] .difficulty{display:none}.feather-standalone[data-rally-mode="playing"] .difficulty-note{min-height:0}}
@media(max-width:760px){.feather-standalone[data-rally-mode="playing"] .flight-controls{order:-1}.feather-standalone[data-rally-mode="playing"] .difficulty-note{display:none}}
.feather-lockup{display:flex;align-items:center;gap:clamp(8px,1.7vw,24px)}
.feather-lockup img{width:clamp(42px,6.1vw,86px);height:auto;flex:none}
.feather-standalone header .arena-light{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:5px 9px;border:1px solid var(--line);border-radius:4px;color:var(--paper);background:#222231}
.arena-light svg{width:16px;height:16px;flex:none}
.feather-standalone header .arena-light[aria-pressed=true]{background:var(--ivory);color:var(--ink);border-color:var(--ivory)}
.feather-standalone[data-arena-lights=bright] .stage{border-color:#a39aac}
@media(max-width:480px){.feather-standalone header .arena-light{font-size:.7rem}.feather-lockup img{width:39px}.feather-standalone .intro{gap:7px;align-items:center}.feather-standalone h1{font-size:clamp(2.65rem,11vw,3.8rem)}.feather-standalone .intro p{max-width:89px;font-size:.74rem}}
.feather-styles,#shot-picker{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.feather-styles{max-width:450px}
.feather-styles button,#shot-picker button{padding-inline:4px;overflow-wrap:anywhere}
.style-hint{max-width:65ch;color:var(--muted);margin:8px 0 14px;font-size:.85rem}
.match-hud dl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0;border-block:1px solid var(--line);padding:7px 0}
.match-hud dt{font-size:.73rem;color:var(--muted);overflow-wrap:anywhere}
.match-hud dd{font:650 clamp(1.5rem,4vw,2.4rem)/1.1 Syne,system-ui;margin:3px 0 0;font-variant-numeric:tabular-nums}
.match-hud p{margin:5px 0 0;font-size:.72rem;color:var(--muted)}
#match-aim{font-size:.72rem;color:var(--muted)}
#match-timing{position:relative;overflow:hidden;height:8px;margin-top:4px;background:#4d4157;border:1px solid #6d5b76}
#match-timing::after{content:"";position:absolute;inset:0 30% 0 45%;background:#f8cbad45}
#match-timing i{display:block;width:100%;height:100%;background:#ffc2a2;transform:scaleX(var(--timing,0));transform-origin:left}
#match-hit{min-height:49px;background:#eee1d2}
#match-hit.match-window{background:#ffad8e;border-color:#ffad8e}
#shot-picker{grid-template-columns:repeat(4,minmax(0,1fr))}
[data-feather-style=pov] .stamina,[data-feather-style=pover] .stamina{display:none}
[data-feather-style=pov][data-rally-mode=playing] .side,[data-feather-style=pover][data-rally-mode=playing] .side{grid-template-columns:minmax(0,1fr)}
@media(max-width:760px){
  .feather-standalone[data-rally-mode=playing] .feather-styles,.feather-standalone[data-rally-mode=playing] .style-hint{display:none}
  .feather-standalone[data-rally-mode=playing] #shot-picker{order:-2}
  .feather-standalone[data-rally-mode=playing] #match-aim{order:-3}
}
#feather-tutorial{border:1px solid #a47f7b;border-inline-start:4px solid #ffc2a2;padding:10px 12px;background:#30243a;color:#fff0e4}
#feather-tutorial p{margin:0}
#guide-count{color:#ffd0b5;font-weight:750;font-size:.72rem;margin-bottom:4px!important}
#guide-text{line-height:1.4;font-size:.84rem}
#match-hit.match-window{background:#ffb99b;color:#24192c;outline:2px solid #ffe2bd;outline-offset:2px}
#match-timing-label{display:block;min-height:1.3em}
#guide-skip{align-self:start;min-height:44px}
@media(max-width:760px){.feather-standalone[data-rally-mode=playing] #feather-tutorial{order:-4}}
