.footbrawl-page,.footbrawl-poster{font-family:Georgia,'Times New Roman',serif;color:#4a2d1b;background:#fff4d6}
.wrap .footbrawl-poster{background:linear-gradient(110deg,#216e42 0%,#216e42 43%,#4a2d1b 43%,#4a2d1b 100%);color:#fffaf0;border:3px solid #4a2d1b;border-radius:3px;box-shadow:0 5px 0 #ead8ae}
.wrap .footbrawl-poster-art:before{display:block;inset:28px;border:2px solid #fff4d640;border-radius:0;pointer-events:none}
.wrap .footbrawl-poster-art:after{content:'';position:absolute;width:130px;height:130px;border:2px solid #fff4d640;border-radius:50%;pointer-events:none}
.wrap .footbrawl-poster-art img{z-index:1;max-width:360px;filter:drop-shadow(0 16px 8px #0006)}
.wrap .footbrawl-poster h2{font-weight:900;text-shadow:3px 3px 0 #0005;letter-spacing:-.025em}
.wrap .footbrawl-poster p{color:#fff4d6}
.wrap .footbrawl-poster .footbrawl-status{background:none;border:0;border-left:4px solid #f2a900;border-radius:0;color:#f2a900;padding:4px 0 4px 12px;font-size:11px;letter-spacing:.1em}
.wrap .footbrawl-poster .button{background:#e65328;border:2px solid #ff7440;border-radius:3px;box-shadow:3px 3px 0 #0005;color:#fffaf0}
.wrap .footbrawl-poster .button:hover{background:#a9321d;border-color:#f2a900}
.footbrawl-poster{margin-top:32px;display:grid;grid-template-columns:44% 56%;min-height:430px;position:relative;overflow:hidden;border:2px solid #4a2d1b;border-radius:20px;background:linear-gradient(110deg,#216e42 0%,#174e30 44%,#fff4d6 44%,#fff4d6 100%)}
.footbrawl-poster-art{padding:44px 35px;display:flex;align-items:center;justify-content:center;position:relative}
.footbrawl-poster-art:before{content:'';position:absolute;inset:24px;border:1px solid #fff4d647;border-radius:12px}
.footbrawl-poster-art img{position:relative;width:100%;max-width:330px;filter:drop-shadow(0 16px 13px #0005)}
.footbrawl-poster-copy{position:relative;padding:44px 48px 44px 36px;align-self:center}
.footbrawl-poster h2{font-size:clamp(38px,5vw,66px);letter-spacing:-.045em;margin:20px 0 16px;line-height:1.05}
.footbrawl-poster p{font-size:21px;line-height:1.55;max-width:370px;margin:0 0 28px}
.footbrawl-status{display:inline-block;border:1px solid #4a2d1b44;border-radius:6px;padding:8px 12px;background:#ead8ae;font-size:12px;font-weight:bold;letter-spacing:.06em;text-transform:uppercase}
.footbrawl-poster .button{background:#a9321d;color:#fffaf0;border:1px solid #4a2d1b}
.footbrawl-poster .button:hover{background:#7d2617}
.footbrawl-hero{max-width:1120px;margin:auto;padding:72px 64px;display:grid;grid-template-columns:1.1fr 1fr;align-items:center;gap:32px}
.footbrawl-hero h1{font-size:clamp(48px,7vw,86px);line-height:1;margin:27px 0 24px;letter-spacing:-.055em}
.footbrawl-pitch{font-size:clamp(30px,4vw,46px);font-weight:bold;line-height:1.15;margin:0 0 22px;color:#a9321d}
.footbrawl-summary{font-size:21px;line-height:1.6;max-width:450px;margin:0}
.footbrawl-emblem{position:relative;padding:38px;isolation:isolate}
.footbrawl-emblem{background:none;border:0;box-shadow:none}
.footbrawl-emblem:before{display:none;content:none}
.footbrawl-emblem img{display:block;width:100%;filter:drop-shadow(0 12px 10px #0004)}
.footbrawl-gameplay{max-width:992px;margin:0 auto 56px;padding:0 32px}
.footbrawl-gameplay img{display:block;width:100%;border:2px solid #4a2d1b;border-radius:12px}
.footbrawl-gameplay figcaption{font-size:13px;color:#73583f;margin-top:12px;text-align:right}
.footbrawl-features{background:#4a2d1b;color:#fff4d6;padding:52px max(32px,calc((100vw - 992px)/2)) 60px}
.footbrawl-features>h2{font-size:clamp(28px,4vw,40px);margin:0 0 36px}
.footbrawl-feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
.feature-number{display:block;color:#f2a900;font-size:16px;margin-bottom:16px;font-weight:bold}
.footbrawl-feature-grid h3{font-size:24px;margin:0 0 14px}
.footbrawl-feature-grid p{font-size:18px;line-height:1.65;margin:0;color:#ead8ae}
.footbrawl-development{max-width:1120px;margin:auto;padding:64px}
.footbrawl-development h2{font-size:36px;margin:22px 0 16px;letter-spacing:-.03em}
.footbrawl-development p{font-size:20px;line-height:1.6;margin:0}
@media(max-width:800px){.footbrawl-poster{min-height:350px}.footbrawl-poster-art{padding:30px 22px}.footbrawl-poster-copy{padding:30px 26px}.footbrawl-poster p{font-size:18px}.footbrawl-hero{padding:52px 32px;gap:20px}.footbrawl-emblem{padding:25px}.footbrawl-summary{font-size:18px}.footbrawl-feature-grid{gap:22px}.footbrawl-feature-grid h3{font-size:22px}.footbrawl-feature-grid p{font-size:16px}.footbrawl-development{padding:48px 32px}}
@media(max-width:520px){.footbrawl-poster{grid-template-columns:1fr;background:linear-gradient(#174e30 0 215px,#fff4d6 215px);min-height:0}.footbrawl-poster-art{height:215px;padding:20px}.footbrawl-poster-art:before{inset:14px}.footbrawl-poster-art img{height:185px;width:auto;max-width:100%;object-fit:contain}.footbrawl-poster-copy{padding:28px}.footbrawl-poster h2{font-size:44px;margin:18px 0 14px}.footbrawl-hero{padding:42px 24px;grid-template-columns:1fr;gap:30px}.footbrawl-hero h1{font-size:58px}.footbrawl-emblem{width:230px;justify-self:center}.footbrawl-features{padding:38px 24px 44px}.footbrawl-feature-grid{grid-template-columns:1fr;gap:30px}.footbrawl-feature-grid article{border-top:1px solid #ead8ae33;padding-top:22px}.feature-number{margin-bottom:10px}.footbrawl-development{padding:42px 24px}.footbrawl-development h2{font-size:30px}.footbrawl-development p{font-size:18px}}
@media(max-width:520px){.wrap .footbrawl-poster{background:linear-gradient(#216e42 0 215px,#4a2d1b 215px)}.wrap .footbrawl-poster-art:before{inset:16px}.wrap .footbrawl-poster-art:after{width:100px;height:100px}}

/* FootBrawl reference-ui.jpg: parchment, brown bevels, orange plates, gold rivets. */
.footbrawl-page{background:#f8f2e6;padding:38px 24px 48px}
.wrap .footbrawl-poster,.footbrawl-hero,.footbrawl-feature-grid article,.footbrawl-development{color:#4a2d1b;background-color:#fff0c8;background-image:radial-gradient(ellipse at 20% 15%,#fffaf080,transparent 60%),linear-gradient(135deg,#e7c58d28,transparent 40%,#cb9a5420);border:5px solid #4a2d1b;border-radius:18px;box-shadow:inset 0 0 0 3px #c27a36,inset 0 0 0 6px #f7d59b,0 4px 0 #4a2d1b;position:relative}
.wrap .footbrawl-poster:before,.footbrawl-hero:before,.footbrawl-development:before{content:'';position:absolute;inset:10px;pointer-events:none;background:radial-gradient(circle at 10px 10px,#fff0a1 0 3px,#f2a900 4px 7px,#4a2d1b 8px 10px,transparent 11px),radial-gradient(circle at calc(100% - 10px) 10px,#fff0a1 0 3px,#f2a900 4px 7px,#4a2d1b 8px 10px,transparent 11px),radial-gradient(circle at 10px calc(100% - 10px),#fff0a1 0 3px,#f2a900 4px 7px,#4a2d1b 8px 10px,transparent 11px),radial-gradient(circle at calc(100% - 10px) calc(100% - 10px),#fff0a1 0 3px,#f2a900 4px 7px,#4a2d1b 8px 10px,transparent 11px)}
.wrap .footbrawl-poster-art:before,.wrap .footbrawl-poster-art:after{display:none}
.wrap .footbrawl-poster:before{z-index:3}
.wrap .footbrawl-poster-art{background:linear-gradient(135deg,#216e42,#174e30);align-self:stretch;border-right:4px solid #4a2d1b;box-shadow:inset -3px 0 #f2a900;margin:0;border-radius:0}
.wrap .footbrawl-poster{box-shadow:0 4px 0 #4a2d1b;border:5px solid #4a2d1b}
.wrap .footbrawl-poster h2{color:#fff4d6;text-shadow:2px 3px 0 #85270f;background:linear-gradient(#ff7440,#ef481b 48%,#d93b12);border:3px solid #4a2d1b;border-radius:10px;padding:12px 20px;box-shadow:inset 0 0 0 2px #ffb266,0 3px 0 #a86730;font-size:clamp(32px,4.5vw,56px);margin:18px 0 22px;letter-spacing:-.025em}
.wrap .footbrawl-poster p{color:#4a2d1b}
.wrap .footbrawl-poster .footbrawl-status{color:#73583f;border:0;padding:0;background:none;font-size:11px}
.wrap .footbrawl-poster .button{background:linear-gradient(#ff7440,#e65328 55%,#b93517);border:3px solid #4a2d1b;border-radius:8px;box-shadow:inset 0 0 0 2px #ffb266,0 3px 0 #a86730;padding:13px 26px;color:#fffaf0;text-shadow:1px 2px 0 #85270f}
.wrap .footbrawl-poster .button:hover{background:linear-gradient(#ff9658,#e65328);border-color:#4a2d1b}
.wrap .footbrawl-poster .button{color:#24150b;text-shadow:none}
.footbrawl-hero{padding:54px 48px;margin-bottom:42px}
.footbrawl-hero h1{background:linear-gradient(#ff7440,#ef481b 48%,#d93b12);border:3px solid #4a2d1b;border-radius:10px;box-shadow:inset 0 0 0 2px #ffb266,0 3px 0 #a86730;color:#fff4d6;text-shadow:2px 3px 0 #85270f;padding:16px 20px;font-size:clamp(42px,6vw,72px)}
.footbrawl-emblem:before{display:none}
.footbrawl-pitch{font-size:clamp(28px,3.7vw,42px)}
.footbrawl-page .footbrawl-status{background:radial-gradient(circle at 12px 50%,#fff0a1 0 2px,#f2a900 3px 5px,#4a2d1b 6px 7px,transparent 8px),radial-gradient(circle at calc(100% - 12px) 50%,#fff0a1 0 2px,#f2a900 3px 5px,#4a2d1b 6px 7px,transparent 8px),linear-gradient(#ff7440,#e65328 55%,#a9321d);border:3px solid #4a2d1b;border-radius:7px;color:#24150b;padding:10px 28px;box-shadow:inset 0 0 0 2px #ffb266,0 3px 0 #a86730;font-size:11px;letter-spacing:.04em}
.footbrawl-gameplay{max-width:1120px;padding:0;margin-bottom:42px}
.footbrawl-gameplay img{border:5px solid #4a2d1b;border-radius:14px;box-shadow:0 4px 0 #a86730}
.footbrawl-features{max-width:1120px;margin:auto;background:none;color:#4a2d1b;padding:10px 0 42px}
.footbrawl-features>h2{text-align:center}
.footbrawl-feature-grid{gap:24px}
.footbrawl-feature-grid article{padding:24px 22px 28px}
.footbrawl-feature-grid h3{color:#a9321d}
.footbrawl-feature-grid p{color:#4a2d1b}
.feature-number{color:#1471a3}
.footbrawl-development{padding:40px 48px}
@media(max-width:800px){.footbrawl-page{padding:28px 24px 40px}.footbrawl-hero{padding:40px 28px}.footbrawl-feature-grid{gap:16px}.footbrawl-feature-grid article{padding:24px 18px}.wrap .footbrawl-poster-copy{padding:30px 24px}.wrap .footbrawl-poster h2{padding:12px 14px}}
@media(max-width:520px){.footbrawl-page{padding:24px 18px 36px}.footbrawl-hero{padding:32px 20px}.footbrawl-hero h1{font-size:43px;padding:14px 12px}.footbrawl-emblem{width:210px}.wrap .footbrawl-poster-art{margin:0;border-right:0;border-bottom:4px solid #4a2d1b;box-shadow:inset 0 -3px #f2a900;border-radius:0}.wrap .footbrawl-poster-copy{padding:24px 24px 34px}.wrap .footbrawl-poster h2{font-size:39px}.footbrawl-development{padding:32px 24px}.footbrawl-feature-grid article{border:5px solid #4a2d1b;padding:24px}.footbrawl-features{padding-bottom:32px}}
.footbrawl-inspirations{max-width:1120px;margin:0 auto 40px;text-align:center;padding:8px 16px 18px}.footbrawl-inspirations h2{font-size:22px;margin:0 0 14px;color:#a9321d}.footbrawl-inspirations p{font-size:18px;line-height:1.8;margin:0;color:#4a2d1b}

.footbrawl-concept{max-width:1120px;margin:48px auto 0}.footbrawl-concept h2{font-size:32px;text-align:center;color:#4a2d1b;margin:0 0 24px}.footbrawl-concept-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;align-items:start}.footbrawl-concept-grid a{display:block;border:4px solid #4a2d1b;border-radius:12px;overflow:hidden;box-shadow:0 3px 0 #a86730}.footbrawl-concept-grid img{display:block;width:100%;height:auto}@media(max-width:650px){.footbrawl-concept-grid{grid-template-columns:1fr;gap:22px}}
.footbrawl-concept-grid .gallery-image img{aspect-ratio:auto;object-fit:contain}.footbrawl-viewer{background:#fff4d6;border:3px solid #4a2d1b;border-radius:12px}.footbrawl-viewer .gallery-close{background:#a9321d;color:#fffaf0}