/* Selection / command panels: generated by client/themes/selbg/gen.mjs (P5 · Full plan + readable text). Edit the generator, not this file. */
:root { --portrait-bg:#e3d2aa; }
#sel { background:repeating-linear-gradient(0deg, rgba(40,80,160,.26) 0 1px, transparent 1px 55px), repeating-linear-gradient(90deg, rgba(40,80,160,.26) 0 1px, transparent 1px 55px), repeating-linear-gradient(0deg, rgba(40,80,160,.15) 0 1px, transparent 1px 11px), repeating-linear-gradient(90deg, rgba(40,80,160,.15) 0 1px, transparent 1px 11px), radial-gradient(ellipse at 50% 40%, rgba(255,250,235,.35), transparent 70%), linear-gradient(#efe2c2, #dcc8a0) padding-box, linear-gradient(180deg, rgba(255,255,255,0.2), rgba(0,0,0,0.3)) border-box, url(/client/assets/tex/slate-dark.png) 0 0/140px border-box; box-shadow:0 0 0 1px rgba(0,0,0,.7), 0 10px 22px rgba(0,0,0,.45), inset 0 0 0 1px rgba(60,40,20,.55), inset 0 0 16px rgba(80,55,25,.35); }
#actions { background:repeating-linear-gradient(0deg, rgba(40,80,160,.26) 0 1px, transparent 1px 55px), repeating-linear-gradient(90deg, rgba(40,80,160,.26) 0 1px, transparent 1px 55px), repeating-linear-gradient(0deg, rgba(40,80,160,.15) 0 1px, transparent 1px 11px), repeating-linear-gradient(90deg, rgba(40,80,160,.15) 0 1px, transparent 1px 11px), radial-gradient(ellipse at 50% 40%, rgba(255,250,235,.35), transparent 70%), linear-gradient(#efe2c2, #dcc8a0) padding-box, linear-gradient(180deg, rgba(255,255,255,0.2), rgba(0,0,0,0.3)) border-box, url(/client/assets/tex/slate-dark.png) 0 0/140px border-box; box-shadow:0 0 0 1px rgba(0,0,0,.7), 0 10px 22px rgba(0,0,0,.45), inset 0 0 0 1px rgba(60,40,20,.55), inset 0 0 16px rgba(80,55,25,.35); }
#selinfo { color:#3a2a18; } #selinfo h2 { color:#2e2012; text-shadow:0 1px 0 rgba(255,255,255,.55); } #selinfo .sub, #selinfo .stats, #selinfo .desc { color:#6a5338; } #selinfo .hp { color:#3a2a18; }
#sel .bar { background:rgba(70,45,20,.22); border-color:#8a6a44; box-shadow:inset 0 1px 2px rgba(60,40,20,.35); } #multisel { background:rgba(70,45,20,.08); border-right-color:rgba(90,60,30,.35); } #multisel .mini b { color:#fff; }
#portrait { border-color:#5a4028; box-shadow:inset 0 0 0 1px rgba(60,40,20,.5), inset 0 0 14px rgba(90,60,30,.35); }

/* readable plan text: a light wash behind the words, darker ink, bigger type (the whole HUD is scaled to 78%), no clamping —
   hud.js fitSelInfo() steps the size down (fit1..fit3) only when a long text would not fit */
#sel { width:540px; }
#selinfo { margin:6px 6px 6px 0; padding:6px 12px 6px 12px; border-radius:3px; background:linear-gradient(rgba(248,240,218,.4), rgba(240,229,200,.32)); box-shadow:inset 0 0 0 1px rgba(120,90,50,.22); gap:2px; justify-content:flex-start; }
#selinfo h2 { font-size:26px; color:#1f140a; text-shadow:0 1px 0 rgba(255,255,255,.7), 0 0 4px rgba(246,237,214,.95), 0 0 8px rgba(246,237,214,.8); }
#selinfo .sub, #selinfo .hp, #selinfo .stats, #selinfo .desc { text-shadow:0 0 3px rgba(246,237,214,1), 0 0 6px rgba(246,237,214,.9), 0 0 1px rgba(246,237,214,1); }
#selinfo .sub { font-size:14px; font-weight:700; color:#4a3420; white-space:normal; overflow:visible; }
#selinfo .hp { font-size:14px; font-weight:800; color:#2a1c0e; flex-wrap:wrap; }
#selinfo .stats { font-size:13.5px; color:#3e2c1a; font-weight:700; }
#selinfo .desc { font-size:14px; line-height:1.28; color:#33240f; font-weight:600; display:block; -webkit-line-clamp:unset; overflow:visible; margin-top:2px; }
#sel .bar { height:12px; flex:none; }
#selinfo .queue { margin-top:3px; }
#selinfo.fit1 h2 { font-size:23px; } #selinfo.fit1 .sub, #selinfo.fit1 .hp, #selinfo.fit1 .stats { font-size:13px; } #selinfo.fit1 .desc { font-size:13px; line-height:1.22; }
#selinfo.fit2 h2 { font-size:21px; } #selinfo.fit2 .sub, #selinfo.fit2 .hp, #selinfo.fit2 .stats { font-size:12px; } #selinfo.fit2 .desc { font-size:12px; line-height:1.18; }
#selinfo.fit3 .desc { font-size:11px; line-height:1.15; } #selinfo.fit3 .sub { font-size:11px; }