/* pbPT buff row (buff-hud.js): the game's own buff icons with the time left, the classic skin
   of the world map for the hint and the panel (system-assets/native: frame, title, plate). */
#pbb { --s:30px; --gold:#ffd623; --text:#e9e4d2; --line:#a88a52;
  position:fixed; z-index:58; display:flex; align-items:flex-start; gap:4px; pointer-events:auto; user-select:none; -webkit-user-select:none;
  font:bold 9px/1 Tahoma,Verdana,sans-serif; }
#pbb[hidden], #pbb [hidden], .pbb-tip[hidden] { display:none!important; }
#pbb.pbb-touch { --s:calc(26px * var(--k,1)); }
#pbb.pbb-touch.pbb-tablet { --s:calc(30px * var(--k,1)); }
.pbb-list { display:flex; flex-wrap:nowrap; gap:4px; }
/* one buff: the icon art as it is (32 px, round medallions / square premiums), the time under it */
.pbb-icon { position:relative; width:var(--s); height:var(--s); padding:0; margin:0; border:0; border-radius:0; cursor:inherit;
  background-repeat:no-repeat; image-rendering:auto; filter:drop-shadow(0 1px 1px #000c); color:#fff; font:inherit; }
/* time already gone: the game's draining shade, as a dial over round icons */
.pbb-icon > i { position:absolute; inset:2px; border-radius:50%; pointer-events:none;
  background:conic-gradient(#000a var(--gone,0deg), #0000 0); }
.pbb-premium > i { border-radius:2px; inset:1px; }
.pbb-icon > span { position:absolute; left:50%; bottom:-3px; transform:translateX(-50%); padding:0 2px; white-space:nowrap; pointer-events:none;
  color:#fff; font:bold calc(var(--s) * .31)/1.15 Tahoma,Verdana,sans-serif; letter-spacing:-.02em;
  text-shadow:1px 1px 0 #000,-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000; }
.pbb-force > span { color:#ffe9a8; }
.pbb-premium > span { color:#ffd623; }
.pbb-noart { background:radial-gradient(circle at 50% 35%,#4a3a22,#120d07 70%) !important; border-radius:50%; box-shadow:inset 0 0 0 2px #a88a52; }
.pbb-ending { animation:pbb-blink .5s steps(2,start) infinite; }
@keyframes pbb-blink { to { opacity:.35; } }
/* +N / show again: the game's empty buff ring with gold text */
.pbb-more { display:grid; place-items:center; color:var(--gold); font:bold calc(var(--s) * .36)/1 Georgia,'Times New Roman',serif;
  text-shadow:1px 1px 0 #1b0e00,0 0 3px #000; }
#pbb.pbb-immersive .pbb-more { opacity:.5; }
#pbb.pbb-immersive .pbb-more:hover { opacity:1; }
@media (hover:hover) { .pbb-list .pbb-icon:hover { filter:drop-shadow(0 0 3px #ffd62399) drop-shadow(0 1px 1px #000c); } }

/* hint: the game's info box look (dark glass, bronze line, Georgia gold title) */
.pbb-tip { position:fixed; z-index:62; max-width:240px; padding:6px 9px 7px; pointer-events:none;
  background:#040a07e8; border:1px solid #a88a52; box-shadow:inset 0 0 0 1px #000,0 2px 6px #000a;
  color:#e9e4d2; font:11px/1.35 Tahoma,Verdana,sans-serif; text-shadow:0 1px 1px #000; }
.pbb-tip b { color:#ffd623; font:bold 12px/1.2 Georgia,'Times New Roman',serif; }
.pbb-tip em { color:#c9b98a; font-style:normal; font-size:10px; }
.pbb-tip small { display:block; color:#9fe0ff; font-size:10px; }
.pbb-tip p { margin:2px 0 0; }
.pbb-tip hr { border:0; height:2px; margin:5px 0; background:url('system-assets/native/line.png') left center/100% 2px repeat-x; }

/* panel: all buffs + settings, in the classic frame */
.pbb-panel { position:fixed; z-index:63; width:min(290px,calc(100vw - 12px)); max-height:calc(100vh - 12px); overflow:auto; padding:28px 18px 16px;
  isolation:isolate; color:#e9e4d2; font:12px/1.35 Tahoma,Verdana,sans-serif; text-shadow:0 1px 1px #000; pointer-events:auto; }
.pbb-panel::after { content:''; position:absolute; inset:6px 6px 10px; z-index:-2; background:#040a07e0; }
.pbb-panel::before { content:''; position:absolute; inset:0; z-index:-1; border-style:solid; border-width:32px 64px 64px;
  border-image:url('system-assets/native/frame.png') 32 64 64 fill stretch; opacity:.97; }
.pbb-panel h3 { position:absolute; left:50%; top:2px; transform:translateX(-50%); width:170px; max-width:calc(100% - 50px); height:26px; margin:0;
  border-style:solid; border-width:0 30px; border-color:transparent; border-image:url('system-assets/native/title.png') 0 34 fill stretch;
  display:grid; place-items:center; color:#ffd623; font:bold 12px/1 Georgia,'Times New Roman',serif; white-space:nowrap; }
.pbb-rows { display:grid; gap:3px; margin:4px 0 8px; }
.pbb-row { display:grid; grid-template-columns:24px 1fr auto; align-items:center; gap:7px; padding:2px 0 3px;
  background:url('system-assets/native/line.png') left bottom/100% 2px repeat-x; }
.pbb-row .pbb-icon { --s:24px; filter:none; }
.pbb-row b { font-weight:normal; color:#e9e4d2; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.pbb-row em { font-style:normal; color:#ffd623; font-size:11px; white-space:nowrap; }
.pbb-none { margin:4px 0; color:#9f9a86; text-align:center; }
.pbb-panel label { display:flex; align-items:center; gap:6px; margin:5px 0; cursor:pointer; }
.pbb-panel input { accent-color:#c9953f; width:15px; height:15px; }
.pbb-plate { display:block; margin:8px auto 0; height:23px; padding:0 14px; border-style:solid; border-width:0 6px; border-color:transparent;
  border-image:url('system-assets/native/plate.png') 0 6 fill stretch; background:none; color:#ffd623;
  font:bold 11px/1 Georgia,'Times New Roman',serif; text-shadow:1px 1px 0 #1b0e00; cursor:pointer; }