:root{--gold:#eac587;--ice:#a9dfed}button{font:600 14px system-ui;cursor:pointer;color:#eaf6ff;background:#142c35;border:1px solid #49616a;border-radius:8px;padding:12px 18px}button:hover{background:#294653;border-color:var(--gold)}button:focus-visible{outline:3px solid var(--gold);outline-offset:3px}button:disabled{opacity:.4;cursor:wait}#toolbar{position:fixed;right:18px;top:14px;display:flex;gap:7px;z-index:20}#toolbar button{padding:9px 12px;background:#0b1c28dd}#panel{position:fixed;inset:0;z-index:30;display:flex;align-items:center;padding:5vw;background:linear-gradient(90deg,#06131cf5 0%,#081824ed 40%,#07131b20 100%);box-sizing:border-box;overflow:auto}#panel[hidden]{display:none}.menu{max-width:620px;width:100%;animation:reveal .3s ease-out}.eyebrow{font-size:12px;letter-spacing:4px;color:var(--gold);font-weight:700}.menu h1{font:750 clamp(34px,5.6vw,76px)/1.06 system-ui;margin:20px 0;color:#f6f1df;letter-spacing:-2px}.menu h1 span{color:var(--ice)}.menu p{color:#b0c4ce;line-height:1.65;max-width:510px}.actions{display:flex;flex-wrap:wrap;gap:10px;margin:24px 0}.primary{background:#dbba7d;color:#172731;border-color:#dbba7d}.chapters{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.chapter{text-align:left;padding:17px 13px;background:#112633d9;min-height:112px}.chapter small{display:block;color:#9cbbc8;font-size:10px;letter-spacing:2px;margin-bottom:12px}.chapter b{display:block;font-size:16px}.chapter span{display:block;font-size:11px;color:#a9c0ca;margin-top:7px}.controls{font-size:12px;color:#9bb3bf;line-height:2;margin-top:25px}.version{font-size:11px;color:#718b98;margin-top:24px}#notice{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);background:#071923ec;border:1px solid #658087;border-radius:8px;padding:12px 22px;color:#def4ed;z-index:60;opacity:0;pointer-events:none;transition:opacity .2s;text-align:center}#notice.show{opacity:1}@keyframes reveal{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media(max-height:550px){#panel{padding:22px 5vw}.menu{max-width:660px}.menu h1{font-size:34px;margin:10px 0}.menu p{margin:8px 0;font-size:13px}.actions{margin:12px 0}.chapter{min-height:70px;padding:10px}.chapter small{margin-bottom:5px}.controls{margin-top:10px}.version{display:none}#toolbar{top:5px;right:6px}#toolbar button{font-size:11px;padding:7px}}#touch{z-index:10}body.menu-open #touch,body.menu-open #toolbar{display:none}
@media(pointer:coarse) and (max-height:550px){#joyBase{width:112px;height:112px}#joyKnob{width:50px;height:50px}#joy{bottom:18px}#ba{width:78px;height:78px;bottom:14px;right:16px}#bj{width:65px;height:65px;bottom:18px;right:106px}#bd{width:58px;height:58px;bottom:105px;right:24px}#bs{width:58px;height:58px;bottom:100px;right:108px}.tb{font-size:15px}#notice{font-size:12px;bottom:8px;padding:8px 13px;max-width:45%}}
.wide-menu{max-width:820px}.secondary-actions{margin-top:-12px}.secondary-actions button{font-size:12px;padding:9px 13px;color:#b4d1dc;background:#0b202bc9}.relic-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.relic-card{text-align:left;display:flex;flex-direction:column;gap:16px;padding:24px 20px;border-color:#53656e;background:linear-gradient(145deg,#223b48,#0c1d28)}.relic-card:hover{border-color:var(--relic-color);transform:translateY(-3px)}.relic-icon{font-size:42px;color:var(--relic-color)}.relic-card b{font-size:18px;color:var(--relic-color)}.relic-card>span:last-child{font-weight:400;font-size:13px;line-height:1.7;color:#c4d4dd}.result-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:28px 0}.result-grid>div{padding:20px;background:#142936cc;border:1px solid #3c5561;border-radius:8px}.result-grid strong{display:block;color:#eac587;font-size:32px}.result-grid span{display:block;color:#a9c5d1;font-size:12px;margin-top:12px}.guide-list p{max-width:770px;font-size:14px}.guide-list b{color:#eac587}#guardButton{position:absolute;right:240px;bottom:40px;width:76px;height:76px;border-radius:50%;background:#1e4b65a8;border:2px solid #a7dbec;pointer-events:auto;display:none;touch-action:none}body.advanced-chapter #guardButton{display:block}#interactButton{position:fixed;left:50%;bottom:90px;transform:translateX(-50%);z-index:21;color:#162a30;background:#d8e7bb;border-color:#e9f4d4;font-size:16px}body.menu-open #interactButton{display:none}body.menu-open #notice{opacity:0}@media(max-height:550px){.relic-card{padding:13px;gap:8px}.relic-icon{font-size:25px}.relic-card b{font-size:15px}.relic-card>span:last-child{font-size:12px}.result-grid{margin:12px 0}.result-grid>div{padding:12px}.result-grid strong{font-size:24px}.guide-list p{font-size:12px}.wide-menu h1{font-size:30px}.secondary-actions{margin-top:0}#guardButton{right:186px;bottom:30px;width:58px;height:58px;font-size:12px;padding:5px}#interactButton{bottom:24px;font-size:12px;padding:9px 15px}.menu{margin:auto 0}}@media(prefers-reduced-motion:reduce){.menu{animation:none}.relic-card:hover{transform:none}#notice{transition:none}}
.save-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:15px}.save-actions button{padding:6px 10px;font-size:11px;color:#a3c0ca;background:transparent;border-color:#344c58}.save-actions span{font-size:12px;color:#ffc29d}.save-actions button:disabled{cursor:default}.menu>.version{margin-top:12px}@media(max-height:550px){.save-actions{margin-top:8px}.controls{font-size:11px;line-height:1.6}.secondary-actions{margin:8px 0}}
#panel{touch-action:pan-y;scroll-padding:24px;-webkit-overflow-scrolling:touch}.menu{flex-shrink:0}
/* v1.4 forge */
.forge-souls{font-size:15px;color:#e6c8ff;margin:4px 0 16px}.forge-souls strong{font-size:22px}
.forge-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.forge-card{display:flex;flex-direction:column;gap:8px;padding:16px;border:1px solid #3c5561;border-radius:10px;background:linear-gradient(145deg,#1d3542,#0c1d28)}
.forge-head{display:flex;align-items:center;gap:8px}.forge-head b{color:var(--up-color);font-size:16px;flex:1}
.forge-icon{font-size:24px;color:var(--up-color)}.pips{display:flex;gap:3px}.pips i{width:9px;height:9px;border-radius:50%;border:1px solid var(--up-color);opacity:.6}.pips i.on{background:var(--up-color);opacity:1}
.forge-now{font-size:13px;color:#e4eef2}.forge-next{font-size:12px;color:#8fa9b5;min-height:30px}
.forge-card button{margin-top:auto;padding:8px 10px;font-size:13px}.forge-button{color:#e6c8ff!important;border-color:#7a5aa0!important}
@media(max-height:550px){.forge-grid{gap:6px}.forge-card{padding:8px;gap:4px}.forge-next{min-height:0}.forge-icon{font-size:18px}}
@media(max-width:700px){.forge-grid{grid-template-columns:repeat(2,1fr)}}
.forge-menu h1{font-size:clamp(30px,4vw,48px)!important;margin:10px 0!important}.forge-menu p{margin:6px 0}
/* v1.6 story */
.story-layout{display:grid;grid-template-columns:1.2fr .8fr;gap:24px;align-items:center}
.story-line{opacity:0;animation:reveal .6s ease-out forwards;font-size:16px}
.story-art{position:relative;height:420px}.story-art img{position:absolute;right:0;bottom:0;max-height:100%;max-width:100%;filter:drop-shadow(0 0 30px #0008)}
.story-art .story-hero{left:0;right:auto;height:46%;bottom:0}.void-tint{filter:hue-rotate(275deg) saturate(1.15) brightness(.85) contrast(1.1) drop-shadow(0 0 30px #a040ff)!important}
@media(max-height:550px){.story-art{height:250px}.story-line{font-size:13px}}
@media(max-width:700px){.story-layout{grid-template-columns:1fr}.story-art{display:none}}
@media(prefers-reduced-motion:reduce){.story-line{animation:none;opacity:1}}
/* v1.7 achievements */
.achievement-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:10px}
.achievement{padding:10px 12px;border:1px solid #2e434d;border-radius:8px;background:#0f222ccc;opacity:.55}
.achievement.got{opacity:1;border-color:#9a7c45;background:#2a2516cc}.achievement b{display:block;font-size:13px;color:#eac587}.achievement span{font-size:11px;color:#a9c5d1}
@media(max-width:700px){.achievement-grid{grid-template-columns:repeat(2,1fr)}}
/* v1.8 options */
.options-menu h1{font-size:clamp(30px,4vw,48px)!important;margin:10px 0!important}
.options-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px}.options-grid h2{font:700 13px system-ui;letter-spacing:2px;color:var(--gold);text-transform:uppercase;margin:6px 0 10px}
.opt-row{display:flex;align-items:center;gap:10px;justify-content:space-between;padding:5px 0;border-bottom:1px solid #1d323c;font-size:14px;color:#cfe0e7}
.opt-row button{padding:6px 12px;min-width:84px;font-size:13px}.opt-row input[type=range]{flex:1;max-width:170px;accent-color:#dbba7d}.opt-row output{width:40px;text-align:right;color:#eac587}
.opt-row .fixed{color:#7d97a3;font-size:12px}.seg{display:flex;gap:4px}.seg button{min-width:0}.seg button.on,.opt-row button.listening{background:#dbba7d;color:#172731;border-color:#dbba7d}
[data-keys-reset]{margin-top:10px;font-size:12px;padding:7px 12px}
@media(max-width:760px){.options-grid{grid-template-columns:1fr}}
@media(max-height:550px){.opt-row{padding:2px 0;font-size:12px}.opt-row button{padding:4px 8px}}
body.touch-s #touch{zoom:.82}body.touch-l #touch{zoom:1.22}
/* Tall menus scroll from the top instead of being clipped by flex centering */
#panel{align-items:flex-start}#panel>.menu{margin:auto 0}
.options-menu h1{display:none}.options-menu .options-grid{margin-top:14px}
/* v2.0 title */
.logo{display:flex;flex-direction:column;margin:14px 0 18px;line-height:1}
.logo-main{font:900 clamp(60px,9vw,120px)/1.12 system-ui;padding-top:.08em;letter-spacing:-3px;background:linear-gradient(180deg,#fff6dc 0%,#eac587 55%,#a8783a 100%);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 4px 18px #0009)}
.logo-sub{display:flex;align-items:center;gap:12px;font:700 clamp(13px,1.6vw,18px) system-ui;letter-spacing:6px;color:var(--ice);margin-top:8px}
.logo-sub i{display:block;height:2px;width:46px;background:linear-gradient(90deg,transparent,var(--ice))}.logo-sub i:last-child{transform:scaleX(-1)}
.title-hero{position:fixed;right:4vw;bottom:0;height:min(78vh,620px);z-index:31;pointer-events:none;display:none;filter:drop-shadow(0 0 40px #4ab8ff66);animation:heroFloat 4s ease-in-out infinite}
body.title-screen.menu-open .title-hero{display:block}
@keyframes heroFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
.ng-button{background:#4a1630!important;border-color:#ff8ab0!important;color:#ffd0e0!important}
.link-button{background:none;border:none;padding:0;color:#9fc6d6;text-decoration:underline;font-size:11px}
@media(max-width:1100px){.title-hero{opacity:.35;right:-6vw}}
@media(max-height:550px){.logo{margin:4px 0 8px}.logo-main{font-size:52px}.title-hero{height:92vh}}
@media(prefers-reduced-motion:reduce){.title-hero{animation:none}}

/* v2.6: keep toasts clear of the boss bar */
body.boss-fight #notice{bottom:auto;top:128px}
@media(pointer:coarse){body.boss-fight #notice{top:auto;bottom:22px}}
#ultButton{position:absolute;right:52px;bottom:232px;width:76px;height:76px;border-radius:50%;pointer-events:auto;touch-action:none;display:none;padding:0;font:900 13px/1.15 system-ui,sans-serif;color:#3a2200;background:radial-gradient(circle at 50% 35%,#fff6d6,#ffc95a 58%,#b8741a);border:3px solid #fff0c0;box-shadow:0 0 18px #ffcf6a,0 0 40px #ffb43a88;animation:ultPulse .9s ease-in-out infinite alternate}#ultButton.ready{display:block}body.menu-open #ultButton{display:none}@keyframes ultPulse{to{box-shadow:0 0 28px #ffe08a,0 0 64px #ffb43aaa;transform:scale(1.06)}}@media(pointer:coarse) and (max-height:550px){#ultButton{right:28px;bottom:172px;width:58px;height:58px;font-size:11px}}@media(prefers-reduced-motion:reduce){#ultButton{animation:none}}
body.ult-cast #notice{opacity:0}
.menu.bestiary{max-width:1120px}.bestiary h2{font-size:13px;letter-spacing:.14em;color:#eac587;margin:20px 0 10px;text-transform:uppercase}.beast-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:12px}.beast{display:flex;gap:14px;padding:12px;background:linear-gradient(145deg,#132a38e6,#0a1822e6);border:1px solid #3c5561;border-radius:10px;align-items:flex-start}.beast:not(.locked):hover{border-color:#eac58799}.beast-art canvas{display:block;width:120px;height:120px;border-radius:8px;border:1px solid #ffffff22}.beast.boss .beast-art canvas{width:168px;height:140px}.beast-text{min-width:0}.beast-text b{display:block;color:#f4e2b8;font-size:17px}.beast-text em{display:block;font-style:normal;font-size:11px;color:#9fc0cc;letter-spacing:.1em;margin:3px 0 7px;text-transform:uppercase}.beast-text p{margin:0 0 6px;font-size:13px;line-height:1.5;color:#c4d4dd;font-weight:400}.beast-text .tip{color:#bfe8d0}.beast-text .kills{font-size:12px;color:#eac587;font-weight:800}.beast.locked .beast-text b{color:#7d8c96}.beast.locked{background:#0b161ee6}@media(max-height:550px){.beast-grid{grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:8px}.beast{padding:8px;gap:10px}.beast-art canvas{width:80px;height:80px}.beast.boss .beast-art canvas{width:112px;height:94px}.beast-text b{font-size:14px}.beast-text p{font-size:11px;line-height:1.4}}
.menu.whatsnew{max-width:900px}.whatsnew>p{color:#c4d4dd;max-width:640px}.news-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:18px 0 22px}.news{display:grid;grid-template-columns:40px 1fr;column-gap:12px;align-items:start;padding:12px 14px;background:linear-gradient(145deg,#132a38e6,#0a1822e6);border:1px solid #3c5561;border-radius:10px}.news i{grid-row:span 2;font-style:normal;font-size:24px;line-height:40px;text-align:center;background:#eac5871a;border-radius:8px}.news b{color:#f4e2b8;font-size:15px}.news span{color:#b9cbd4;font-size:12.5px;line-height:1.5;font-weight:400}@media(max-height:550px){.news-grid{gap:6px;margin:10px 0 12px}.news{padding:7px 10px;grid-template-columns:30px 1fr}.news i{font-size:18px;line-height:30px}.news b{font-size:13px}.news span{font-size:11px;line-height:1.35}.whatsnew h1{font-size:28px}}
.whatsnew h1{font-size:46px;margin:6px 0 8px}.whatsnew .actions{position:sticky;bottom:-22px;padding:12px 0 16px;margin-top:0;background:linear-gradient(180deg,#06131c00,#06131cf2 35%)}

/* v3.2 Kiếm Vũ touch button */
#bv{right:232px;bottom:150px;width:70px;height:70px;font-size:14px;opacity:.45;border-color:rgba(184,255,240,.55)}
#bv.ready{opacity:1;background:rgba(120,255,220,.22);border-color:#b8fff0;box-shadow:0 0 14px rgba(150,255,230,.55)}
@media(pointer:coarse) and (max-height:550px){#bv{width:54px;height:54px;right:180px;bottom:108px;font-size:12px}}
.chapters{grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}.chapter{padding:14px 10px;min-height:100px}.chapter b{font-size:14px;line-height:1.25}.chapter span{font-size:10px}.chapter.sky-card:not(.locked){border-color:#8fdcff88;background:linear-gradient(160deg,#1a3a5cd9,#112633d9 60%,#3a2c10d9)}.chapter.sky-card:not(.locked) b{color:#fff0c4}.story-art .sky-art{position:absolute;top:10px;right:-40px;width:125%;height:auto;max-width:none;filter:drop-shadow(0 0 30px #0008)}
@media(max-height:550px){.chapter{min-height:64px;padding:8px}.chapter b{font-size:12px}}
.secondary-actions button.daily-new{color:#ffe7b0;border-color:#eac587aa;background:linear-gradient(135deg,#3a2c10cc,#0b202bc9)}.daily-grid .daily-mod{gap:10px;padding:18px 16px}.daily-grid .relic-icon{font-size:34px}
.relic-grid.relic-grid-4{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.relic-grid-4 .relic-card{padding:18px 14px;gap:10px}.relic-grid-4 .relic-icon{font-size:34px}.relic-grid-4 .relic-card b{font-size:16px}.relic-grid-4 .relic-card>span:last-child{font-size:12.5px;line-height:1.6}.relic-new{font-style:normal;font-size:9px;letter-spacing:.08em;padding:2px 5px;border-radius:4px;background:var(--relic-color);color:#10202a;vertical-align:middle;margin-left:4px}.relic-tag{font-style:normal;font-size:11.5px;line-height:1.5;color:#c9d6de;padding:6px 8px;border-radius:6px;background:#ffffff12;border:1px solid #ffffff22}.relic-tag.res{color:var(--res-color);border-color:var(--res-color);background:#ffffff0d}.relic-card.relic-resonant{border-color:var(--res-color);box-shadow:inset 0 0 0 1px var(--res-color),0 0 18px -6px var(--res-color)}.relic-card.relic-echo{opacity:.55;cursor:default}.relic-card.relic-echo:hover{transform:none;border-color:#53656e}.res-word{color:#ffe1a0}
@media(max-width:760px){.relic-grid.relic-grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-height:550px){.relic-grid-4 .relic-card{padding:9px 10px;gap:5px}.relic-grid-4 .relic-icon{font-size:21px}.relic-grid-4 .relic-card b{font-size:13px}.relic-grid-4 .relic-card>span:last-child{font-size:10.5px;line-height:1.4}.relic-tag{font-size:10px;padding:3px 6px;line-height:1.35}}
.memoir-menu{max-width:900px}.memoir-menu h1{font-size:44px}.memoir-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:18px 0 6px}.memoir-page{padding:16px 18px;border:1px solid #6b5a3c;border-radius:10px;background:linear-gradient(160deg,#2f2718e6,#141c22e6);display:flex;flex-direction:column;gap:6px}.memoir-page:last-child:nth-child(odd){grid-column:1/-1}.memoir-page small{font-size:11px;letter-spacing:.12em;color:#c9a46a}.memoir-page b{font-size:17px;color:#ffe7b4}.memoir-page p{margin:0;font-size:13px;line-height:1.65;color:#e4dccb}.memoir-page.locked{border-color:#3a4a52;background:#0f1d26cc}.memoir-page.locked b{color:#7f929c}.memoir-page.locked p{color:#8fa2ab;font-style:italic}.memoir-foot{font-size:13px;color:#d9c49a}.true-ending h1 span{color:#ffd9a0}
body.cine #touch,body.cine #toolbar,body.cine #guardButton,body.cine #interactButton,body.cine #notice{display:none!important}
@media(max-width:760px){.memoir-grid{grid-template-columns:1fr}}
@media(max-height:550px){.memoir-grid{gap:8px;margin:10px 0 4px}.memoir-page{padding:10px 12px;gap:4px}.memoir-page b{font-size:14px}.memoir-page p{font-size:11.5px;line-height:1.5}}
.access-section{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;column-gap:28px}.access-section h2{grid-column:1/-1}.access-section .opt-row small{display:block;font-size:11px;font-weight:400;color:#8fa9b5;margin-top:2px}
@media(max-width:760px){.access-section{grid-template-columns:1fr}}
@media(max-height:550px){.access-section .opt-row small{display:none}}
.logo-main{padding-top:.2em;margin-top:-.1em}@media(max-height:550px){.logo{margin:0 0 6px}.logo-main{padding-top:.24em;margin-top:-.16em}}
.menu.whatsnew .news-grid{margin:14px 0 16px}
.pets-menu{max-width:1160px}.pet-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin:16px 0 8px}.pet-card{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;padding:12px 10px;border-color:#3d525c;background:linear-gradient(160deg,#1d3240,#0c1a24)}.pet-card.on{border-color:var(--pet-color);box-shadow:inset 0 0 0 1px var(--pet-color),0 0 20px -8px var(--pet-color)}.pet-card:disabled{opacity:.6;cursor:default}.pet-card b{color:var(--pet-color);font-size:15px}.pet-card>span:not(.pet-art){font-weight:400;font-size:11.5px;line-height:1.5;color:#c4d4dd}.pet-card em{font-style:normal;font-size:11px;letter-spacing:.06em;color:#eac587}.pet-art canvas{width:96px;height:77px;display:block}
@media(max-width:760px){.pet-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-height:550px){.pet-grid{gap:6px;margin:8px 0 4px}.pet-card{padding:6px;gap:3px}.pet-art canvas{width:64px;height:51px}.pet-card>span:not(.pet-art){font-size:10px;line-height:1.35}.pets-menu>p{display:none}}
/* 4.3: six chapters on one row, Long Cung card */
.chapters{grid-template-columns:repeat(6,minmax(0,1fr));gap:7px}.chapter{padding:12px 8px;min-height:96px}.chapter b{font-size:13px}.chapter span{font-size:9.5px}
.chapter.sea-card:not(.locked){border-color:#8ff0e088;background:linear-gradient(160deg,#0f4a58d9,#112633d9 60%,#3a1a4ad9)}.chapter.sea-card:not(.locked) b{color:#d8fff6}
@media(max-height:550px){.chapter{min-height:62px;padding:7px}.chapter b{font-size:11.5px}.chapter span{font-size:9px}}
.story-art .sea-art{position:absolute;top:0;right:-30px;width:118%;height:auto;max-width:none}

/* v4.5 Thử thách Huyền thoại */
.legend-menu{max-width:1160px}.legend-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin:16px 0 8px}.legend-card{display:flex;flex-direction:column;align-items:center;text-align:center;gap:5px;padding:10px 8px;border-color:#5a3a3a;background:linear-gradient(160deg,#2a1a20,#120c14)}.legend-card:not(:disabled):hover,.legend-card:not(:disabled):focus-visible{border-color:var(--legend-color);box-shadow:0 0 22px -8px #ff6a4a}.legend-card:disabled{opacity:.55;cursor:default}.legend-card small{font-size:10px;letter-spacing:.08em;color:var(--legend-color)}.legend-card b{font-size:14px;color:#ffe6d0}.legend-art{display:block;width:100%}.legend-art canvas{width:100%;max-width:170px;height:auto;display:block;margin:0 auto;border-radius:8px}.legend-medal{display:flex;align-items:center;justify-content:center;gap:6px;font-size:11.5px}.legend-medal em{font-style:normal;color:#e8d0c0}.legend-meta{font-size:10.5px;color:#b8a4a0;min-height:1.2em}.medal{font-size:20px;line-height:1}.medal-0{color:var(--medal);font-size:16px}.legend-big{margin:2px 0 -4px}.legend-big .medal{font-size:64px}.legend-next{color:#eac587;font-size:13px;margin:10px 0 0}
@media(max-width:760px){.legend-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-height:550px){.legend-grid{gap:6px;margin:8px 0 4px}.legend-card{padding:6px;gap:2px}.legend-art canvas{max-width:110px}.legend-menu>p{display:none}.legend-big .medal{font-size:40px}}

/* v4.6 Hành trình */
.journey-menu{max-width:1160px;padding-top:22px;padding-bottom:22px}.journey-menu h1{font-size:clamp(26px,3.4vw,40px);line-height:1.1;margin:4px 0 6px}.journey-menu>p{margin:0;font-size:14px;max-width:none}@media(min-width:1000px){.journey-grid{grid-template-columns:repeat(8,1fr)}.journey-grid strong{font-size:19px}.journey-grid span{font-size:11.5px}}.journey-map{display:block;width:100%;height:auto;aspect-ratio:1100/260;margin:10px 0 8px;border-radius:14px;cursor:pointer}.journey-tabs{display:flex;flex-wrap:wrap;gap:6px}.journey-tabs button{font-size:12px;padding:7px 11px;color:#cfe3ec;background:#0b202bc9;border-color:#3d525c}.journey-tabs button[aria-pressed="true"]{color:#14100a;background:var(--j-color);border-color:var(--j-color)}.journey-tabs button:disabled{opacity:.45;cursor:default}.journey-grid{margin:10px 0 2px;gap:8px}.journey-grid>div{padding:9px 12px}.journey-grid strong{font-size:20px}.journey-grid span{margin-top:5px}.journey-empty{color:#b9ccd6;margin:14px 0 6px}
@media(max-width:760px){.journey-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-height:550px){.journey-menu>p{display:none}.journey-map{margin:6px 0}.journey-grid{gap:6px;margin:6px 0 2px}.journey-grid>div{padding:6px 10px}.journey-grid strong{font-size:16px}.journey-tabs button{padding:5px 9px;font-size:11px}}@media(max-height:550px) and (min-width:700px){.journey-grid{grid-template-columns:repeat(8,1fr)}.journey-grid span{font-size:10px;margin-top:2px;line-height:1.25}}
.blades-menu{max-width:1160px;padding-top:22px;padding-bottom:22px}.blades-menu h1{font-size:clamp(26px,3.4vw,40px);line-height:1.1;margin:4px 0 14px}.blades-layout{display:grid;grid-template-columns:minmax(240px,400px) 1fr;gap:20px;align-items:start}.blades-preview{display:block;width:100%;height:auto;aspect-ratio:420/300;border-radius:14px}.blades-menu h2{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:#eac587;margin:0 0 8px}.blade-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:14px}.blade-card{display:flex;align-items:center;gap:10px;text-align:left;padding:7px 10px;color:#cfe3ec;background:#0b202bc9;border-color:#3d525c;font-weight:400}.blade-card canvas{width:44px;height:44px;flex:none}.blade-card b{display:block;font-size:13.5px;color:#fff3dc}.blade-card b i{font-style:normal;font-size:10px;font-weight:800;padding:1px 6px;margin-left:5px;border-radius:9px;background:#eac587;color:#14100a;vertical-align:2px}.blade-card small{display:block;font-size:11px;line-height:1.35;color:#a9c5d1;margin-top:2px}.blade-card.on{border-color:#eac587;background:linear-gradient(145deg,#33402c,#10222b);box-shadow:inset 0 0 0 1px #eac587}.blade-card:disabled{opacity:.55;cursor:default}.blade-card:disabled small{color:#8fa4ae}.blades-note{font-size:12.5px;color:#a9c5d1;margin:0}
@media(max-width:900px){.blades-layout{grid-template-columns:1fr}.blades-preview{max-width:420px}}
@media(max-width:600px){.blade-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-height:550px){.blades-menu h1{margin-bottom:8px}.blades-layout{grid-template-columns:200px 1fr;gap:12px}.blade-grid{gap:5px;margin-bottom:8px}.blade-card{padding:4px 8px;gap:7px}.blade-card canvas{width:30px;height:30px}.blade-card b{font-size:12px}.blade-card small{display:none}.blades-note{display:none}.blades-menu h2{margin-bottom:5px}}
.actions.menu-groups{display:grid;gap:7px;justify-content:start}.menu-group{display:flex;align-items:flex-start;gap:10px}.menu-group-label{flex:none;width:58px;padding-top:9px;font-size:10px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:#eac587}.menu-group-row{display:flex;flex-wrap:wrap;gap:6px}.menu-groups button{font-size:12px;padding:7px 11px}
@media(max-height:550px){.actions.menu-groups{gap:5px}.menu-group-label{width:48px;padding-top:7px;font-size:9px}.menu-groups button{padding:5px 9px;font-size:11px}}

/* v5.1 Võ đường */
.dojo-menu{max-width:1100px;padding-top:22px;padding-bottom:22px}.dojo-menu h1{font-size:clamp(26px,3.4vw,40px);line-height:1.1;margin:4px 0 8px}.dojo-menu>p{margin:0 0 14px;font-size:14px;max-width:860px}.dojo-layout{display:grid;grid-template-columns:minmax(240px,320px) 1fr;gap:18px;align-items:start;text-align:left}.dojo-menu h2{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:#eac587;margin:0 0 8px}.dojo-modes{display:grid;gap:6px;margin-bottom:14px}.dojo-modes button{text-align:left;padding:8px 12px;background:#0b202bc9;font-weight:400}.dojo-modes b{display:block;font-size:13.5px;color:#fff3dc}.dojo-modes small{display:block;font-size:11.5px;color:#a9c5d1;margin-top:2px;line-height:1.35}.dojo-modes [aria-pressed=true],.dojo-realms [aria-pressed=true]{border-color:#eac587;background:linear-gradient(145deg,#3a3424,#10222b);box-shadow:inset 0 0 0 1px #eac587}.dojo-realms{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}.dojo-realms button{font-size:12px;padding:7px 10px;background:#0b202bc9}.dojo-realms button:disabled{opacity:.45;cursor:default}.dojo-best{font-size:13px;color:#a9c5d1}.dojo-best b{color:#ffe2a8}.dojo-trials{display:grid;grid-template-columns:1fr 1fr;gap:8px}.dojo-trial{padding:8px 12px;border:1px solid #3d525c;border-radius:10px;background:#0b202bc9}.dojo-trial b{display:block;font-size:13.5px;color:#cfe3ec}.dojo-trial span{display:block;font-size:11.5px;line-height:1.35;color:#9fb6c0;margin-top:2px}.dojo-trial.done{border-color:#6c8a52;background:linear-gradient(145deg,#1f3322,#0c1f24)}.dojo-trial.done b{color:#c8f0a8}
@media(max-width:900px){.dojo-layout{grid-template-columns:1fr}}
@media(max-width:600px){.dojo-trials{grid-template-columns:1fr}}
@media(max-height:550px){.dojo-menu>p{display:none}.dojo-trial span{display:none}.dojo-modes small{display:none}}

/* v5.3 Bảng truy nã */
.bounty-menu{max-width:1000px;padding-top:22px;padding-bottom:22px}.bounty-menu h1{font-size:clamp(26px,3.4vw,40px);line-height:1.1;margin:4px 0 8px}.bounty-menu>p{margin:0;font-size:14px;max-width:820px}.poster-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:16px 0 12px;text-align:left}.poster{position:relative;padding:14px 16px 12px;border-radius:6px;background:linear-gradient(170deg,#efe2bd,#d6bf8d);color:#3a2614;box-shadow:0 6px 18px #0008,inset 0 0 0 1px #b89a62,inset 0 0 28px #a07c4a40}.poster-head{font:800 13px/1 system-ui;letter-spacing:.32em;color:#9b2a1e;border-bottom:1px solid #a88a5a88;padding-bottom:7px;margin-bottom:9px}.poster b{display:block;font-size:16.5px;line-height:1.3;color:#2c1a0c;min-height:43px}.poster-bar{height:7px;border-radius:4px;background:#3a261426;margin:10px 0 6px;overflow:hidden}.poster-bar i{display:block;height:100%;background:linear-gradient(90deg,#b8322a,#e0603a)}.poster-meta{display:flex;justify-content:space-between;gap:8px;font-size:12.5px;color:#5a3e22;font-weight:700}.poster.done .poster-bar i{background:linear-gradient(90deg,#4f8a3a,#7cbf5a)}.poster.done b{color:#5a4a36}.poster-seal{position:absolute;right:12px;top:8px;transform:rotate(-10deg);border:2.5px solid #b8322a;color:#b8322a;font:900 13px system-ui;letter-spacing:.2em;padding:3px 8px;border-radius:4px;opacity:.85}.poster-swap{margin-top:10px;font-size:12px;padding:6px 11px;background:#3a2614;color:#f3e6c4;border-color:#6b4a26}.poster-swap:hover{background:#5a3a1c}.poster.weekly{grid-column:1/-1;background:linear-gradient(170deg,#f1e4c0,#d2b47a);box-shadow:0 6px 18px #0008,inset 0 0 0 2px #b8862e,inset 0 0 36px #a07c4a50}.poster.weekly .poster-head{color:#8a4a12}.poster.weekly b{min-height:0}.bounty-foot{font-size:13px;color:#a9c5d1}.bounty-foot b{color:#ffe2a8}
@media(max-width:760px){.poster-grid{grid-template-columns:1fr}}
@media(max-height:550px){.bounty-menu>p{display:none}.poster-grid{gap:8px;margin:8px 0}.poster{padding:8px 12px}.poster b{min-height:0;font-size:14px}}

/* v5.4 Tháp Vạn Kiếm */
.tower-menu{max-width:1060px;padding-top:22px;padding-bottom:22px}.tower-menu h1{font-size:clamp(26px,3.4vw,40px);line-height:1.1;margin:4px 0 8px}.tower-menu>p{margin:0 0 12px;font-size:14px;max-width:880px}.tower-menu h2{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:#eac587;margin:0 0 8px}.boon-grid{display:grid;gap:8px;text-align:left}.boon-grid.codex{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));margin-bottom:6px}.boon-grid.pick{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:16px 0 14px}.boon-card{position:relative;display:flex;flex-direction:column;gap:3px;padding:8px 11px 8px 46px;border:1px solid #3d525c;border-radius:10px;background:#0b202bc9;color:#cfe3ec;font-weight:400;text-align:left;min-height:52px}.boon-card .boon-icon{position:absolute;left:9px;top:9px;width:28px;height:28px;display:grid;place-items:center;border-radius:8px;background:#2a2418;border:1px solid #eac58788;color:#ffe2a8;font-size:16px;line-height:1}.boon-card b{display:block;font-size:13px;color:#fff3dc}.boon-card b i{font-style:normal;font-size:10px;font-weight:800;padding:1px 6px;margin-left:5px;border-radius:9px;background:#eac587;color:#14100a;vertical-align:2px}.boon-card small{display:block;font-size:11px;line-height:1.35;color:#a9c5d1}.boon-grid.pick .boon-card{padding:20px 18px 18px;align-items:center;text-align:center;gap:8px;min-height:190px;border-color:#6b5a3a;background:linear-gradient(165deg,#2c2618e6,#0d1d26e6);cursor:pointer;transition:transform .15s,border-color .15s,box-shadow .15s}.boon-grid.pick .boon-card .boon-icon{position:static;width:64px;height:64px;font-size:34px;border-radius:16px;border-width:2px;background:radial-gradient(circle at 50% 40%,#4a3c20,#1c160c)}.boon-grid.pick .boon-card b{font-size:17px}.boon-grid.pick .boon-card small{font-size:13px;color:#c9d9e0}.boon-grid.pick .boon-card:hover,.boon-grid.pick .boon-card:focus-visible{transform:translateY(-4px);border-color:#eac587;box-shadow:0 10px 28px -10px #eac587aa}.boon-have{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;font-size:12.5px;color:#a9c5d1;margin:4px 0 8px;align-items:center}.boon-have span{padding:3px 9px;border-radius:12px;background:#2a2418;border:1px solid #eac58766;color:#ffe2a8}.tower-menu .result-grid{margin:12px 0 10px}
@media(max-width:760px){.boon-grid.pick{grid-template-columns:1fr}.boon-grid.pick .boon-card{min-height:0;flex-direction:row;text-align:left;padding:10px 12px}.boon-grid.pick .boon-card .boon-icon{width:44px;height:44px;font-size:24px;flex:none}}
@media(max-height:550px){.tower-menu>p{display:none}.boon-grid.codex{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:5px}.boon-grid.codex small{display:none}.boon-card{min-height:0;padding:6px 9px 6px 42px}.boon-grid.pick{margin:8px 0}.boon-grid.pick .boon-card{min-height:0;padding:10px}.boon-grid.pick .boon-card .boon-icon{width:44px;height:44px;font-size:24px}}

/* v5.5 Chế độ chụp ảnh */
body.photo-mode #touch,body.photo-mode #toolbar,body.photo-mode #notice{display:none!important}body.photo-mode #c{cursor:grab}body.photo-mode #c:active{cursor:grabbing}
#photoBar{position:fixed;left:50%;top:12px;transform:translateX(-50%);z-index:40;width:min(1180px,calc(100vw - 24px));box-sizing:border-box;display:flex;flex-direction:column;gap:6px;padding:10px 12px;border-radius:14px;background:rgba(6,14,20,.82);border:1px solid #eac58755;box-shadow:0 10px 30px #000a;font:500 12px system-ui;color:#cfe3ec}#photoBar[hidden]{display:none}
.photo-row{display:flex;flex-wrap:wrap;align-items:center;gap:5px}.photo-row button{font-size:12px;padding:6px 10px;background:#0b202bc9;border-color:#3d525c}.photo-row button[aria-pressed=true]{border-color:#eac587;color:#14100a;background:#eac587}.photo-row button.primary{margin-left:auto;background:linear-gradient(145deg,#f3d79e,#c9974e);color:#14100a;border-color:#eac587;font-weight:800}.photo-label{font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#eac587;margin:0 4px 0 8px}.photo-label:first-child{margin-left:0}
#photoBar kbd{font:700 10px system-ui;padding:1px 5px;margin-left:4px;border-radius:4px;background:#ffffff1f;border:1px solid #ffffff33;color:inherit}.photo-row button[aria-pressed=true] kbd{background:#14100a22;border-color:#14100a44}
.photo-zoom{display:flex;align-items:center;gap:6px;margin-left:8px;font-size:12px;color:#cfe3ec}.photo-zoom input{width:120px;accent-color:#eac587}.photo-zoom b{min-width:34px;color:#ffe2a8}
.photo-hint{font-size:11px;color:#8fa4ae}.photo-msg{font-size:12.5px;color:#ffe2a8;line-height:1.4}
.photo-shutter{position:fixed;inset:0;z-index:60;background:#fff;pointer-events:none;animation:photoShutter .45s ease-out forwards}@keyframes photoShutter{from{opacity:.85}to{opacity:0}}
@media(max-height:550px){#photoBar{padding:6px 8px;gap:4px;top:6px}.photo-row button{padding:4px 8px;font-size:11px}.photo-hint{display:none}}
