/* mntlst theme: dark ink + deep indigo. Loaded last, overrides base/phone/desktop. */
:root{--sat:env(safe-area-inset-top,0px);--bg:#08080d;--s:#101018;--s2:#191a24;--b:#262735;--m:#9496a8;--acc:#8f82ec;--btn:#4332b1;--btn2:#5342c4;--r:16px;--pad:20px}
html,body,body[data-view]{background:var(--bg)}
html,body{font-family:ui-rounded,"SF Pro Rounded",-apple-system,BlinkMacSystemFont,"SF Pro Display",Inter,system-ui,sans-serif}
#app,.screen{background:transparent}

/* buttons */
.btn,.pill{background:var(--btn);color:#fff!important;border:0;box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 10px 24px -12px rgba(67,50,177,.9)}
.btn:active,.pill:active{background:var(--btn2)}
.btn.g{background:var(--s2);box-shadow:none;border:1px solid var(--b)}
.btn.d{background:var(--s2);color:#ff8a8a!important;box-shadow:none;border:1px solid var(--b)}
.btn:disabled{box-shadow:none}
.lnk{color:var(--acc)}

/* type + spacing (8pt scale: 8 / 12 / 16 / 24 / 32) */
header{padding:12px var(--pad) 8px}
.logo{font-weight:900;letter-spacing:-.8px}.logo em{color:var(--acc)}
.mark{border:1px solid #3a3b52}
.av{border:1px solid #3a3b52;background:var(--s2)}
.ttl{font-size:34px;font-weight:900;letter-spacing:-1.4px;margin:8px 0 4px}.ttl:after{content:".";color:var(--acc)}
.sub{margin-bottom:24px;font-size:16px}
.xh{border-radius:24px;margin-bottom:32px;cursor:pointer}.xh>div{padding:24px}.xh b{font-size:28px}.xh span{margin:4px 0 16px}
.sec{margin:0 0 12px}.sec b{font-size:22px;font-weight:800}.sec+.lrow{margin-bottom:32px}
.rail{gap:12px;margin-bottom:32px}.tile{border-radius:24px;padding:20px;height:200px;flex-basis:170px}
.lrow,.xc,.tile{background:var(--s);border-color:var(--b)}
.lrow{border-radius:20px;padding:16px;min-height:80px;gap:14px}.lgrid,.stack{gap:12px}
.ic2{background:rgba(143,130,236,.12);color:var(--acc);border-radius:16px}.tile svg{color:var(--acc)}.lrow i{color:var(--acc)}
.lrow:hover,.xc:hover,.tile:hover{border-color:#3a3b52}
.xgrid{gap:12px}.xc{padding:16px;border-radius:24px}.cnt{padding:0 2px 4px}
.search{border-radius:16px;height:54px;margin-bottom:12px}.search:focus-within{border-color:var(--acc)}
.xsticky{background:var(--bg);padding-bottom:12px}

.pf{padding:16px 0 24px}
.empty{padding:48px 0}

/* shop */
#sp .body{padding-bottom:32px}
.stats{gap:12px;margin-bottom:24px}

.lbl{color:var(--m);margin:0 2px 8px;font-size:13px}
.cgrid{gap:12px}
.sc-p strong{font-size:21px}.cd{font-size:13px}
.badge{top:10px;left:10px;padding:5px 11px;font-size:12px}
.tg{padding:10px 16px;font-size:15px}.simg{border-radius:20px}
.t-High{color:#b4a9ff}

/* sheets */
.sheet>div{background:var(--s);border-color:var(--b);border-radius:24px 24px 0 0;padding:12px var(--pad) calc(24px + env(safe-area-inset-bottom,0px))}
.grab{background:#3a3b52;margin-bottom:16px;cursor:grab}.dh{font-size:28px;margin:12px 0 4px}.sheet p{margin-bottom:16px}
.fld{margin-bottom:12px}.fld input,.fld select,.fld textarea{border-radius:14px;background:var(--s2)}
.fld input:focus,.fld select:focus,.fld textarea:focus{border-color:var(--acc)}
.more{color:var(--acc)}#shc{overscroll-behavior:contain}

/* nav */
nav button{position:relative}nav button.on{background:none;color:var(--acc)}
@media(max-width:699px){
.body{padding-bottom:104px}
nav{left:0;right:0;bottom:0;border-radius:0;border:0;border-top:1px solid var(--b);background:rgba(12,12,18,.96);padding:8px 12px calc(8px + env(safe-area-inset-bottom,0px))}
nav button{padding:8px 0}
nav button.on:before{content:"";position:absolute;top:-9px;width:28px;height:3px;border-radius:0 0 4px 4px;background:var(--acc)}
}
@media(min-width:700px){
body[data-view=sp] #app{width:min(1180px,100%);height:100%}
body[data-view=ob] #app,body[data-view=au] #app{border-color:var(--b);background:var(--bg)}
#nv{background:none}nav button.on{background:rgba(143,130,236,.14)}
.sheet>div{border-radius:24px}
}

/* sign in */
.auth{justify-content:flex-end;gap:12px;padding:24px var(--pad) calc(24px + env(safe-area-inset-bottom,0px));overflow:hidden}
.auth:before{content:"";position:absolute;left:50%;top:10%;width:480px;height:480px;transform:translateX(-50%);background:radial-gradient(circle,rgba(67,50,177,.5),rgba(67,50,177,0) 62%);pointer-events:none}
.auth>*{position:relative}
.auth .mark.big{width:112px;height:112px;border-radius:32px;margin:auto auto 8px;border:1px solid #4a4b6a;box-shadow:0 24px 50px -16px rgba(67,50,177,.9)}
.auth h1{font-size:36px;font-weight:900;letter-spacing:-1.4px}.auth h1:after{content:".";color:var(--acc)}
.auth>p:not(.tiny){margin-bottom:auto;padding:0 8px;line-height:1.45}
.ts-wrap{min-height:0}.ts-wrap:has(#ts:empty){display:none}
.auth #dc{display:flex;align-items:center;justify-content:center;gap:12px;background:#5865f2;box-shadow:0 10px 24px -12px rgba(88,101,242,.9);margin-top:8px}
.auth #dc:active{background:#4752c4}.auth #dc svg{width:24px;height:24px;flex:none}
.auth #dc:disabled{background:#2a2c52;color:#8a8fb8}
.auth .tiny{max-width:300px;margin:0 auto}

/* onboarding */
#ob{background:radial-gradient(80% 34% at 50% 38%,rgba(67,50,177,.55),rgba(67,50,177,0) 72%)}
.fade{background:linear-gradient(transparent 45%,var(--bg))}
.slide .fl{filter:drop-shadow(0 0 44px rgba(99,80,235,.6)) drop-shadow(0 24px 30px #000)}
.slide.on .ring{border-color:rgba(143,130,236,.55)}
.stage:after{content:"";position:absolute;inset:0;pointer-events:none;animation:twk 4.5s ease-in-out infinite;background-image:radial-gradient(2px 2px at 14% 24%,#fff,transparent),radial-gradient(3px 3px at 84% 18%,#b9b0ff,transparent),radial-gradient(2px 2px at 24% 62%,#b9b0ff,transparent),radial-gradient(2px 2px at 78% 56%,#fff,transparent),radial-gradient(3px 3px at 50% 10%,#fff,transparent),radial-gradient(2px 2px at 90% 78%,#b9b0ff,transparent),radial-gradient(2px 2px at 8% 86%,#fff,transparent)}
@keyframes twk{50%{opacity:.25;transform:translateY(-14px)}}
@keyframes up{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.copy{padding:0 28px 4px}.copy h1{font-size:40px;font-weight:900;letter-spacing:-1.6px;line-height:1.05;animation:up .5s both}.copy h1:after{content:".";color:var(--acc)}
.copy p{color:#b4b6c8;font-size:18px;animation:up .5s .08s both}
.dots{margin:16px 0}.dots i{background:#33344a}.dots i.on{width:26px;background:var(--acc)}
.pad{padding:0 var(--pad) calc(20px + env(safe-area-inset-bottom,0px))}
/* evolve slide: 9 Pokémon, 2.4s each */

@keyframes st9{0%{opacity:0;transform:scale(.7)}1.4%{opacity:1;transform:scale(1.07)}2.8%{transform:scale(1)}10%{opacity:1;transform:scale(1)}11.1%{opacity:0;transform:scale(1.12)}100%{opacity:0}}

/* notch: screens run edge to edge; only their content steps down below the notch */
body{padding-top:0}
header,#sp header,#hm header{padding-top:calc(12px + var(--sat))}
.auth{padding-top:calc(24px + var(--sat))}
.sheet>div{max-height:calc(100% - var(--sat) - 24px)}
@media(min-width:700px){#hm header{padding-top:24px}}

/* sign-in subtitle wraps evenly */
.auth>p:not(.tiny){max-width:320px;margin-left:auto;margin-right:auto;text-wrap:balance}

/* file pickers in the add/edit card form */
.fld input[type=file]{padding:10px 12px;font-size:14px;color:var(--m)}
.fld input[type=file]::file-selector-button{background:var(--bg);color:var(--t);border:1px solid var(--b);border-radius:10px;padding:8px 14px;margin-right:12px;font:inherit;font-weight:600;cursor:pointer}

/* lock the page itself so iOS can't drag it down or leave it shifted after the keyboard closes;
   only the inner lists scroll */
html,body{position:fixed;inset:0;width:100%;height:100%;overflow:hidden;overscroll-behavior:none}
.body,#shc,.rail,.car{overscroll-behavior:contain;-webkit-overflow-scrolling:touch}