body.giants-game { background:#f5faf0; color:#465f60; }
body.giants-game .site-header,body.giants-game > footer { display:none; }
body.giants-game #app { width:min(1100px,calc(100% - 28px)); max-width:1100px; padding:0; margin:0 auto; }
.fg-shell { min-height:100dvh; padding:8px 0 20px; }.fg-shell * { box-sizing:border-box; letter-spacing:0; }
.fg-shell h1,.fg-shell h2,.fg-shell h3,.fg-shell p { margin-top:0; }.fg-shell h2:focus { outline:none; }
.fg-shell button,.fg-shell .button,.fg-shell summary { min-width:48px; min-height:48px; font:inherit; line-height:1.3; border-radius:6px; }.fg-shell button { cursor:pointer; }.fg-shell button:disabled { cursor:default; }
.fg-shell button:focus-visible,.fg-shell a:focus-visible,.fg-shell input:focus-visible,.fg-shell summary:focus-visible { outline:4px solid #ac89c6; outline-offset:3px; }
.fg-shell .fg-primary { padding:11px 18px; font-size:18px; font-weight:750; color:white; background:#408b82; border:2px solid #36766d; box-shadow:0 3px 0 #35685c; }.fg-shell .fg-primary:hover { background:#337d75; }
.fg-shell .fg-secondary { color:#627c70; background:#fffdf1; border:2px solid #c6d2bb; padding:9px 14px; font-size:16px; }
.fg-toolbar { display:grid; grid-template-columns:auto 1fr auto 48px auto; gap:10px; align-items:center; min-height:66px; padding-bottom:8px; }.fg-toolbar h1 { font-family:inherit; font-size:18px; line-height:1.25; margin:0 0 4px; }.fg-toolbar span { font-size:13px; color:#849581; }
.fg-toolbar .fg-back { color:#79384b; font-size:14px; padding:8px; white-space:nowrap; }.fg-toolbar .fg-sound { width:48px; padding:0; }.fg-motion { display:flex; align-items:center; gap:5px; font-size:13px; }.fg-motion input { width:22px; height:22px; accent-color:#408b82; }
.fg-cover { text-align:center; }.fg-cover > span { display:block; color:#a38c4e; font-size:15px; font-weight:700; margin:12px 0 8px; }.fg-cover h2 { font-size:33px; color:#4b8069; margin:0 0 12px; }.fg-cover p { font-size:19px; line-height:1.45; max-width:840px; margin:0 auto 17px; }
.fg-cover-image { display:block; width:100%; height:auto; }.fg-cover > .fg-cover-image { max-height:440px; object-fit:contain; margin:20px auto 12px; }.card-art .fg-cover-image { width:100%; height:100%; object-fit:contain; background:#e9f2de; }.fg-cover .fg-cover-note { font-size:15px; }
.fg-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:4px 0; }.fg-heading > span { font-size:16px; font-weight:700; color:#a5894e; }.fg-heading h2 { font-family:inherit; font-size:23px; line-height:1.25; margin:0; color:#698d69; }.fg-instruction { font-family:inherit; font-size:20px; line-height:1.3; min-height:26px; margin:7px 0 9px; }
.fg-layout { display:grid; grid-template-columns:minmax(0,1fr) 180px; gap:15px; align-items:start; }
.fg-scales { position:relative; min-width:0; height:350px; border:2px solid #ccdcc1; border-radius:6px; isolation:isolate; }
.fg-glade,.fg-scale-wood { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }.fg-glade { border-radius:5px; z-index:0; }.fg-scale-wood { z-index:1; }
.fg-beam { transform-origin:450px 56px; transform-box:view-box; }.fg-released .fg-beam { transform:rotate(var(--beam-angle)); animation:fg-beam-release .8s ease-in-out both; }
.fg-pan { position:absolute; top:56px; width:38%; height:220px; z-index:3; }
.fg-pan-left { left:calc(var(--left-anchor) - 19%); }.fg-pan-right { left:calc(var(--right-anchor) - 19%); }
.fg-released .fg-pan-left { transform:translateY(var(--left-drop)); animation:fg-pan-left .8s ease-in-out both; }.fg-released .fg-pan-right { transform:translateY(var(--right-drop)); animation:fg-pan-right .8s ease-in-out both; }
.fg-ropes { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
.fg-expression-card { position:absolute; z-index:1; left:14%; right:14%; top:48px; min-height:153px; padding:8px 8px 7px; border:2px solid #d2cead; border-radius:5px; text-align:center; background:#fffef5; }
.fg-expression { display:block; font-size:30px; line-height:1.2; font-weight:800; color:#4f706c; white-space:nowrap; min-height:37px; }
.fg-expression-card label { display:block; height:34px; margin:4px 0 5px; font-size:13px; line-height:1.3; color:#80907a; font-weight:650; }
.fg-expression-card input { width:85px; height:52px; max-width:100%; font:inherit; font-size:29px; font-weight:750; text-align:center; border:2px solid #b3c8a7; border-radius:5px; color:#52746a; background:#fff; }
.fg-expression-card input.fg-value-correct { border-color:#93b587; background:#f2fae8; }.fg-expression-card input[readonly] { opacity:1; }
.fg-lock { position:absolute; z-index:2; top:75px; left:calc(50% - 28px); width:56px; text-align:center; }.fg-lock svg { width:32px; height:35px; display:block; margin:auto; }.fg-lock span { display:block; font-size:9px; line-height:1.4; color:#948567; margin-top:2px; }.fg-lock-open { opacity:.7; }
.fg-center-sign { position:absolute; z-index:4; left:calc(50% - 24px); top:167px; width:48px; height:48px; display:grid; place-items:center; border:2px solid #cfc5a4; border-radius:5px; color:#85704c; background:#fff8d8; font-size:33px; line-height:1; }
.fg-scoreboard { min-width:0; }.fg-current-giant { height:180px; width:145px; margin:0 auto; }.fg-giant { display:block; width:100%; height:100%; }.fg-scoreboard ol { list-style:none; margin:4px 0 8px; padding:0; display:flex; flex-direction:column; gap:4px; }.fg-scoreboard li { display:flex; align-items:center; justify-content:space-between; gap:5px; padding:5px 8px; border-left:3px solid #d1dec8; font-size:12px; line-height:1.3; color:#a5af9d; }.fg-scoreboard .fg-current-player { background:#fff4cf; color:#809375; border-color:#dfbf70; }.fg-scoreboard strong { font-weight:650; }
.fg-awards { display:grid; grid-template-columns:repeat(8,minmax(0,1fr)); gap:3px; }.fg-awards > span { display:grid; place-items:center; min-width:0; height:34px; color:#b1bba5; font-size:10px; border:1px solid #d4ddc6; border-radius:4px; background:#f2f6e8; }.fg-awards .fg-award-full { border-color:#deca86; background:#fff6cf; }.fg-medal { display:block; width:100%; height:100%; }.fg-awards .fg-medal { width:20px; height:28px; }
.fg-feedback { min-height:104px; margin:10px 0; padding:8px 12px; display:flex; flex-direction:column; justify-content:center; font-size:18px; line-height:1.4; background:#fffdf3; border:1px solid #d6dcc2; border-left:5px solid #dfc36c; border-radius:5px; }.fg-feedback strong { font-size:14px; color:#a17eae; }
.fg-controls { display:flex; align-items:center; gap:15px; min-height:59px; }.fg-signs { display:flex; gap:9px; flex:0 0 auto; }.fg-shell .fg-sign { display:grid; place-items:center; width:58px; height:56px; padding:0; font-size:33px; font-weight:750; color:#658b7a; background:#fffef5; border:2px solid #b8ccae; box-shadow:0 2px 0 #c5d4bb; }.fg-shell .fg-sign-selected { background:#fff0bc; border-color:#cbb16d; color:#8c7648; box-shadow:0 2px 0 #dac78c; }.fg-shell .fg-sign:disabled { opacity:1; }.fg-help-actions { display:flex; justify-content:flex-end; flex-wrap:wrap; gap:8px; margin-left:auto; }.fg-help-actions button { font-size:15px!important; }.fg-wait { font-size:18px; color:#829e75; }
.fg-finish { text-align:center; }.fg-finish h2 { font-size:30px; color:#5c896c; margin:12px 0; }.fg-finish > p { font-size:19px; line-height:1.45; max-width:900px; margin:0 auto 14px; }.fg-celebration { position:relative; width:min(660px,100%); margin:0 auto 14px; }.fg-celebration > img { width:100%; height:auto; border-radius:6px; border:5px solid #d7c894; }.fg-tournament-emblem { position:absolute; z-index:1; width:70px; height:85px; top:48%; left:calc(50% - 35px); }.fg-tournament-emblem strong { position:absolute; top:31px; left:0; width:100%; font-size:18px; line-height:1; color:#6c783c; text-shadow:0 1px #fff8d7; }.fg-tournament-emblem .fg-medal { filter:drop-shadow(0 2px 2px #78663d44); }
.fg-stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin:16px 0; }.fg-stats > div { display:flex; align-items:center; gap:12px; padding:12px; text-align:left; border:1px solid #c9d8be; border-radius:6px; background:#fffdf2; }.fg-stats strong { font-size:33px; color:#518d78; }.fg-stats span { font-size:15px; line-height:1.4; }.fg-finish-actions { display:flex; flex-wrap:wrap; justify-content:center; gap:12px; margin:17px 0; }.fg-finish details { max-width:850px; margin:14px auto; text-align:left; font-size:18px; line-height:1.5; }.fg-finish summary { cursor:pointer; padding:10px; }.fg-finish details p { padding:0 10px; }
.fg-help { width:min(610px,calc(100% - 24px)); max-height:calc(100dvh - 24px); overflow-y:auto; padding:24px; background:#fffdf3; color:#465f60; border:2px solid #b7c9a7; border-radius:8px; font-size:18px; line-height:1.5; }.fg-help h2 { font-size:25px; }.fg-help::backdrop { background:#47625688; }
@keyframes fg-beam-release { from { transform:rotate(0deg); } to { transform:rotate(var(--beam-angle)); } }
@keyframes fg-pan-left { from { transform:translateY(0); } to { transform:translateY(var(--left-drop)); } }
@keyframes fg-pan-right { from { transform:translateY(0); } to { transform:translateY(var(--right-drop)); } }
.fg-paused * { animation:none!important; transition:none!important; }
@media (min-width:901px) and (max-height:760px) { .fg-shell { padding-top:4px; }.fg-toolbar { min-height:60px; }.fg-feedback { min-height:96px; margin:8px 0; } }
@media (max-width:1000px) { .fg-toolbar { grid-template-columns:auto 1fr auto 48px; }.fg-motion { grid-column:1/-1; justify-self:end; }.fg-layout { grid-template-columns:minmax(0,1fr) 140px; gap:10px; }.fg-current-giant { width:125px; height:167px; }.fg-expression-card { left:6%; right:6%; }.fg-expression { font-size:28px; }.fg-expression-card label { font-size:12px; }.fg-awards { grid-template-columns:repeat(4,minmax(0,1fr)); }.fg-controls { flex-wrap:wrap; }.fg-help-actions { flex-basis:100%; } }
@media (max-width:760px) { .fg-play { display:flex; flex-direction:column; }.fg-heading { order:0; }.fg-instruction { order:1; }.fg-layout { display:contents; }.fg-scales { order:2; }.fg-feedback { order:3; min-height:112px; }.fg-controls { order:4; }.fg-scoreboard { order:5; display:grid; grid-template-columns:110px 1fr; gap:8px 12px; margin-top:18px; align-items:center; }.fg-current-giant { grid-row:1/3; width:105px; height:140px; }.fg-scoreboard ol { grid-column:2; display:grid; grid-template-columns:1fr 1fr; gap:5px; margin:0; }.fg-awards { grid-column:2; grid-template-columns:repeat(8,minmax(0,1fr)); }.fg-expression-card { left:12%; right:12%; }.fg-expression { font-size:28px; }.fg-help-actions { flex-basis:auto; }.fg-controls { gap:12px; } }
@media (max-width:600px) { body.giants-game #app { width:calc(100% - 14px); }.fg-toolbar { grid-template-columns:1fr auto 48px; gap:7px; }.fg-toolbar > div { grid-column:1/-1; grid-row:1; }.fg-toolbar h1 { font-size:18px; }.fg-toolbar .fg-back { grid-row:2; }.fg-toolbar [data-fg-action="help"] { grid-column:2; grid-row:2; }.fg-toolbar .fg-sound { grid-column:3; grid-row:2; }.fg-motion { grid-column:1/-1; justify-self:start; margin:2px 0 5px; }.fg-heading { flex-direction:column; align-items:start; gap:5px; }.fg-heading h2 { font-size:23px; }.fg-heading > span { font-size:14px; }.fg-instruction { font-size:18px; min-height:26px; }.fg-pan { width:42%; }.fg-pan-left { left:calc(var(--left-anchor) - 21%); }.fg-pan-right { left:calc(var(--right-anchor) - 21%); }.fg-expression-card { left:1%; right:1%; padding:8px 3px 6px; min-height:153px; }.fg-expression { font-size:23px; min-height:31px; }.fg-expression-card label { font-size:11px; line-height:1.25; height:37px; margin:4px 0 7px; }.fg-expression-card input { width:74px; height:52px; font-size:27px; }.fg-lock { top:78px; width:40px; left:calc(50% - 20px); }.fg-lock svg { width:27px; height:30px; }.fg-lock span { font-size:8px; }.fg-center-sign { width:38px; height:44px; left:calc(50% - 19px); font-size:28px; top:166px; }.fg-feedback { min-height:142px; font-size:17px; }.fg-controls { gap:12px; justify-content:center; }.fg-signs { width:100%; justify-content:center; }.fg-shell .fg-sign { width:62px; height:56px; }.fg-controls > .fg-primary { width:100%; }.fg-help-actions { justify-content:start; margin:0; width:100%; }.fg-scoreboard { grid-template-columns:90px 1fr; gap:7px; }.fg-current-giant { width:88px; height:126px; }.fg-scoreboard li { font-size:11px; padding:5px; }.fg-awards { gap:2px; }.fg-awards > span { height:30px; }.fg-awards .fg-medal { width:18px; height:26px; }.fg-cover h2 { font-size:28px; }.fg-cover p { font-size:17px; }.fg-cover .fg-cover-note { font-size:14px; }.fg-finish h2 { font-size:27px; }.fg-finish > p { font-size:17px; }.fg-stats { grid-template-columns:1fr; gap:7px; }.fg-finish-actions { flex-direction:column; }.fg-finish-actions > * { width:100%; }.fg-finish details { font-size:17px; }.fg-tournament-emblem { width:46px; height:57px; left:calc(50% - 23px); }.fg-tournament-emblem strong { font-size:14px; top:21px; } }
@media (prefers-reduced-motion:reduce) { .fg-shell * { animation:none!important; transition:none!important; } }
.fg-released .fg-beam,.fg-released .fg-pan-left,.fg-released .fg-pan-right { animation:none; }
.phase-success .fg-released .fg-beam,.phase-question .fg-released .fg-beam { animation:fg-beam-release .8s ease-in-out both; }
.phase-success .fg-released .fg-pan-left,.phase-question .fg-released .fg-pan-left { animation:fg-pan-left .8s ease-in-out both; }
.phase-success .fg-released .fg-pan-right,.phase-question .fg-released .fg-pan-right { animation:fg-pan-right .8s ease-in-out both; }
@media (max-width:600px) {
  .fg-feedback { min-height:116px; }
  .fg-controls { display:grid; grid-template-columns:1fr auto; gap:10px; }
  .fg-signs { width:auto; gap:6px; justify-content:start; }
  .fg-shell .fg-sign { width:48px; height:52px; }
  .fg-controls > .fg-primary { width:auto; padding:10px 11px; font-size:17px; }
  .fg-help-actions { grid-column:1/-1; }
  .fg-guided .fg-signs,.fg-done .fg-signs { grid-column:1/-1; justify-content:center; }
  .fg-guided > .fg-primary,.fg-done > .fg-primary { grid-column:1/-1; width:100%; }
}