/* THE FORGOTTEN NETWORK — ART-DIRECTED BATTLE FRONTEND.
   This file is exclusive to the homepage; /log and /hit retain their own layouts.
   All core game state remains in app.js / the authoritative Worker. */
:root{--realm-ink:#293d2c;--realm-deep:#152d25;--realm-gold:#c5a06c;--realm-paper:#f6e9cc;--realm-leaf:#45683d}
body.battle-page{background:#183929;color:var(--realm-ink);overflow-x:clip;font-family:Outfit,'Segoe UI',sans-serif}
body.battle-page .world{display:block;position:relative;isolation:isolate;min-height:1220px;height:auto;overflow:clip;padding:0 0 90px;background:#8fb8ce}
body.battle-page .sky{position:absolute;z-index:-3;inset:0;background-image:url('/art/field.jpg');background-position:center top;background-size:cover;background-repeat:no-repeat;transition:filter 1s}
body.battle-page .sky:after{background:linear-gradient(180deg,#1736262d 0%,transparent 20%,transparent 58%,#1b42211a 80%,#173827b8 100%);inset:0}
body.battle-page .weather-fx{z-index:2;overflow:hidden}
body.battle-page .nav{z-index:11;padding:17px clamp(20px,4vw,70px);height:70px;min-height:0;background:linear-gradient(180deg,#183e2eb8 0%,#183e2e29 85%,transparent);border:0}
body.battle-page .brand{font-size:22px;color:#fff9e6;text-shadow:0 2px 8px #1c3828}
body.battle-page .nav-right{gap:14px}
body.battle-page .live-state{display:none}
body.battle-page .live-state.offline{display:inline-flex}
body.battle-page .nav .daymark b{font-size:17px}
body.battle-page .battle-layout{display:grid;position:relative;z-index:4;grid-template-columns:minmax(0,.83fr) minmax(0,1.17fr);column-gap:clamp(15px,2.5vw,42px);align-items:start;width:min(1520px,calc(100% - 70px));margin:0 auto;padding-top:108px}
/* The painted scene is a cut of the approved art, without baked-in text or controls. */
body.battle-page .creature-slot{position:relative;width:100%;max-width:none;min-width:0;min-height:900px;display:flex;align-items:center;flex-direction:column;justify-content:flex-start;overflow:visible;text-align:center;isolation:isolate}
body.battle-page .scene-art{position:absolute;z-index:-1;pointer-events:none;top:224px;left:50%;width:min(50vw,760px);min-width:570px;aspect-ratio:670/591;transform:translateX(-49%);background:url('/art/forgotten-network.webp') center/100% 100% no-repeat;mask-image:radial-gradient(ellipse 71% 69% at 49% 49%,#000 66%,#000c 80%,transparent 100%);-webkit-mask-image:radial-gradient(ellipse 71% 69% at 49% 49%,#000 66%,#000c 80%,transparent 100%);filter:drop-shadow(0 8px 25px #283b3860);transition:filter .9s ease}
body.battle-page .creature-slot .phase-ribbon{position:relative;z-index:5;margin:0 auto 18px;padding:10px 19px;background:linear-gradient(140deg,#193a2be9,#1d4036ec);color:#f5edda;border:1px solid #e7daaf81;border-radius:100px;box-shadow:0 4px 16px #24402951;font-size:10px;max-width:95%;letter-spacing:.12em;text-transform:uppercase}
body.battle-page .phase-dot,body.battle-page .encounter-pulse{background:#e1f89b;box-shadow:0 0 0 4px #d5f6a833,0 0 9px 3px #d4f78b90}
body.battle-page .phase-sub{font-size:9px;color:#e8ddc3;border-color:#ece3cf55}
body.battle-page .nameplate{position:relative;z-index:5;max-width:100%;width:100%;margin:0;padding:0;background:none}
body.battle-page .versus{font:600 16px/1.1 'Cormorant Garamond',Georgia,serif;letter-spacing:.19em;color:#fcf4dd;text-shadow:0 3px 8px #2b463d;}
body.battle-page .versus:after{width:100px;margin-top:8px;background:#f8ebc99d}
body.battle-page .world-name{margin:8px 0 2px;line-height:.81;min-height:120px}
body.battle-page .world-name em{font:700 clamp(105px,10vw,163px)/.8 'Cormorant Garamond',Georgia,serif;letter-spacing:-.062em;color:#fffbed;text-shadow:0 3px 0 #304338,0 5px 5px #233725,0 16px 27px #1b302dc7;filter:none}
body.battle-page .world-name em.is-craig{font-size:clamp(80px,8.2vw,134px);letter-spacing:-.04em}
body.battle-page .plate-meta{margin:12px 0 15px;gap:12px}
body.battle-page .life{font-size:11px;color:#fff1cc;letter-spacing:.18em}
body.battle-page #mood{font-size:11px;background:#213d2edb;color:#f3efdf;border:1px solid #dbd4a172;border-radius:20px;padding:5px 12px}
body.battle-page .bark{z-index:5;margin:0 auto;max-width:530px;padding:0 8px;color:#fff8e7;font:600 italic clamp(17px,1.7vw,23px)/1.23 'Cormorant Garamond',Georgia,serif;text-shadow:0 2px 4px #284537,0 4px 14px #183622}
body.battle-page .weather{z-index:5;margin:6px auto 0;max-width:540px;color:#faf2d6;font:600 clamp(10px,.85vw,12px)/1.4 'IBM Plex Mono',monospace;letter-spacing:.02em;text-shadow:0 2px 5px #284537}
/* Retain the original semantic SVG / attack FX and place the FX over the illustrated creature. */
body.battle-page .sprite{position:absolute;z-index:4;left:50%;top:315px;width:min(440px,35vw);height:350px;margin:0;transform:translateX(-37%);pointer-events:none;filter:none}
body.battle-page .sprite .entity{opacity:0;pointer-events:none}
body.battle-page .scene-footnote{z-index:5;position:absolute;top:840px;left:50%;width:min(460px,92%);transform:translateX(-50%);padding:12px 16px;border:1px solid #f6e5be73;border-radius:6px;background:#193c2eac;color:#f7efdd;font:500 14px/1.45 'Cormorant Garamond',Georgia,serif;box-shadow:0 8px 24px #1b3b2863;backdrop-filter:blur(5px)}
body.battle-page .world.mode-exposed .scene-art{filter:drop-shadow(0 0 20px #ffe489c9) saturate(1.14)}
body.battle-page .world.mode-guarded .scene-art{filter:drop-shadow(0 0 24px #9be1e8bb)}
body.battle-page .world.mode-unraveling .scene-art{animation:paint-unravel 6s steps(1) infinite}
body.battle-page .world.mode-panic .scene-art{filter:drop-shadow(0 0 15px #ff8c70b5)}
body.battle-page .world.mode-sleepy .scene-art{filter:saturate(.76) brightness(.9)}
body.battle-page .world.jackpot-flash .scene-art{filter:drop-shadow(0 0 48px #ffe88f) brightness(1.1)}
body.battle-page .world.hit-shake .scene-art{animation:paint-shake .46s ease-out}
@keyframes paint-unravel{0%,93%,97%,100%{transform:translateX(-49%)}94%{transform:translateX(-50.5%) skewX(1.5deg)}96%{transform:translateX(-48%) skewX(-1deg)}}
@keyframes paint-shake{0%,100%{transform:translateX(-49%)}30%{transform:translateX(-51%)}60%{transform:translateX(-47%)}80%{transform:translateX(-49.5%)}}
/* Upper-right world event: an etched notice, grown over rather than a modern popup. */
body.battle-page .battle-right{position:relative;min-width:0}
body.battle-page .encounter-banner{position:relative;inset:auto;width:min(440px,82%);margin:0 24px 30px auto;min-height:188px;padding:26px 31px 25px;background:linear-gradient(155deg,#1c372edc,#172e29f5),url('/art/ledger.jpg') center/cover;border:1px solid #c1b589d9;border-radius:9px 14px 8px 12px;color:#fff5df;box-shadow:0 4px 0 #35402a,0 13px 24px #12332170,inset 0 0 0 5px #bba36f24;backdrop-filter:blur(6px);isolation:isolate}
body.battle-page .encounter-banner:before{content:"";position:absolute;inset:5px;z-index:-1;width:auto;background:none;border:1px solid #d8c48b41;border-radius:5px;pointer-events:none}
body.battle-page .encounter-banner:after{content:"";position:absolute;z-index:2;right:-23px;top:-33px;width:120px;height:126px;background:url('/art/vine-c.webp') center/contain no-repeat;pointer-events:none;filter:drop-shadow(0 4px 4px #1b382d66)}
body.battle-page .event-garland{position:absolute;z-index:2;top:-31px;left:-20px;right:20px;height:53px;background:url('/art/garland.svg') center top/100% 100% no-repeat;pointer-events:none;filter:drop-shadow(0 2px 2px #253e2859)}
body.battle-page .encounter-top{position:relative;z-index:2;font-size:10px;letter-spacing:.12em;color:#e4edb8}
body.battle-page .encounter-top small{font-size:11px;color:#fbf2dc}
body.battle-page .encounter-banner h2{position:relative;z-index:2;margin:13px 0 5px;color:#fff3d9;font:600 clamp(29px,2.8vw,40px)/1 'Cormorant Garamond',Georgia,serif;letter-spacing:-.025em;text-transform:uppercase}
body.battle-page .encounter-banner p{position:relative;z-index:2;margin:0 0 15px;color:#f1ecdd;font:500 clamp(16px,1.4vw,19px)/1.3 'Cormorant Garamond',Georgia,serif}
body.battle-page .encounter-effect{position:relative;z-index:2;padding-top:11px;border-top:1px solid #ddd1ac70;font:600 12px/1.4 'IBM Plex Mono',monospace;color:#eed18c}
/* One continuous illustrated battle ledger. Ivy lives OUTSIDE the content gutter. */
body.battle-page .camp{display:block;position:relative;z-index:3;margin:0;padding:0;background:none}
body.battle-page .camp:before,body.battle-page .camp:after{display:none}
body.battle-page .camp-inner{max-width:none;margin:0;padding:0;position:relative}
body.battle-page .battle-ledger{position:relative;isolation:isolate;padding:45px clamp(26px,3.3vw,54px) 29px;background:linear-gradient(150deg,#fff8eaf5,#f2e1bfee 94%),url('/art/parchment.jpg') center/cover;border:2px solid #bd9f67;border-radius:14px 14px 8px 10px;color:#30432c;box-shadow:0 0 0 5px #3e482e80,0 12px 0 #343823,0 22px 38px #1e352b91,inset 0 0 33px #bfa16957}
body.battle-page .battle-ledger:before{content:"";position:absolute;z-index:2;inset:9px;border:1px solid #ad94645c;border-radius:6px;pointer-events:none}
body.battle-page .battle-ledger:after{content:"";position:absolute;z-index:7;pointer-events:none;top:-39px;right:-33px;width:140px;height:158px;background:url('/art/vine-c.webp') center/contain no-repeat;filter:drop-shadow(2px 5px 2px #243e215e)}
body.battle-page .floral-left,body.battle-page .floral-right{position:absolute;z-index:6;pointer-events:none;top:16px;bottom:13px;width:37px;left:-20px;background:url('/art/vine-rail.svg') center top/37px 120px repeat-y;filter:drop-shadow(2px 3px 2px #28401d55);opacity:.9}
body.battle-page .floral-right{left:auto;right:-20px;transform:scaleX(-1)}
body.battle-page .ledger-garland{position:absolute;z-index:8;pointer-events:none;top:-29px;left:-27px;right:5%;height:76px;background:url('/art/garland.svg') center top/100% 100% no-repeat;filter:drop-shadow(0 2px 2px #24432356)}
body.battle-page .field-report{position:relative;z-index:3;padding:0 0 16px;margin:0;border:0;border-bottom:1px solid #c7ad7b;background:transparent;box-shadow:none}
body.battle-page .section-kicker{font:700 14px/1.25 'IBM Plex Mono',monospace;letter-spacing:.065em;text-transform:uppercase;color:#4a6945}
body.battle-page .field-report h2{margin:0 0 4px;color:#1c3828;font:700 clamp(34px,3.3vw,46px)/.94 'Cormorant Garamond',Georgia,serif;text-transform:uppercase;letter-spacing:-.02em}
body.battle-page .field-report p{margin:0;max-width:46em;color:#3c4a34;font:600 18px/1.35 'Cormorant Garamond',Georgia,serif}
body.battle-page .field-bonus{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;max-width:none;min-width:0;margin:13px 0 2px;padding:14px 16px 12px;border:1px solid #c9b48a;border-radius:8px;background:#fff9ec;text-align:center}
body.battle-page .field-mod{display:flex;align-items:baseline;justify-content:center;flex-wrap:wrap;gap:6px 12px;width:100%;min-width:0}
body.battle-page .field-bonus .field-mod>span{font:600 13px/1 'IBM Plex Mono',monospace;letter-spacing:.1em;text-transform:uppercase;color:#8a6234;white-space:nowrap}
body.battle-page .field-bonus strong{min-width:0;max-width:100%;font:700 28px/1.25 'IBM Plex Mono',monospace;color:#1d6b34}
body.battle-page .field-bonus .mod-good,body.battle-page .field-bonus .mod-bad,body.battle-page .field-bonus .mod-neutral,body.battle-page .field-bonus .mod-sep{display:inline;color:#1d6b34;font:700 28px/1.25 'IBM Plex Mono',monospace;letter-spacing:0;white-space:normal}
body.battle-page .field-when{display:flex;flex-direction:column;align-items:center;justify-content:center;max-width:36rem;text-align:center;font:500 15px/1.45 'IBM Plex Mono',monospace;color:#6a5844}
body.battle-page .field-bonus .field-when span{font:inherit;letter-spacing:0;text-transform:none;color:inherit;white-space:normal}
body.battle-page .vitals{position:relative;z-index:3;margin:0;padding:15px 0 13px!important;border:0;border-radius:0;background:none;box-shadow:none}
body.battle-page .vitals-top{align-items:flex-end}
body.battle-page .hp-number{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px;margin-top:5px}
body.battle-page .hp-heart{width:36px;height:36px;flex:none;align-self:center;margin-right:3px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 1px #c6a56a}
body.battle-page .hp-number strong{font:800 clamp(31px,3.5vw,48px)/.98 Outfit,sans-serif;letter-spacing:-.055em;color:#263a2b;white-space:nowrap}
body.battle-page .hp-total{font:600 16px/1.3 'IBM Plex Mono',monospace;color:#4e4a38;white-space:nowrap}
body.battle-page .hp-unit{font-size:16px;color:#3d5a36;padding-bottom:3px}
body.battle-page .bar-track{height:17px;margin-top:12px;padding:2px;border:2px solid #586d3c;background:#2d4029;box-shadow:0 0 0 1px #dbc48f,inset 0 2px 4px #1b301d70}
body.battle-page .bar-fill{background:linear-gradient(180deg,#e4fbb3 0%,#9acb68 36%,#4fa34b 100%);box-shadow:inset 0 1px 0 #fff9}
body.battle-page .vitals-bottom{margin-top:8px;font:600 17px/1.3 'Cormorant Garamond',Georgia,serif;color:#3e3e2c}
body.battle-page .strike{margin-top:12px;padding-top:10px;border-top:1px solid #d3bf99}
body.battle-page .strike-top{margin:0;font:700 clamp(18px,2.1vw,22px)/1.25 'Cormorant Garamond',Georgia,serif;color:#3f3220}
body.battle-page .strike-top b{font-weight:700;color:#2c3d28}
body.battle-page .strike-track{height:14px;margin-top:8px;border:1px solid #c1a777;background:#eadfca}
body.battle-page .stats{position:relative;z-index:3;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:4px 0 12px}
body.battle-page .stats>div{min-width:0;position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-height:116px;padding:13px 9px 9px;border:1px solid #d3ba8b;border-radius:6px;background:linear-gradient(135deg,#fff8e5b6,#ead8b881),url('/art/parchment.jpg') center/cover;box-shadow:inset 0 0 0 2px #fff7e36e,0 2px 3px #866a423b;color:#314431}
body.battle-page .stats .stat-glyph{align-self:flex-start;width:40px;height:40px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 1px #c6a56a}
body.battle-page .stats span:not(.stat-glyph){font:700 15px/1.2 'Cormorant Garamond',Georgia,serif;text-transform:uppercase;letter-spacing:.025em;color:#3d5236}
body.battle-page .stats strong{font:750 clamp(26px,2.3vw,34px)/1 Outfit,sans-serif;letter-spacing:-.04em;color:#23362c;overflow-wrap:anywhere}
body.battle-page .stats small{font:600 15px/1.25 'Cormorant Garamond',Georgia,serif;color:#4a4c3c}
body.battle-page .attack-heading{position:relative;z-index:3;display:flex;align-items:center;justify-content:space-between;gap:8px;margin:15px 0 7px;color:#384c37;border-top:1px solid #d2bd93;padding-top:10px;font:600 24px/1 'Cormorant Garamond',Georgia,serif;letter-spacing:0}
body.battle-page .hud{position:relative;z-index:4;width:100%;gap:7px;padding:0;margin:0}
body.battle-page .action{width:100%}
body.battle-page .attack{min-height:73px;padding:8px 14px 8px 12px;gap:12px;background:linear-gradient(145deg,#345444,#173a31 75%);color:#fff6dd;border:2px solid #c6a16b;border-radius:10px;box-shadow:0 4px 0 #455038,0 7px 14px #4b4c2b44;animation:none}
body.battle-page .attack:hover:not(:disabled){background:linear-gradient(145deg,#416d51,#204637 75%);box-shadow:0 4px 0 #455038,0 0 16px #a6cb7e6a}
body.battle-page .attack-copy b{font:600 clamp(20px,2.1vw,26px)/1.05 'Cormorant Garamond',Georgia,serif;letter-spacing:0}
body.battle-page .attack-copy small{font:500 14px/1.35 'IBM Plex Mono',monospace;color:#dedbb8}
body.battle-page .attack-icon{width:52px;height:52px;border:1px solid #ebcd83;box-shadow:0 0 0 3px #143025,0 0 0 4px #ac965f;border-radius:50%}
body.battle-page .attack-icon img{inset:-12%;width:124%;height:124%;object-fit:cover}
body.battle-page .attack-arrow{color:#e6d197}
body.battle-page .slot{width:24px;height:24px;left:-7px;top:-7px;border:1px solid #ad8853;background:#faedc9;color:#35503b;font-size:12px}
body.battle-page .attack.on-cooldown,body.battle-page .attack:disabled{background:linear-gradient(145deg,#5a5b4b,#344339);opacity:.82;border-color:#c1ae84;color:#e9e2cb;box-shadow:0 4px 0 #384435;cursor:not-allowed}
body.battle-page .attack:focus-visible{outline:3px solid #254f35;outline-offset:4px}
body.battle-page .cooldown{margin:5px 0;color:#3f4d32;text-shadow:none;font:600 15px/1.35 'IBM Plex Mono',monospace}
body.battle-page .turnstile-wrap{max-width:100%;overflow-x:auto}
body.battle-page .result{width:100%;box-shadow:0 2px 0 #bea471,0 3px 15px #5849293f;border:1px solid #b99a62;border-radius:6px;margin:0 0 10px;padding:15px;background:#fff1d3 url('/art/parchment.jpg') center/cover}
body.battle-page .result h2{font-family:'Cormorant Garamond',Georgia,serif}
body.battle-page .result>strong{font-size:29px}
body.battle-page .swing-heading{position:relative;z-index:3;display:flex;justify-content:space-between;flex-wrap:wrap;gap:5px 12px;margin:16px 0 7px;color:#3f5234;font:700 16px/1.2 'Cormorant Garamond',Georgia,serif;letter-spacing:.045em}
body.battle-page .swing-heading span{font:500 13px/1.3 'IBM Plex Mono',monospace;letter-spacing:0;color:#5e4e38}
body.battle-page .swing-counts{position:relative;z-index:3;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0 0 14px}
body.battle-page .swing-counts>div{display:flex;align-items:center;min-width:0;gap:7px;padding:8px 9px;background:linear-gradient(145deg,#314e40,#19382f);border:1px solid #d3b47b;border-radius:8px;color:#faedcc;box-shadow:0 3px 0 #465238,0 5px 10px #524b2c36}
body.battle-page .swing-counts img{width:34px;height:34px;flex:none;border:1px solid #e4c68c;box-shadow:0 0 0 2px #203d32;border-radius:50%}
body.battle-page .swing-counts span{font:600 clamp(15px,1.3vw,18px)/1 'Cormorant Garamond',Georgia,serif;letter-spacing:.01em;text-transform:uppercase;color:#f9ecd5}
body.battle-page .swing-counts b{margin-left:auto;font:700 24px/1 'Cormorant Garamond',Georgia,serif;color:#f8edd6}
body.battle-page .achievements{position:relative;z-index:3;margin:13px 0 0;border-top:1px solid #cbb183;padding-top:4px;background:none;box-shadow:none}
body.battle-page .achievements .panel-top{padding:7px 0 9px!important;background:none;border-bottom:1px solid #d4bd97}
body.battle-page .achievements .panel-top h2{font:600 24px/1 'Cormorant Garamond',Georgia,serif;color:#384c37}
body.battle-page .achievements .panel-top>span{color:#4e3f2c;font-size:16px}
body.battle-page .ach-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:10px 0 0!important}
body.battle-page .ach{display:flex;align-items:center;gap:7px;min-width:0;padding:7px;border:1px solid #d1b98e;border-radius:7px;background:#fff8e475;box-shadow:inset 0 1px 0 #fff8,0 1px 2px #6b593d18}
body.battle-page .ach .medal,body.battle-page .ach .medal img{width:39px;height:39px;flex:none}
body.battle-page .ach .lock{width:24px;height:24px}
body.battle-page .ach b{display:block;font:700 17px/1.2 'Cormorant Garamond',Georgia,serif;letter-spacing:.002em;color:#243226}
body.battle-page .ach span{font-size:15px;line-height:1.3}
body.battle-page .ach.off{background:#e9e0cf9d;border-color:#cfc3ad}
body.battle-page .ach.off b{color:#736d60}
body.battle-page .trophy{margin:16px 0 0;padding:8px;border-top:1px solid #b6a17c}
body.battle-page .trophy[hidden]{display:none}
/* Lower archive belongs to the SAME world, with unbroken natural framing. */
body.battle-page .archive{position:relative;z-index:1;margin-top:-15px;padding:60px 22px 45px;background:linear-gradient(180deg,#173c2bed 0%,#193a2aeb 40%,#10291f 100%),url('/art/field.jpg') center bottom/cover}
body.battle-page .archive:before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,#051f1345,transparent 15%,transparent 85%,#051f1345)}
body.battle-page .archive-inner{position:relative;z-index:2;width:min(1330px,100%);margin:0 auto}
body.battle-page .archive-heading{text-align:center;color:#f5e7ca;margin:0 auto 26px}
body.battle-page .archive-heading span{font:600 10px 'IBM Plex Mono',monospace;letter-spacing:.18em;color:#c7dfaa}
body.battle-page .archive-heading h2{font:600 clamp(38px,4vw,56px)/.98 'Cormorant Garamond',Georgia,serif;margin:3px 0}
body.battle-page .archive-heading p{font:500 16px 'Cormorant Garamond',Georgia,serif;margin:0;color:#e4e5cf}
body.battle-page .archive .below{gap:20px;margin:0 0 24px;grid-template-columns:1.12fr .88fr}
body.battle-page .archive .board{background:#f4e7cd url('/art/parchment.jpg') center/cover;border:1px solid #b79a6f;border-radius:9px;box-shadow:0 5px 0 #2c3022,0 11px 25px #04190f65}
body.battle-page .archive .vined{isolation:isolate;overflow:visible}
body.battle-page .archive .vined:before,body.battle-page .archive .vined:after{width:40px;left:-18px;right:auto;top:7px;bottom:7px;background:url('/art/vine-rail.svg') center top/37px 120px repeat-y;filter:drop-shadow(0 2px 1px #213a1f55);opacity:.82}
body.battle-page .archive .vined:after{left:auto;right:-18px;transform:scaleX(-1)}
body.battle-page .archive .vine-canopy,body.battle-page .archive .vine-root{display:none}
body.battle-page .archive .vined>.panel-top{padding:15px 25px!important}
body.battle-page .archive .panel-top h2{font:600 26px/1 'Cormorant Garamond',Georgia,serif}
body.battle-page .archive .event{padding:14px 22px 15px!important}
body.battle-page .archive .event-copy p{font-size:17px}
body.battle-page .archive .log-filters{padding:7px 25px 10px}
body.battle-page .archive .briefing{padding:20px 25px!important}
body.battle-page .archive .sitefoot{margin:0;background:#e9ddc9f0}
body.battle-page .archive .sitefoot-inner{padding:20px 30px;padding-bottom:max(20px,calc(var(--camp-art-height) * .6))}
body.battle-page .archive .sitefoot-art:before{background:linear-gradient(180deg,#e9ddc9f2,#e9ddc900)}
body.battle-page .archive .sitefoot-note p{font:600 18px/1.4 'Cormorant Garamond',Georgia,serif;color:#33402c}
body.battle-page .archive .sitefoot-note span{font:700 12px/1.3 'IBM Plex Mono',monospace;letter-spacing:.09em;color:#7d5a2e}
body.battle-page .returned{margin-bottom:16px;background:#fdf4de;border-color:#c7ad7b}
body.battle-page .returned span{font:700 12px/1.3 'IBM Plex Mono',monospace;letter-spacing:.09em;color:#986f3b}
body.battle-page .returned p{font:600 17px/1.4 'Cormorant Garamond',Georgia,serif;color:#3f4a34}
body.battle-page .world-toast{font-family:'Cormorant Garamond',Georgia,serif;background:linear-gradient(145deg,#203d30f5,#153328f5);border:1px solid #c9ac77;border-radius:7px;box-shadow:0 5px 0 #35442c,0 12px 30px #0921137f}
/* stage styling at narrow widths: never overlap the parchment with the scenic art. */
@media(min-width:1600px){body.battle-page .world{min-height:1300px}body.battle-page .creature-slot .scene-art{width:800px;min-width:0}}
@media(max-width:1190px){
 body.battle-page .battle-layout{width:min(790px,calc(100% - 38px));grid-template-columns:minmax(0,1fr);gap:0;padding-top:92px}
 body.battle-page .creature-slot{min-height:715px}
 body.battle-page .scene-art{width:660px;min-width:0;top:220px}
 body.battle-page .sprite{width:430px;top:315px;transform:translateX(-36%)}
 body.battle-page .scene-footnote{top:670px}
 body.battle-page .battle-right{padding:0 9px}
 body.battle-page .encounter-banner{margin:0 auto 35px;width:min(510px,90%)}
 body.battle-page .battle-ledger{padding:42px 44px 28px}
 body.battle-page .world{min-height:0;padding-bottom:70px}
}
@media(max-width:740px){
 body.battle-page .nav{padding:12px 14px;min-height:56px;height:57px}
 body.battle-page .brand{font-size:19px}body.battle-page .nav-right{gap:7px}
 body.battle-page .live-state{font-size:9px;padding:5px 7px}
 body.battle-page .battle-layout{width:min(100% - 24px,570px);padding-top:80px}
 body.battle-page .creature-slot{min-height:570px}
 body.battle-page .creature-slot .phase-ribbon{margin:0 auto 12px;padding:8px 12px;font-size:9px}
 body.battle-page .phase-sub{display:none}
 body.battle-page .versus{font-size:13px}
 body.battle-page .world-name{min-height:85px;margin-top:7px}
 body.battle-page .world-name em{font-size:102px}
 body.battle-page .world-name em.is-craig{font-size:78px}
 body.battle-page .plate-meta{margin:7px 0 10px}
 body.battle-page .bark{font-size:18px}
 body.battle-page .weather{font-size:10px}
 body.battle-page .scene-art{width:min(100vw,510px);top:177px;min-width:0;transform:translateX(-49%)}
 body.battle-page .sprite{top:228px;width:min(73vw,340px);height:245px;transform:translateX(-37%)}
 body.battle-page .scene-footnote{top:545px;width:92%;font-size:12px;padding:10px}
 body.battle-page .battle-right{padding:0 5px}
 body.battle-page .encounter-banner{margin:35px auto 33px;width:calc(100% - 24px);min-height:0;padding:22px 22px 20px}
 body.battle-page .encounter-banner h2{font-size:32px}
 body.battle-page .encounter-banner p{font-size:17px}
 body.battle-page .battle-ledger{padding:35px 22px 20px}
 body.battle-page .floral-left,body.battle-page .floral-right{width:25px;background-size:25px 95px;left:-12px}
 body.battle-page .floral-right{left:auto;right:-12px}
 body.battle-page .ledger-garland{top:-26px;left:-13px;right:0;height:56px}
 body.battle-page .battle-ledger:after{width:85px;height:92px;right:-16px;top:-23px}
 body.battle-page .field-report h2{font-size:34px}
 body.battle-page .field-report p{font-size:17px}
 body.battle-page .field-bonus{padding:12px 12px 10px;gap:6px}
 body.battle-page .field-mod{flex-direction:column;align-items:center;gap:5px}
 body.battle-page .field-bonus strong{font-size:20px}
 body.battle-page .field-bonus .mod-sep{display:none}
 body.battle-page .field-bonus .mod-good,body.battle-page .field-bonus .mod-bad,body.battle-page .field-bonus .mod-neutral{display:block;font-size:20px;white-space:nowrap}
 body.battle-page .field-when{max-width:100%;font-size:13px;margin-top:2px}
 body.battle-page .vitals-top{align-items:flex-start}
 body.battle-page .hp-unit{padding:0;line-height:1.2}
 body.battle-page .hp-number{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;column-gap:8px;row-gap:1px}
 body.battle-page .hp-heart{grid-row:1 / span 2;width:30px;height:30px;margin:0}
 body.battle-page .hp-number strong{grid-column:2;font-size:clamp(26px,7vw,40px)}
 body.battle-page .hp-total{grid-column:2;width:auto;margin:0;font-size:14px}
 body.battle-page .stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
 body.battle-page .stats>div{min-height:106px}
 body.battle-page .stats strong{font-size:29px}
 body.battle-page .swing-counts{gap:6px}
 body.battle-page .swing-counts>div{padding:7px 5px;gap:5px;flex-wrap:wrap}
 body.battle-page .swing-counts img{width:25px;height:25px}
 body.battle-page .swing-counts span{font-size:15px}
 body.battle-page .swing-counts b{font-size:22px}
 body.battle-page .ach-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 body.battle-page .archive{padding:40px 23px 25px}
 body.battle-page .archive .below{grid-template-columns:minmax(0,1fr)}
 body.battle-page .archive .vined>.panel-top{padding:15px 22px!important}
 body.battle-page .archive .event{padding:12px 19px!important}
 body.battle-page .archive .briefing{padding:20px!important}
 body.battle-page .archive .log-filters{padding:7px 22px 10px}
}
@media(max-width:400px){
 body.battle-page .creature-slot{min-height:520px}
 body.battle-page .scene-art{top:185px}
 body.battle-page .scene-footnote{top:492px}
 body.battle-page .encounter-banner{margin-top:42px}
 body.battle-page .field-report h2{font-size:30px}
 body.battle-page .ach-grid{grid-template-columns:1fr 1fr}
 body.battle-page .swing-counts img{display:none}
 body.battle-page .swing-counts>div{flex-wrap:nowrap}
 body.battle-page .swing-heading span{width:100%}
}
@media(max-width:340px){
 body.battle-page .field-bonus strong,body.battle-page .field-bonus .mod-good,body.battle-page .field-bonus .mod-bad,body.battle-page .field-bonus .mod-neutral{font-size:17px;white-space:normal}
}
@media(prefers-reduced-motion:reduce){body.battle-page .scene-art{animation:none!important;transition:none!important}}
/* Preserve the actual shared weather art when the server rotates the field. */
body.battle-page.field-dawn .sky{background-image:url('/art/field-dawn.jpg')}
body.battle-page.field-mist .sky{background-image:url('/art/field-mist.jpg')}
body.battle-page.field-drizzle .sky{background-image:url('/art/field-rain.jpg')}
body.battle-page.field-storm .sky{background-image:url('/art/field-storm.jpg')}
body.battle-page.field-golden .sky{background-image:url('/art/field-golden.jpg')}
body.battle-page.field-dusk .sky{background-image:url('/art/field-dusk.jpg')}
body.battle-page.field-night .sky{background-image:url('/art/field-night.jpg')}
/* Final art blend: original image silhouette stays solid; its cut edge dissolves into live weather. */
body.battle-page .scene-art{-webkit-mask-image:none;mask-image:none}
body.battle-page .scene-footnote{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important;padding:0!important}
@media(min-width:1191px){
 body.battle-page .battle-ledger{padding-top:36px}
 body.battle-page .field-report{padding-bottom:12px}
 body.battle-page .vitals{padding:11px 0 9px!important}
 body.battle-page .strike{display:flex;align-items:center;gap:14px;padding-top:8px;margin-top:8px}
 body.battle-page .strike-top{min-width:240px;width:42%;margin:0}
 body.battle-page .strike-track{flex:1;margin:0}
 body.battle-page .stats>div{min-height:94px;padding:9px 9px 7px}
 body.battle-page .stats{margin:1px 0 8px}
 body.battle-page .attack-heading{margin:8px 0 5px;padding-top:7px}
 body.battle-page .attack{min-height:62px}
 body.battle-page .attack-icon{width:42px;height:42px}
 body.battle-page .swing-heading{margin:12px 0 5px}
 body.battle-page .swing-counts>div{padding:6px 8px}
 body.battle-page .swing-counts img{width:28px;height:28px}
 body.battle-page .swing-counts{margin-bottom:9px}
 body.battle-page .achievements{margin-top:8px}
 body.battle-page .ach-grid{max-height:220px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#b29c75 transparent;padding-right:4px!important}
}
@media(max-width:740px){body.battle-page .creature-slot{min-height:545px}body.battle-page .encounter-banner{margin-top:23px}}
@media(max-width:400px){body.battle-page .creature-slot{min-height:505px}body.battle-page .encounter-banner{margin-top:32px}}
/* Weather also grades the concept-art creature, not just the live field behind it. */
body.battle-page .world.field-dawn .scene-art{filter:saturate(.9) sepia(.12)}
body.battle-page .world.field-mist .scene-art{filter:saturate(.64) brightness(1.1) contrast(.87)}
body.battle-page .world.field-drizzle .scene-art{filter:brightness(.82) saturate(.68)}
body.battle-page .world.field-storm .scene-art{filter:brightness(.64) saturate(.55) contrast(1.13)}
body.battle-page .world.field-golden .scene-art{filter:sepia(.12) brightness(1.08) saturate(1.15)}
body.battle-page .world.field-dusk .scene-art{filter:sepia(.15) brightness(.82) saturate(.86)}
body.battle-page .world.field-night .scene-art{filter:brightness(.47) saturate(.58) hue-rotate(12deg)}
body.battle-page .stats img.stat-glyph{display:block;flex:none}
/* Align the opening composition to the approved illustration at wide desktop sizes. */
@media(min-width:1191px){
 body.battle-page .battle-layout{padding-top:81px}
 body.battle-page .encounter-banner{padding:22px 28px 19px;min-height:170px;margin-bottom:23px}
 body.battle-page .encounter-banner h2{margin:11px 0 5px}
 body.battle-page .encounter-banner p{margin-bottom:11px}
 body.battle-page .encounter-effect{padding-top:9px}
}
/* The painted still is scenery only. The living SVG is the entity again. */
body.battle-page .scene-art{display:none}
body.battle-page .sprite{position:relative;z-index:4;left:auto;top:auto;width:min(460px,88%);height:clamp(280px,36vh,400px);margin:8px auto 0;transform:none;pointer-events:none}
body.battle-page .sprite .entity{opacity:1}
body.battle-page .creature-slot{min-height:0}
body.battle-page .world.field-dawn .sprite{filter:saturate(.92) sepia(.08)}
body.battle-page .world.field-mist .sprite{filter:saturate(.7) brightness(1.05)}
body.battle-page .world.field-drizzle .sprite{filter:brightness(.9) saturate(.75)}
body.battle-page .world.field-storm .sprite{filter:brightness(.78) saturate(.7) contrast(1.08)}
body.battle-page .world.field-golden .sprite{filter:sepia(.08) brightness(1.05) saturate(1.12)}
body.battle-page .world.field-dusk .sprite{filter:sepia(.12) brightness(.9) saturate(.9)}
body.battle-page .world.field-night .sprite{filter:brightness(.72) saturate(.7) hue-rotate(8deg)}
/* Full record uses the same mark, parchment and side vines as the battlefield. */
body.log-page{background:#10291f;color:#30432c}
body.log-page:before{background:linear-gradient(90deg,#051f1380,transparent 14%,transparent 86%,#051f1380),linear-gradient(180deg,#173c2bf5 0%,#163528f2 38%,#10291f 100%),url('/art/field.jpg') center bottom/cover}
body.log-page .log-wrap{max-width:920px;padding:28px 28px 64px}
body.log-page .log-top{align-items:center;margin-bottom:28px}
body.log-page .log-top .brand{color:#fff9e6;font-size:22px;font-weight:800;letter-spacing:-.045em;text-shadow:0 2px 8px #1c3828;text-decoration:none}
body.log-page .brand-tld{color:#d6f5a8}
body.log-page .log-count{color:#f6edd6;font:600 13px/1 'IBM Plex Mono',monospace;letter-spacing:.08em;text-transform:uppercase;text-shadow:0 2px 6px #143018}
body.log-page .log-board{position:relative;isolation:isolate;overflow:visible;margin-top:18px;padding:42px 8px 16px;background:linear-gradient(150deg,#fff8eaf5,#f2e1bfee 94%),url('/art/parchment.jpg') center/cover;border:2px solid #bd9f67;border-radius:14px 14px 8px 10px;box-shadow:0 0 0 5px #3e482e80,0 12px 0 #343823,0 22px 38px #1e352b91,inset 0 0 33px #bfa16957}
body.log-page .log-board:before{content:"";position:absolute;z-index:2;inset:9px;width:auto;height:auto;border:1px solid #ad94645c;border-radius:6px;background:none;pointer-events:none}
body.log-page .log-board:after{content:"";position:absolute;z-index:7;top:-39px;right:-33px;bottom:auto;width:140px;height:158px;background:url('/art/vine-c.webp') center/contain no-repeat;filter:drop-shadow(2px 5px 2px #243e215e);pointer-events:none}
body.log-page .floral-left,body.log-page .floral-right{position:absolute;z-index:6;pointer-events:none;top:16px;bottom:13px;width:37px;left:-20px;background:url('/art/vine-rail.svg') center top/37px 120px repeat-y;filter:drop-shadow(2px 3px 2px #28401d55);opacity:.9}
body.log-page .floral-right{left:auto;right:-20px;transform:scaleX(-1)}
body.log-page .ledger-garland{position:absolute;z-index:8;pointer-events:none;top:-29px;left:-27px;right:5%;height:76px;background:url('/art/garland.svg') center top/100% 100% no-repeat;filter:drop-shadow(0 2px 2px #24432356)}
body.log-page .vine-canopy,body.log-page .vine-root{display:none}
body.log-page .log-board>.panel-top{position:relative;z-index:3;padding:8px 124px 12px 36px!important;background:none;border-bottom:1px solid #d4bd97}
body.log-page .log-board .panel-top h2{font:600 24px/1 'Cormorant Garamond',Georgia,serif;color:#384c37}
body.log-page .log-board .panel-top>span{color:#4e3f2c;font:600 16px/1 'Cormorant Garamond',Georgia,serif}
body.log-page .log-board .event,body.log-page .log-day,body.log-page .log-board .empty{position:relative;z-index:3;padding-left:36px;padding-right:36px}
body.log-page .log-more{position:relative;z-index:3}
@media(max-width:740px){
 body.log-page .log-wrap{padding:18px 16px 40px}
 body.log-page .floral-left,body.log-page .floral-right{width:25px;background-size:25px 95px;left:-12px}
 body.log-page .floral-right{left:auto;right:-12px}
 body.log-page .ledger-garland{top:-22px;left:-10px;right:0;height:52px}
 body.log-page .log-board:after{width:85px;height:92px;right:-16px;top:-23px}
 body.log-page .log-board>.panel-top{padding:8px 72px 12px 18px!important}
 body.log-page .log-board .event,body.log-page .log-day,body.log-page .log-board .empty{padding-left:18px!important;padding-right:18px!important}
}
