main{max-width:1400px;padding:0 4%}.mode-strip{font-size:10px;padding:15px 0;color:#5d808a}.mode-strip a{color:#39778a;text-decoration-color:#88b4bb}
.hero{position:relative;isolation:isolate;min-height:490px;grid-template-columns:1.05fr 1fr;gap:0;padding:34px 42px;margin-bottom:0;overflow:hidden;border:1px solid #9dbfc8;border-top:3px solid #c9ae70;border-radius:5px 5px 0 0;background:#d6ebee}
.hero::before{content:'';position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,#f6fbf0f5 3%,#e3f4efc9 46%,#cae9f23b),url('https://pub-455b942732344b108b7f822583865d5e.r2.dev/season3-media/576f9513cfdb790f5be47b06.png') center 40%/cover;filter:saturate(.85) brightness(1.08)}
.hero::after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(0deg,#d7eae9b3,transparent 55%,#fffdec26);box-shadow:inset 0 0 75px #eaf7ee66}
.hero-copy{position:relative;z-index:2}.hero .eyebrow{font-size:10px;letter-spacing:.14em;color:#7d783d;margin-bottom:24px}.hero h1{font-size:clamp(38px,4.1vw,59px);font-weight:800;line-height:1.2;letter-spacing:-2.8px;color:#22576b;text-shadow:0 2px #fafff1aa;margin-bottom:22px}
.hero-description{font-size:15px;color:#426f7b;line-height:1.9;margin-bottom:28px}.hero-actions{gap:26px}.hero-actions .primary{min-width:216px;min-height:58px;background:linear-gradient(105deg,#3d9390,#327b8d);color:#fffbea;border:1px solid #31798a;border-top-color:#88b9ae;border-radius:4px;box-shadow:0 5px 15px #4f8a9122,inset 0 1px #c2dbbc66;font-size:17px}
.hero-actions .primary:hover{background:#2e808b;transform:translateY(-2px)}.hero-actions .text-link{font-size:13px;color:#497680;text-decoration-color:#83aaa5}.hero-foot{font-size:11px;letter-spacing:.05em;color:#668342;line-height:1.9;margin-top:25px}.hero-foot span{font-size:10px;letter-spacing:0;color:#597f86}
.card-stage{min-height:410px;border:0;border-radius:0;background:none;overflow:visible;perspective:1000px;isolation:isolate}.card-stage::before{inset:25px 0;background:radial-gradient(ellipse at 50% 48%,#fff4bc99,transparent 64%);border:0;box-shadow:none}.season-number{right:0;bottom:15px;color:#356e7c16;font:180px/1 Georgia,serif;letter-spacing:-15px}
.card-echo{width:214px;height:315px;transform:translate(32px,-8px) rotate(8deg);background:linear-gradient(140deg,#92bdc9,#527f96);border:2px solid #d7bd7b;border-radius:5px;box-shadow:0 15px 30px #3d68752b}
.featured-card{width:224px;margin:0 0 12px;border:2px solid #c2a46b;border-radius:5px;padding:5px;background:linear-gradient(160deg,#fff9df,#edf5e9 70%);box-shadow:0 16px 30px #3e687344,0 0 0 4px #fffbe64d;transform:rotate(-3deg)}.featured-photo{height:267px;background:#d8e7de;border-radius:1px}.featured-photo>img{object-position:50% 22%}.grade{top:7px;left:7px;border:1px solid #bc9e60;background:#fffae6ed;color:#7e632e;border-radius:2px;font:700 18px/1.1 Georgia,serif}
#featured-empty{font-size:16px;color:#577878;padding:76px 16px;line-height:1.9;text-align:center}.featured-card figcaption{padding:13px 6px 8px}.featured-card small{font-size:9px;color:#7c8b78;letter-spacing:.04em}.featured-card strong{font-size:21px;color:#285c68}.featured-card figcaption>b{font-size:11px;color:#9b7d3d}.stage-note{bottom:-9px;color:#476f7d;font-size:9px;margin-bottom:0;letter-spacing:.04em;text-shadow:0 1px #f1fbf1}
.account-state{padding:14px 18px;border:1px solid #abc8cc;border-top:0;background:#f8fcf2e8;margin-bottom:24px;font-size:12px;color:#4d7880}.account-state[data-error=true]{color:#a5573e;background:#f9e9db}.account-state button,.account-state>a{background:#e9f4ec;border:1px solid #9fbdba;color:#3d746f;font-size:11px;border-radius:3px}.account-state button:hover{background:#d9eee2}
.overview{background:transparent;border-block:1px solid #acc7c7;border-radius:0;padding:23px 4px;margin-bottom:34px;gap:36px}.overview>div+div{border-color:#bfd5ce}.overview strong{color:#36757a;font-size:25px;font-weight:600;margin:8px 0}.overview span{font-size:11px}.overview small{font-size:10px;color:#6b8b89}progress,progress::-webkit-progress-bar{background:#d8e7de;border-radius:2px}progress::-webkit-progress-value{background:#6aa68e;border-radius:2px}
.section-heading{margin-bottom:18px}.section-heading .eyebrow{font-size:9px;color:#899253;letter-spacing:.1em}.section-heading h2{font-size:24px;letter-spacing:-.8px;color:#2e6171}.section-heading h2 span{font-size:12px;color:#7b9475}.section-heading>.text-link{font-size:12px;color:#3b7b8a}.empty-note{padding:25px 20px;background:#e5f1e9;border:1px dashed #a8c8b4;border-radius:3px;color:#5d807c;font-size:13px}
.lineup-list{grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}.lineup-list li{padding:10px 6px;border-bottom:1px solid #bbd2cd;gap:10px}.lineup-list img{border:1px solid #baa573;border-radius:3px}.lineup-list strong{font-size:13px;color:#305e6c}.lineup-list small{font-size:10px;color:#6a8a8d}.lineup-note{font-size:10px;color:#658991}
.how-to{padding:28px 0;gap:35px;grid-template-columns:.65fr 2fr;border-top-color:#b2ccce}.how-to .eyebrow{font-size:9px;letter-spacing:.1em;color:#8c8a51}.how-to h2{font-size:24px;color:#356772}.how-to ol{gap:28px}.how-to li>b{font-size:26px;color:#a58946}.how-to h3{font-size:15px;color:#456d73;margin-top:10px}.how-to p{font-size:12px;color:#62838a}.development-note{font-size:10px;color:#739097;max-width:950px}body>footer{border-color:#b7cfd0;color:#6a8990;font-size:10px}
@media(max-width:1050px){.hero{padding:30px 27px;min-height:450px}.hero h1{font-size:44px}.hero-description{font-size:14px}.hero-actions{gap:20px}.hero-actions .primary{min-width:185px}.card-stage{min-height:385px}.featured-card{width:205px}.featured-photo{height:240px}.card-echo{width:196px;height:291px}.lineup-list{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:700px){
main{padding:0 4%}.mode-strip{font-size:9px;padding:12px 0;gap:10px}.mode-strip a{font-size:9px}.hero{grid-template-columns:minmax(0,1fr);padding:24px 21px 18px;gap:8px;min-height:0}.hero::before{background-position:62% 0}.hero h1{font-size:38px;letter-spacing:-2px;line-height:1.2;margin-bottom:17px}.hero .eyebrow{font-size:8px;letter-spacing:.08em;margin-bottom:16px}.hero-description{font-size:13px;margin-bottom:22px}.hero-actions{gap:22px}.hero-actions .primary{min-width:180px;min-height:54px;padding:13px 17px;font-size:16px;gap:28px}.hero-actions .text-link{font-size:12px}.hero-foot{font-size:10px;margin-top:18px}.hero-foot span{font-size:9px;letter-spacing:0}
.card-stage{min-height:305px;margin-top:8px;overflow:hidden}.featured-card{width:176px;transform:rotate(-2deg);margin-bottom:15px}.featured-photo{height:198px}.featured-card strong{font-size:18px}.featured-card figcaption{padding:10px 5px 5px}.card-echo{width:173px;height:263px;transform:translate(27px,-8px) rotate(7deg)}.season-number{font-size:150px;right:8px;bottom:40px}.stage-note{bottom:0;font-size:8px}.grade{font-size:15px}.featured-card figcaption>b{font-size:10px}
.account-state{padding:12px;gap:8px;margin-bottom:20px;font-size:11px}.account-state p{flex-basis:100%;line-height:1.7}.account-state button,.account-state>a{font-size:11px;min-height:44px;padding:9px 12px}.overview{grid-template-columns:1fr 1fr;padding:20px 4px;gap:20px 12px}.overview strong{font-size:21px}.overview>div+div{padding-left:12px}.overview>div:last-child{border-top-color:#bfd5ce;padding:16px 0 0}.overview>div:last-child strong{font-size:21px}.overview span{font-size:10px}.overview small{font-size:10px}
.section-heading{gap:10px}.section-heading h2{font-size:20px}.section-heading h2 span{display:block;padding:3px 0 0;font-size:11px}.section-heading>.text-link{font-size:11px}.lineup-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:2px 12px}.lineup-list li{padding-inline:0}.empty-note{padding:20px 15px;font-size:12px}.lineup-note{font-size:10px}
.how-to{grid-template-columns:1fr;gap:20px;padding:25px 0}.how-to h2{font-size:23px;margin-bottom:13px}.how-to ol{grid-template-columns:1fr;gap:20px}.how-to li{grid-template-columns:32px minmax(0,1fr)}.how-to h3{margin:0;font-size:15px}.how-to p{font-size:12px}.how-to>div>a{font-size:11px}.development-note{font-size:9px}body>footer{padding:20px 5%;gap:15px}
}
@media(max-width:350px){.hero{padding-inline:16px}.hero h1{font-size:34px}.hero-actions{gap:17px}.hero-actions .primary{min-width:160px;font-size:15px;padding-inline:14px}.hero-actions .text-link{font-size:11px}}
@media(prefers-reduced-motion:reduce){.hero-actions .primary:hover{transform:none}}

/* D1 expedition strip: next stage, cleared count and today's caps. */
.expedition-panel{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(0,1.6fr) auto;align-items:center;gap:22px;margin:-10px 0 34px;padding:18px 22px;border:2px solid #cfe2d8;border-radius:16px;background:linear-gradient(180deg,#fbfff6,#eef6f1);box-shadow:0 4px 0 #bcd3c3}
.expedition-panel[hidden]{display:none}
.expedition-flag{position:relative;width:54px;height:54px;border-radius:14px;background:radial-gradient(circle at 35% 30%,#4fc3a8,#1f7a6c 72%);box-shadow:0 4px 0 #145247}
.expedition-flag i{position:absolute;left:16px;top:11px;width:4px;height:32px;border-radius:2px;background:#fff7e0}
.expedition-flag i::after{content:"";position:absolute;left:4px;top:1px;width:21px;height:15px;background:linear-gradient(135deg,#ffd166,#f2a33a);clip-path:polygon(0 0,100% 30%,0 100%)}
.expedition-next .eyebrow{margin:0 0 4px;font-size:10px;letter-spacing:.16em;color:#1f7a6c}
.expedition-next h2{margin:0;font-size:28px;color:#1d4a4a}
.expedition-next p:last-child{margin:4px 0 0;font-size:12px;color:#5d7473}
.expedition-day{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:10px;margin:0}
.expedition-day>div{padding:9px 12px;border-radius:12px;background:#fffef8;border:2px solid #dfe8df}
.expedition-day dt{font-size:11px;font-weight:700;color:#6b8790}
.expedition-day dd{margin:2px 0 0;font-size:16px;font-weight:800;color:#1d4a4a;white-space:nowrap}
.expedition-day meter{width:100%;height:8px;margin-top:4px}
.expedition-panel .button{min-height:52px;white-space:nowrap}
@media(max-width:1050px){.expedition-panel{grid-template-columns:auto minmax(0,1fr) auto}.expedition-day{grid-column:1/-1;grid-row:2}}
@media(max-width:700px){.expedition-panel{grid-template-columns:auto minmax(0,1fr);padding:16px 14px;gap:14px}.expedition-day{grid-template-columns:1fr 1fr}.expedition-day>div:first-child{grid-column:1/-1}.expedition-day dd{white-space:normal;font-size:15px}.expedition-panel .button{grid-column:1/-1;width:100%;justify-content:center}}
/* Representative card picker */
.card-stage .featured-change{position:absolute;right:14px;bottom:14px;z-index:2;min-height:44px;padding:0 16px;border:1px solid #c2a46b;border-radius:22px;background:#fffbe9ee;color:#315c68;font:700 13px/1 "Malgun Gothic",sans-serif;cursor:pointer;box-shadow:0 3px 0 #9d8452}
.card-stage .featured-change:hover{background:#fff4cf}.card-stage .featured-change:focus-visible{outline:3px solid #e3aa42;outline-offset:2px}
.featured-picker{box-sizing:border-box;width:min(760px,calc(100vw - 24px));max-height:calc(100dvh - 24px);padding:0;border:2px solid #c2a46b;border-radius:12px;background:#fffdf2;color:#245568;box-shadow:0 24px 80px #183f4b66;overflow:hidden;display:none;flex-direction:column}
.featured-picker[open]{display:flex}.featured-picker::backdrop{background:#21444dcc;backdrop-filter:blur(4px)}
.featured-picker .picker-head{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px 18px 8px}
.featured-picker .picker-head small{font:9px/1.2 Georgia,serif;letter-spacing:.14em;color:#9b783e}.featured-picker h2{margin:4px 0 0;font-size:22px}
.featured-picker #picker-close{width:44px;height:44px;border:1px solid #c9c6a5;border-radius:50%;background:#eff4e9;color:#416d70;font-size:16px;cursor:pointer}
.featured-picker .picker-note{margin:0 18px 10px;font-size:11px;color:#6d8583}
.featured-picker .picker-auto{margin:0 18px 12px;min-height:44px;border:1px solid #bacdb8;border-radius:6px;background:#eff4e9;color:#416d70;font:700 13px/1.3 "Malgun Gothic",sans-serif;cursor:pointer}
.featured-picker .picker-auto[aria-pressed=true]{border:2px solid #aa873b;background:#fff4cf;color:#765c25}
.featured-picker .picker-list{list-style:none;margin:0;padding:4px 18px 18px;display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:10px;overflow-y:auto;min-height:0}
.featured-picker .picker-list button{display:grid;grid-template-rows:auto auto auto;gap:3px;width:100%;padding:5px 5px 8px;border:2px solid #d6c9a0;border-radius:7px;background:#fff;color:#245568;cursor:pointer;text-align:center;font-family:"Malgun Gothic",sans-serif}
.featured-picker .picker-list img{display:block;width:100%;aspect-ratio:3/4;object-fit:cover;object-position:50% 18%;border-radius:4px;background:#dfe9e2}
.featured-picker .picker-list strong{font-size:12px;line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.featured-picker .picker-list small{font-size:10px;color:#6d8583}
.featured-picker .picker-list button[data-rarity=S]{border-color:#d29b3a}.featured-picker .picker-list button[data-rarity=SS]{border-color:#b44f6b}.featured-picker .picker-list button[data-rarity=SSS]{border-color:#8b5bd0}
.featured-picker .picker-list button[data-current=true]{box-shadow:0 0 0 3px #2b7d79}.featured-picker .picker-list button[aria-pressed=true]::after{content:"선택됨";font-size:10px;font-weight:700;color:#2b7d79}
.featured-picker .picker-list button:focus-visible,.featured-picker button:focus-visible{outline:3px solid #e3aa42;outline-offset:2px}
@media(max-width:520px){.featured-picker .picker-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;padding:4px 12px 14px}.featured-picker .picker-head{padding:12px 12px 6px}.featured-picker .picker-note,.featured-picker .picker-auto{margin-inline:12px}}
.role-badge{flex:none;font-size:11px;font-weight:700;letter-spacing:.02em;color:#7a4a12;background:linear-gradient(180deg,#fff4d6,#f3dca6);border:1px solid #d9b56a;border-radius:999px;padding:5px 11px;white-space:nowrap}
.bridge-link{flex:none;font-size:11px;font-weight:700;color:#fff!important;background:#216d69!important;border-color:#216d69!important;border-radius:999px!important;padding:6px 12px!important;min-height:0!important;text-decoration:none}
/* Player buffs (2026-10-30): one small portrait per buffed player; details on hover (src/ui/buff-tip.js). */
.buff-board{display:flex;align-items:center;gap:14px 24px;flex-wrap:wrap;margin:-10px 0 34px;padding:14px 22px;border:2px solid #e7cf8f;border-radius:16px;background:linear-gradient(180deg,#fffaf0,#fbefd2);box-shadow:0 4px 0 #dcc17c}
.buff-board[hidden]{display:none}
.buff-head h2{margin:2px 0 3px;font-size:20px;color:#6b4310}.buff-head .eyebrow{margin:0;color:#a0702a}.buff-note{margin:0;font-size:11px;color:#8b6a3a}
.buff-list{display:flex;flex-wrap:wrap;gap:10px;margin:0;padding:0;list-style:none;flex:1}
.buff-list li{display:grid;justify-items:center;gap:3px;width:66px;padding:6px 2px 7px;border:1px solid transparent;border-radius:12px;cursor:help;outline-offset:2px}
.buff-list li:hover,.buff-list li:focus-visible{border-color:#e3c88a;background:#fffdf7}
.buff-list img{width:48px;height:48px;object-fit:cover;object-position:50% 20%;border:2px solid #e0b552;border-radius:50%;background:#f3e6c6}
.buff-list strong{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;color:#4d3210}
@media(max-width:700px){.buff-board{padding:12px 14px}.buff-list{gap:6px}}