#pa-lobby,#pa-book,#pa-warehouse{--ink:#05040a;--panel:rgba(6,7,14,.93);--panel2:rgba(10,11,20,.96);--gold:#ffd15c;--gold2:#fff2bf;--cyan:#7cffd5;--purple:#b98cff;--orange:#ff9a35;--pink:#ff6f8f;--blue:#6ab7ff;--text:#f8e7c8;--muted:#9aa5b7;--font:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;font-family:var(--font);color:var(--text);-webkit-user-select:none;user-select:none}
#pa-lobby{position:fixed;inset:0;z-index:60;pointer-events:none}
#pa-lobby[hidden],#pa-book[hidden],#pa-warehouse[hidden]{display:none!important}
#pa-lobby>*{pointer-events:auto}
:where(#pa-lobby,#pa-book,#pa-warehouse) button{font-family:inherit;color:inherit;cursor:pointer;border:0;background:none;padding:0;margin:0;text-align:left}
:where(#pa-lobby,#pa-book,#pa-warehouse) button:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
/* text nodes inside a slab button must sit above the ::before ink layer */
.pa240-slab>span,.pa240-slab>b,.pa240-slab>canvas,.pa240-slab>div{position:relative;z-index:1}
#pa-warehouse{position:fixed;inset:0;z-index:70;display:flex;align-items:center;justify-content:center;background:rgba(5,4,10,.82)}
/* chamfered slab: outer layer = accent frame, ::before = ink body */
.pa240-slab{position:relative;--acc:var(--gold);background:var(--acc);clip-path:polygon(6px 0,calc(100% - 6px) 0,100% 6px,100% calc(100% - 6px),calc(100% - 6px) 100%,6px 100%,0 calc(100% - 6px),0 6px);}
.pa240-slab::before{content:"";position:absolute;inset:2px;background:var(--panel);clip-path:polygon(5px 0,calc(100% - 5px) 0,100% 5px,100% calc(100% - 5px),calc(100% - 5px) 100%,5px 100%,0 calc(100% - 5px),0 5px);z-index:0}
.pa240-slab>*{position:relative;z-index:1}
.pa240-slab.is-muted{--acc:rgba(154,165,183,.35)}
.pa240-rail{position:absolute;left:14px;right:14px;height:1px;background:var(--acc);opacity:.22;z-index:1;pointer-events:none}
.pa240-rail.top{top:7px}.pa240-rail.bot{bottom:7px}
.pa240-corner{position:absolute;width:12px;height:12px;z-index:1;pointer-events:none;opacity:.85}
.pa240-corner::before,.pa240-corner::after{content:"";position:absolute;background:var(--acc)}
.pa240-corner::before{width:12px;height:3px}.pa240-corner::after{width:3px;height:12px}
.pa240-corner.tl{left:5px;top:5px}.pa240-corner.tr{right:5px;top:5px;transform:scaleX(-1)}
.pa240-corner.bl{left:5px;bottom:5px;transform:scaleY(-1)}.pa240-corner.br{right:5px;bottom:5px;transform:scale(-1)}
.pa240-gem{display:inline-block;width:10px;height:10px;background:var(--acc);transform:rotate(45deg);box-shadow:inset 0 0 0 2px #05040a}
/* ---- top bar ---- */
#pa-lobby .pa240-top{position:absolute;left:0;right:0;top:0;height:64px;display:flex;align-items:center;gap:14px;padding:8px 18px 0 18px;background:linear-gradient(180deg,rgba(5,4,10,.86),rgba(5,4,10,.42) 70%,rgba(5,4,10,0));}
.pa240-profile{display:flex;align-items:center;gap:10px;height:48px;padding:0 14px 0 6px;--acc:var(--gold)}
.pa240-profile canvas{width:40px;height:40px;image-rendering:pixelated;background:#0b0a12;clip-path:polygon(4px 0,calc(100% - 4px) 0,100% 4px,100% calc(100% - 4px),calc(100% - 4px) 100%,4px 100%,0 calc(100% - 4px),0 4px)}
.pa240-profile .name{font-weight:900;font-size:14px;letter-spacing:.5px;color:var(--gold2);line-height:16px}
.pa240-profile .lv{font-size:10px;color:var(--gold);font-weight:700;letter-spacing:1px;line-height:12px}
.pa240-xp{width:96px;height:5px;background:#16131f;margin-top:4px;position:relative}
.pa240-xp i{position:absolute;left:0;top:0;bottom:0;background:linear-gradient(90deg,var(--gold),var(--gold2));width:0}
.pa240-currency{display:flex;gap:10px;margin-left:auto}
.pa240-chip{display:flex;align-items:center;gap:8px;height:34px;padding:0 10px 0 8px;min-width:118px;font-size:12px;font-weight:700}
.pa240-chip .pa240-gem{width:9px;height:9px}
.pa240-chip b{font-size:14px;color:#fff;font-weight:900;letter-spacing:.4px}
.pa240-chip small{font-size:9px;color:var(--muted);letter-spacing:1px;font-weight:700}
.pa240-chip .plus{margin-left:auto;width:16px;height:16px;line-height:16px;text-align:center;color:#05040a;background:var(--acc);font-weight:900;font-size:13px;clip-path:polygon(3px 0,calc(100% - 3px) 0,100% 3px,100% calc(100% - 3px),calc(100% - 3px) 100%,3px 100%,0 calc(100% - 3px),0 3px)}
.pa240-sys{display:flex;gap:8px}
.pa240-sys button{width:36px;height:36px;display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:900;color:var(--text);--acc:rgba(154,165,183,.42)}
.pa240-sys button:hover{--acc:var(--cyan)}
/* ---- quick column (left) ---- */
.pa240-quick{position:absolute;left:14px;top:82px;display:flex;flex-direction:column;gap:9px}
.pa240-quick button{width:58px;height:58px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;--acc:rgba(185,140,255,.5);transition:transform .12s}
.pa240-quick button:hover{transform:translateX(3px);--acc:var(--gold)}
.pa240-quick .ic{font-size:18px;font-weight:900;color:var(--gold2);line-height:20px}
.pa240-quick .lb{font-size:10px;font-weight:700;color:var(--muted);letter-spacing:1px}
.pa240-dot{position:absolute;right:5px;top:5px;width:8px;height:8px;background:var(--pink);box-shadow:0 0 0 2px #05040a;z-index:2}
/* ---- intel card (right) ---- */
.pa240-intel{position:absolute;right:20px;top:82px;width:292px;padding:16px 16px 14px;--acc:var(--gold)}
.pa240-intel h3{margin:0;font-size:13px;font-weight:900;letter-spacing:1px;color:var(--gold2);display:flex;align-items:center;gap:8px}
.pa240-intel h3 small{margin-left:auto;font-size:9px;color:var(--gold);letter-spacing:2px;font-weight:700}
.pa240-intel .row{display:flex;align-items:center;gap:10px;margin-top:10px;padding:8px 10px;background:rgba(4,6,13,.86);box-shadow:inset 0 0 0 1px rgba(255,209,92,.28)}
.pa240-intel .row .k{font-size:9px;color:var(--muted);letter-spacing:1px;font-weight:700}
.pa240-intel .row .v{font-size:13px;font-weight:900;color:#fff}
.pa240-intel .row .v em{font-style:normal;color:var(--cyan)}
.pa240-intel .row .sub{font-size:10px;color:var(--muted);margin-top:2px}
.pa240-intel .bar{height:5px;background:#16131f;margin-top:6px;position:relative}
.pa240-intel .bar i{position:absolute;left:0;top:0;bottom:0;background:var(--cyan)}
/* ---- bottom nav ---- */
.pa240-nav{position:absolute;left:0;right:0;bottom:0;height:92px;display:flex;align-items:flex-end;justify-content:center;gap:12px;padding:0 18px 12px;background:linear-gradient(0deg,rgba(5,4,10,.94),rgba(5,4,10,.55) 60%,rgba(5,4,10,0))}
.pa240-nav .pa240-tab{width:150px;height:62px;display:flex;align-items:center;gap:10px;padding:0 14px;--acc:rgba(185,140,255,.48);transition:transform .12s,filter .12s}
.pa240-nav .pa240-tab:hover{transform:translateY(-3px);--acc:var(--gold)}
.pa240-nav .pa240-tab .ic{width:30px;height:30px;display:flex;align-items:center;justify-content:center;font-size:17px;font-weight:900;color:var(--gold2);background:#0b0a12;box-shadow:inset 0 0 0 1px var(--acc);clip-path:polygon(4px 0,calc(100% - 4px) 0,100% 4px,100% calc(100% - 4px),calc(100% - 4px) 100%,4px 100%,0 calc(100% - 4px),0 4px)}
.pa240-nav .pa240-tab .t{font-size:15px;font-weight:900;color:var(--text);line-height:16px}
.pa240-nav .pa240-tab .e{font-size:9px;font-weight:700;color:var(--muted);letter-spacing:1.5px;line-height:12px}
.pa240-nav .pa240-tab .key{margin-left:auto;font-size:9px;color:var(--muted);opacity:.7}
.pa240-sortie{width:196px;height:86px;margin:0 6px;display:flex;flex-direction:column;align-items:center;justify-content:center;--acc:var(--gold);transition:transform .12s}
.pa240-sortie::before{background:linear-gradient(180deg,rgba(64,36,8,.96),rgba(22,14,10,.98))}
.pa240-sortie:hover{transform:translateY(-4px)}
.pa240-sortie .t{font-size:24px;font-weight:900;color:var(--gold2);letter-spacing:6px;text-shadow:0 2px 0 #2a1704}
.pa240-sortie .e{font-size:10px;font-weight:700;color:var(--gold);letter-spacing:3px;margin-top:2px}
.pa240-sortie .glow{position:absolute;inset:-14px;background:radial-gradient(closest-side,rgba(255,209,92,.28),rgba(255,209,92,0));z-index:0;animation:pa240pulse 2.2s ease-in-out infinite;pointer-events:none}
@keyframes pa240pulse{0%,100%{opacity:.55;transform:scale(.96)}50%{opacity:1;transform:scale(1.04)}}
.pa240-sparks{position:absolute;left:0;right:0;top:0;height:6px;z-index:2;pointer-events:none;overflow:hidden}
.pa240-sparks i{position:absolute;top:2px;width:2px;height:2px;background:var(--gold2);animation:pa240spark 3.2s linear infinite}
.pa240-sparks i:nth-child(2){background:var(--gold);animation-delay:-1.1s;animation-duration:2.6s}
.pa240-sparks i:nth-child(3){animation-delay:-2s;animation-duration:3.8s}
@keyframes pa240spark{from{left:8%}to{left:92%}}
/* ---- toast ---- */
.pa240-toast{position:absolute;left:50%;bottom:112px;transform:translateX(-50%);padding:8px 16px;font-size:12px;font-weight:700;--acc:var(--cyan);opacity:0;transition:opacity .2s;pointer-events:none!important}
.pa240-toast.show{opacity:1}
/* ---- content book ---- */
#pa-book{position:fixed;inset:0;z-index:70;display:flex;align-items:center;justify-content:center;background:rgba(5,4,10,.82);font-family:var(--font);color:#f8e7c8;--acc:#ffd15c}
#pa-book[hidden]{display:none!important}
#pa-book .pa240-slab{--acc:var(--gold)}
.pa240-book{width:min(1060px,94vw);max-height:88vh;display:flex;flex-direction:column;padding:18px 22px 14px}
.pa240-book .ft{padding:12px 4px 0;font-size:10px;letter-spacing:1px;color:var(--muted);text-align:center}
.pa240-book .hd{display:flex;align-items:center;gap:14px;padding:4px 4px 12px}
.pa240-book .hd h2{margin:0;font-size:22px;font-weight:900;letter-spacing:4px;color:#f8e7c8;text-shadow:0 2px 0 #06030a}
.pa240-book .hd small{font-size:10px;letter-spacing:3px;color:var(--gold);font-weight:700}
.pa240-book .hd .x{margin-left:auto;width:36px;height:36px;display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:900;--acc:rgba(154,165,183,.42)}
.pa240-book .tabs{display:flex;gap:8px;padding:0 4px 12px}
.pa240-book .tabs button{height:34px;padding:0 18px;font-size:13px;font-weight:900;letter-spacing:1px;color:var(--muted);--acc:rgba(154,165,183,.3)}
.pa240-book .tabs button.on{color:var(--gold2);--acc:var(--gold)}
.pa240-book .grid{overflow:auto;max-height:calc(88vh - 170px);display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding:4px;align-content:start;scrollbar-width:thin}
.pa240-card{height:164px;display:flex;flex-direction:column;padding:14px 14px 12px;--acc:rgba(185,140,255,.55);transition:transform .12s}
.pa240-card:hover{transform:translateY(-3px);--acc:var(--gold)}
.pa240-card .top{display:flex;align-items:center;gap:12px}
.pa240-card .icon{width:44px;height:44px;display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:900;color:#fff;background:#0b0a12;box-shadow:inset 0 0 0 2px var(--acc);transform:rotate(45deg)}
.pa240-card .icon span{transform:rotate(-45deg)}
.pa240-card .t{font-size:17px;font-weight:900;color:#fff;line-height:18px}
.pa240-card .e{font-size:9px;font-weight:700;letter-spacing:1.5px;color:var(--acc);margin-top:3px}
.pa240-card .d{font-size:11px;line-height:15px;color:var(--muted);margin-top:10px;flex:1;overflow:hidden}
.pa240-card .chip{position:absolute;right:12px;top:12px;font-size:9px;font-weight:900;letter-spacing:1px;padding:3px 7px;color:#05040a;background:var(--acc);clip-path:polygon(3px 0,calc(100% - 3px) 0,100% 3px,100% calc(100% - 3px),calc(100% - 3px) 100%,3px 100%,0 calc(100% - 3px),0 3px)}
.pa240-card.is-locked{filter:saturate(.4) brightness(.8)}
/* ---- warehouse (P1 stub) ---- */
.pa240-wh{width:min(760px,92vw);padding:18px 22px}
.pa240-wh .grid{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin-top:12px}
.pa240-wh .cell{position:relative;aspect-ratio:1/1;background:#0b0a12;box-shadow:inset 0 0 0 1px rgba(154,165,183,.25);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:6px;text-align:center;font-size:11px;line-height:14px;color:var(--muted)}
.pa240-wh .cell.has{color:var(--text)}
.pa240-wh .cell .ic{font-size:18px;font-weight:900}
.pa240-wh .cell b{position:absolute;right:6px;bottom:4px;font-size:11px;font-weight:900;color:var(--gold2)}
.pa240-wh .cell .bar{position:absolute;left:6px;right:6px;bottom:0;height:2px;background:rgba(154,165,183,.18)}
.pa240-wh .cell .bar i{display:block;height:100%;background:var(--cyan)}
.pa240-wh .note{margin-top:12px;font-size:11px;color:var(--muted);line-height:16px}
/* ---- compact / portrait ---- */
@media (max-width:900px){
  .pa240-intel{display:none}
  .pa240-nav .pa240-tab{width:112px;height:56px;padding:0 10px}
  .pa240-nav .pa240-tab .e,.pa240-nav .pa240-tab .key{display:none}
  .pa240-sortie{width:150px;height:74px}
  .pa240-sortie .t{font-size:20px;letter-spacing:4px}
  .pa240-chip{min-width:0}
  .pa240-chip small{display:none}
  .pa240-book .grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-aspect-ratio:1/1){
  .pa240-quick{flex-direction:row;left:14px;right:14px;top:72px;gap:6px}
  .pa240-quick button{width:auto;flex:1;height:48px}
  .pa240-nav{height:84px;gap:6px;padding:0 8px 10px}
  .pa240-nav .pa240-tab{width:auto;flex:1;height:52px;padding:0 8px}
  .pa240-nav .pa240-tab .ic{display:none}
  .pa240-nav .pa240-tab .t{font-size:12px}
  .pa240-sortie{width:auto;flex:1.6;height:70px;margin:0 2px}
  .pa240-book .grid{grid-template-columns:1fr}
  .pa240-currency{gap:6px}
}