/* Desktop presentation only. Rules, progression and save ownership stay in the engine. */
.shell-name,.shell-stats,.shell-badge,.shell-mana,.shell-profile-name,.shell-reserve,.shell-subtitle{display:none}
body.pc{--ivory:#edeaf0;--ash:#b9bdce;--faint:#8893a8;--line:#41485c;--panel:#171e2d;--teal:#79c6ca;--teal-dim:#365a66;padding:0;background:#142235 url('shell-city.webp') center/cover no-repeat fixed}
body.pc::before{content:'';position:fixed;inset:0;pointer-events:none;background:linear-gradient(180deg,#0d16231a,#09132140)}
body.pc .phone{width:100%;max-width:1920px;height:100vh;height:100dvh;max-height:none;border:0;border-radius:0;background:none;box-shadow:none;padding:0 20px 20px;gap:0 16px;grid-template-columns:108px minmax(0,1fr);grid-template-rows:108px minmax(0,1fr);overflow:visible}
body.pc .top{position:relative;gap:10px;padding:12px 0;border:0;background:none;justify-content:flex-end}
body.pc .top .center{position:static;order:0;margin:0 auto 0 0;flex:0 0 284px;height:76px;box-sizing:border-box;padding:12px 14px 12px 78px;border:1px solid #8b93a0;border-radius:5px;background:linear-gradient(140deg,#35404f,#161d2deF 65%);box-shadow:inset 0 1px #dee3e544,0 5px 10px #07101888;justify-content:center;animation:none}
body.pc .top .center::before{content:'';position:absolute;top:17px;left:5px;width:64px;height:72px;background:#242c37 url('../cards/lion_01.webp') 50% 9%/145% auto no-repeat;border:2px solid #b49d73;border-radius:4px;box-shadow:inset 0 0 0 2px #35343e,0 4px 8px #0008}
body.pc .shell-profile-name{display:block;max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:20px;font-weight:650;line-height:1.1}
body.pc .top .lvl{gap:6px;font-size:17px;color:#d9e1f6}
body.pc .top .lvl .star{font-size:19px;color:#aebdec}
body.pc .top .xp{height:7px;margin-left:5px;background:#111827;border-color:#61718b}
body.pc .top .xp i{background:linear-gradient(90deg,#607cae,#9eb6d6)}
body.pc .top .xp i::after{animation:none}
body.pc .top .cons{position:absolute;right:94px;top:50%;transform:translateY(-50%);display:flex;gap:14px;margin:0}
body.pc .top .cons .c,body.pc .wallet .w{height:42px;box-sizing:border-box;padding:5px 14px 5px 9px;border:1px solid #737f9c;border-radius:24px;background:linear-gradient(180deg,#283047,#111a29);box-shadow:inset 0 1px #adb7d129,0 4px 7px #0005;font-size:19px;gap:4px;color:#e9edf8}
body.pc .top .cons .c{min-width:145px}
body.pc .top .cons .vialn{font-size:10px;position:absolute;top:-6px;margin-left:23px;background:#202b3e;border:1px solid #66728c;border-radius:8px;min-width:17px;text-align:center}
body.pc .top .res-ic{width:31px;height:31px;margin-right:5px}
body.pc .top .wallet{order:1;margin:0 338px 0 0;min-width:128px}
body.pc .wallet .w{justify-content:center;min-width:128px}
body.pc .top .ico-btn{order:2;width:36px;height:40px;border-radius:5px;background:linear-gradient(140deg,#394254,#172131);border-color:#788299;box-shadow:inset 0 1px #b8c0cf3b,0 3px 5px #0005;font-size:22px}
body.pc .nav{width:108px;box-sizing:border-box;align-self:start;gap:0;padding:5px;background:linear-gradient(120deg,#293446ed,#141d2ef5);border:1px solid #798391;border-radius:8px;box-shadow:inset 0 0 0 3px #29303e,0 8px 18px #0005}
body.pc .nav button{height:clamp(102px,15vh,142px);width:96px;flex:none;border:1px solid transparent;border-radius:5px;background:none;box-shadow:none;gap:5px;color:#d5dbe8}
body.pc .nav button+button{border-top-color:#545c712f}
body.pc .nav button::after{font-family:inherit;font-size:15px;font-weight:600;letter-spacing:0;text-transform:none}
body.pc .nav button img.ng{width:61px;height:61px;filter:drop-shadow(0 4px 3px #0009);opacity:.9}
body.pc .nav button.active{background:linear-gradient(145deg,#334854,#192737);border:1px solid #8bd4d6;box-shadow:inset 0 0 0 2px #567a8c44,0 2px 7px #071119}
body.pc .nav button:hover{background-color:#6f91ae20}
body.pc .screen{border:1px solid #818895;border-radius:9px;background:linear-gradient(145deg,#263044f0,#141c2bef 65%);box-shadow:inset 0 0 0 3px #8d849515,0 8px 28px #0006;overflow:hidden;isolation:isolate}
body.pc .screen .shead{padding:13px 0 10px}
body.pc .shead h1{font-family:inherit;font-size:clamp(24px,2.1vw,34px);font-weight:650;line-height:1.1;letter-spacing:0;text-transform:none;margin:0;color:#f1eff5;text-shadow:0 2px 3px #0007}
body.pc .shell-subtitle{display:inline;margin-left:12px;color:#9caad0;font-size:.7em;font-weight:500}
body.pc .dscroll{width:100%;max-width:none;margin:0;padding:0 16px 16px;box-sizing:border-box;scrollbar-color:#626f87 #141c2b;scrollbar-width:thin}
body.pc .deckrow{max-width:none;gap:clamp(10px,1.35vw,24px);padding:5px 2px 9px;align-items:stretch}
body.pc .ucard{border-radius:5px;padding:7px;border:1px solid color-mix(in srgb,var(--r) 75%,#dee1ed);background:linear-gradient(133deg,#e5e1e880 0%,var(--r) 8%,#222f3e 12%,color-mix(in srgb,var(--r) 45%,#192432) 48%,var(--r) 85%,#161f2c 88%,#dbdce78a 100%);box-shadow:inset 0 0 0 2px #19202d7a,inset 0 0 0 3px color-mix(in srgb,var(--r) 65%,#f4eae650),0 6px 8px #040a12a6;overflow:visible;container-type:inline-size}
body.pc .ucard::after{content:'';position:absolute;inset:3px;border:1px solid #f4ede328;border-radius:3px;pointer-events:none}
body.pc .ucard .art{aspect-ratio:auto;height:clamp(188px,calc(100dvh - 540px),330px);border-radius:3px;border:1px solid #101823;box-shadow:inset 0 2px 8px #000;overflow:visible}
body.pc .ucard .art::before{border-color:#d6dfeb38;border-radius:2px;inset:0;box-shadow:inset 0 -24px 25px -26px #000;z-index:4}
body.pc .ucard .artclip{border-radius:2px;inset:0}
body.pc .ucard .artimg{object-position:50% 24%;filter:saturate(.79) brightness(.91)}
body.pc .ucard .st2{display:none}
body.pc .shell-badge,body.pc .shell-mana{display:grid;place-items:center;position:absolute;z-index:6;top:-5px;width:39px;height:44px;filter:drop-shadow(0 3px 2px #000a)}
body.pc .shell-badge{left:-6px}
body.pc .shell-badge img{width:100%;height:100%}
body.pc .shell-mana{right:-6px;background:linear-gradient(135deg,#d5e4f4 1%,#95a9d1 10%,#5577a0 15%,#294870 46%,#497297 70%,#d7e6ee);clip-path:polygon(50% 0,96% 24%,96% 75%,50% 100%,4% 75%,4% 24%);color:#eef7ff;font-size:25px;font-weight:600;text-shadow:0 2px 3px #000}
body.pc .shell-name{display:block;position:relative;z-index:5;background:linear-gradient(#2c3848,#192333);border-top:1px solid color-mix(in srgb,var(--r) 65%,#d8dce7);border-bottom:1px solid #56617966;text-align:center;font-family:var(--font-display);font-weight:600;font-size:clamp(14px,8.6cqw,23px);line-height:1.2;padding:7px 2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#eae9e8}
body.pc .shell-stats{display:flex;align-items:center;justify-content:space-around;gap:3px;background:linear-gradient(#111b2a,#202c3f);padding:5px 3px;color:#e6e9ef;font-size:clamp(13px,8.6cqw,24px);border:1px solid #62708744;border-radius:0 0 3px 3px;font-variant-numeric:tabular-nums}
body.pc .shell-stats>span{display:inline-flex;align-items:center;gap:3px}
body.pc .shell-stats .a{order:0}.pc .shell-stats .h{order:1}.pc .shell-stats .m{order:2}
body.pc .shell-stats .mini-ic{width:1.05em;height:1.05em}
body.pc .shell-stats b{font-weight:500}
body.pc .shell-stats .ab{display:none}
body.pc .shell-ability{position:absolute;right:4px;bottom:5px;z-index:6;display:flex;align-items:center;gap:3px;padding:3px 5px;border:1px solid #b7c1d562;border-radius:5px;background:#152132dc;color:#e6dfcf;font-size:14px;font-weight:650;box-shadow:0 2px 4px #0007}
.shell-ability{display:none}
body.pc .shell-ability:empty{display:none}
body.pc .shell-ability .mini-ic{height:20px;width:20px}.pc .shell-ability .abg{display:none}
body.pc .ucard .lvbar{font-size:clamp(12px,8cqw,21px);padding:3px 8px;margin-top:1px;background:#182334;border:0;border-radius:0;line-height:1.2}
body.pc .ucard .lvbar .lvfill{opacity:.36}
body.pc .ucard .lvbar .card-levels{flex-basis:auto;width:auto}
body.pc .ucard .lvbar .card-level-cap{display:inline;color:#bbc4d7}
body.pc .ucard .lvbar .potential-stars{flex-basis:53%;width:53%;max-width:110px;gap:2px;color:#6f7e97}
body.pc .ucard.empty{min-height:270px;background:#18233680;box-shadow:inset 0 0 16px #0003;border-color:#58667b}
body.pc .manabar{max-width:none;margin:0 0 9px;height:34px;padding:4px 13px;box-sizing:border-box;border:1px solid #747992;border-radius:6px;background:linear-gradient(#121c2c,#232b3d);gap:15px}
body.pc .manabar .ml{font-size:16px;font-weight:500;letter-spacing:0}.pc .manabar .cdot{display:none}
body.pc .manabar .mv{font-size:17px;min-width:58px;color:#d8e1f0}
body.pc .manabar .mtrack{height:15px;border-color:#526781;background:#131d2c;border-radius:4px}
body.pc .manabar .mtrack i{background:linear-gradient(#76b4c3,#4594a6);box-shadow:inset 0 1px #b2dce466}
body.pc .modes{max-width:790px;width:min(86%,790px);gap:14px;margin:0 auto 13px;justify-content:center}
body.pc .mode{flex:1;height:46px;display:flex;flex-direction:row;gap:9px;justify-content:center;align-items:center;background:linear-gradient(#303449,#192232);border:1px solid #6d7190;border-radius:6px;box-shadow:inset 0 1px #c5c2d024;color:#e4e4ed}
body.pc .mode::after{content:attr(title);font-size:17px;font-family:inherit;font-weight:500}
body.pc .mode .mimg{height:36px;width:36px;filter:drop-shadow(0 3px 2px #0008)}
body.pc .mode.on{background:linear-gradient(#334650,#1c2e3c);border-color:#7dbdc4;box-shadow:inset 0 0 0 1px #6896a147,0 2px 6px #0005}
body.pc .work{border-top:1px solid #81849677;margin:0 -4px;padding:0 6px 8px;background:linear-gradient(130deg,#35405244,#131d2c33);border-radius:4px}
body.pc .shell-reserve{display:flex;align-items:center;justify-content:space-between;margin:8px 0 3px;font-size:21px;font-weight:600;color:#dedfed}
body.pc .shell-reserve small{font-size:15px;font-weight:400;letter-spacing:.02em;color:#9daabe}
body.pc .strip{padding:5px 2px 14px;overflow:visible;touch-action:pan-y}
body.pc .striptrack{justify-content:flex-start;gap:13px;row-gap:17px;flex-wrap:wrap;transform:none!important}
body.pc #deck .strip .ucard{flex:0 0 calc((100% - 104px)/9);width:calc((100% - 104px)/9);box-sizing:border-box;padding:5px}
body.pc #deck .strip .ucard .art{height:auto;aspect-ratio:1/1;min-height:0}
body.pc .strip .shell-name{font-size:clamp(10px,8cqw,14px);padding:4px 0}
body.pc .strip .shell-badge,body.pc .strip .shell-mana{width:25px;height:29px;top:-4px;font-size:16px}
body.pc .strip .shell-badge{left:-4px}.pc .strip .shell-mana{right:-4px}
body.pc .strip .shell-ability{font-size:10px;padding:1px 3px;bottom:2px;right:1px}.pc .strip .shell-ability .mini-ic{width:13px;height:13px}
body.pc .strip .shell-stats{padding:3px 1px;font-size:clamp(10px,9.5cqw,15px);gap:2px}
body.pc .strip .shell-stats>span{gap:1px}
body.pc .strip .ucard .lvbar{font-size:clamp(10px,9cqw,14px);padding:3px 2px}
body.pc .strip .ucard .artimg{object-position:50% 20%}
body.pc #top-burn,body.pc #top-fuse{min-height:345px;padding:18px 0 12px;box-sizing:border-box}
body.pc #top-burn .burnwrap{width:80%;max-width:720px;grid-template-columns:minmax(0,1fr) 120px minmax(0,1fr);gap:24px}
body.pc #top-fuse .fuserow{width:90%;max-width:980px;grid-template-columns:minmax(0,1fr) 30px minmax(0,1fr) 30px minmax(0,1fr);gap:15px}
body.pc #top-burn .bslot,body.pc #top-fuse .bslot{width:100%;flex:unset}
body.pc #top-burn .bslot .ucard,body.pc #top-fuse .bslot .ucard{width:100%;box-sizing:border-box}
body.pc #top-fuse .ucard .art,body.pc #top-burn .ucard .art{height:clamp(180px,calc(100dvh - 570px),280px)}
body.pc #top-fuse .ritual-cap,body.pc #top-burn .ritual-cap{font-size:15px}
body.pc .hscroll,body.pc .pscroll,body.pc .tscroll{padding:0 22px 20px}
body.pc .pcard,body.pc .card{background:linear-gradient(135deg,#283448,#182233);border-color:#566176}
body.pc .cv-card{background:linear-gradient(130deg,#2b3548,#161f2e);border-color:#718094}
body.pc .ucard:hover{filter:brightness(1.07)}
body.pc .ucard:focus-visible,body.pc button:focus-visible{outline:2px solid #d4e6ec;outline-offset:4px}
@media(min-width:1000px) and (max-height:800px){body.pc .phone{grid-template-rows:92px minmax(0,1fr);padding-bottom:12px}body.pc .top .center{height:65px}body.pc .top .center::before{top:13px;height:62px;width:58px}body.pc .screen .shead{padding:10px 0 7px}body.pc .ucard .art{height:clamp(164px,calc(100dvh - 545px),250px)}body.pc .deckrow{padding-bottom:7px}body.pc .nav button{height:118px}body.pc .shell-name{padding:5px 1px}body.pc .shell-stats{padding:4px 2px}body.pc .modes{margin-bottom:8px}body.pc .strip .ucard .art{aspect-ratio:1.15/1}}
@media(min-width:1000px) and (max-width:1199px){body.pc .phone{grid-template-columns:90px minmax(0,1fr);padding-left:12px;padding-right:12px;gap:0 12px}body.pc .nav{width:90px}body.pc .nav button{width:78px}body.pc .nav button::after{font-size:15px}body.pc .top .center{flex-basis:235px}body.pc .top .wallet{margin-right:292px}body.pc .top .cons{gap:8px}body.pc .top .cons .c{min-width:133px}body.pc #deck .strip .ucard{flex-basis:calc((100% - 78px)/7);width:calc((100% - 78px)/7)}body.pc .shell-badge,body.pc .shell-mana{width:30px;height:36px;font-size:21px}}
@media(prefers-reduced-motion:reduce){body.pc .ucard,body.pc .mode,body.pc .nav button{transition:none}}
/* Final material and compact-height pass against real Chromium captures. */
body.pc,body.pc button{font-family:var(--font-ui)}
body.pc .top .center{overflow:visible}
body.pc .top .shell-profile-name{line-height:25px;height:25px;flex:none}
body.pc .screen{background:linear-gradient(140deg,#293346fa,#172133fc)}
body.pc .shead{text-align:left;justify-content:flex-start}
body.pc .ucard{padding:8px;box-shadow:inset 0 0 0 2px #c5c2cc44,inset 0 0 0 4px #0d172a88,0 5px 0 #08121e,0 8px 10px #050a1288}
body.pc .ucard .art{height:clamp(168px,calc(100dvh - 650px),330px)}
body.pc .modes{padding:0}
body.pc .strip .shell-name{display:none}
body.pc .strip .ucard .artimg{filter:saturate(.79) brightness(.96)}
@media(min-width:1000px) and (max-height:800px){body.pc .ucard .art{height:clamp(150px,calc(100dvh - 600px),200px)}body.pc .nav button{height:118px}}

body.pc .ucard::after{inset:0;border-width:3px;border-style:solid;border-color:color-mix(in srgb,var(--r) 65%,#e9e5de) color-mix(in srgb,var(--r) 70%,#253247) color-mix(in srgb,var(--r) 45%,#0b1423) color-mix(in srgb,var(--r) 75%,#bec8d1);background:linear-gradient(135deg,#ddddeacc 0 5px,transparent 6px) top left/14px 14px no-repeat,linear-gradient(225deg,#ccd5db99 0 5px,transparent 6px) top right/14px 14px no-repeat;z-index:7}