/* The Premium account (web/js/premium.js, Store › Premium in web/js/store.js; the owner's mockup p01–p12, 2026-10-24):
   only the client's pieces (pf-panel, an-kv, sf-form, st-card, ba-outcome) and DESIGN.md's colours. */
img.pm-crown{width:16px;height:16px;image-rendering:pixelated;vertical-align:-3px}
img.pm-ava{position:absolute;right:2px;top:2px;width:16px;height:16px;image-rendering:pixelated;pointer-events:none}
#avatar{position:relative}
img.pm-art{width:32px;height:32px;image-rendering:pixelated}
img.pm-art.off{filter:grayscale(1) brightness(.75)}
#game .app-menu button.pm-menu{height:auto;min-height:40px}
.pm-menu>span{flex:1;min-width:0}
.pm-menu b{font-weight:normal}
.pm-menu small{color:#a9a9a9;font-size:10px;line-height:12px}
.pm-menu em{font-style:normal;color:#5fc85f;font-size:10px;white-space:nowrap}
.pm-menu em.warn{color:#e8c547}
.pm-acct{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px;align-items:center;padding:4px 6px;font:11px/13px 'Tibia Pixel',Verdana,sans-serif;color:#c0c0c0}
.pm-acct img{width:32px;height:32px;image-rendering:pixelated}
.pm-acct b{display:block;font:12px/14px 'Tibia Pixel',Verdana,sans-serif;color:#fff;font-weight:normal}
.pm-acct b.on{color:#e4ca78}
.pm-acct small{display:block;color:#a9a9a9;font-size:10px;line-height:12px}
.pm-strip{display:grid;grid-template-columns:auto minmax(0,1fr);gap:6px;align-items:center;margin:0;padding:4px 6px;background:#2b2614;border:1px solid #3b3218;box-shadow:inset 1px 1px #000;font:11px/13px 'Tibia Pixel',Verdana,sans-serif;color:#c0c0c0}
.pm-strip b{color:#e8c547;font-weight:normal}
.sf-form .pm-tag{font-style:normal;color:#e8c547}
.sf-form.is-locked{opacity:.6}
.pm-chips{display:flex;gap:3px;padding:4px}
.pm-chips button{flex:1;min-height:32px}
.pm-days{display:grid;gap:2px;padding:4px}
.pm-day{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px;align-items:center;padding:3px 5px;background:#262626;border:1px solid #111;box-shadow:inset 1px 1px #000;font:11px/13px 'Tibia Pixel',Verdana,sans-serif}
.pm-day b{display:block;color:#fff;font-weight:normal}
.pm-day small{display:block;color:#a9a9a9;font-size:10px;line-height:12px}
.pm-day .n{text-align:right}
.pm-day .n b{color:#5fc85f}
.pm-planb{max-height:60vh;overflow:auto}
/* Store › Premium */
.pm-durs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;padding:4px}
.pm-durs.n4{grid-template-columns:repeat(4,minmax(0,1fr))}
.pm-durs .st-card{padding:14px 2px 4px}
.pm-durs .st-card>img{width:32px;height:32px;image-rendering:pixelated}
.pm-durs .st-tag{font-size:9px;line-height:12px;padding:0 2px}
@media (min-width:1000px){.pm-durs .st-card>img{width:64px;height:64px}}
.pm-durs .st-tag{position:absolute;left:50%;top:2px;transform:translateX(-50%);margin:0}
.pm-cmp{display:grid;gap:1px;padding:4px}
.pm-cr{display:grid;grid-template-columns:minmax(0,1fr) 70px 82px;gap:4px;align-items:center;min-height:22px;padding:2px 5px;background:#262626;border:1px solid #111;box-shadow:inset 1px 1px #000;font:11px/13px 'Tibia Pixel',Verdana,sans-serif;color:#fff}
.pm-cr.hd{min-height:0;background:none;border:0;box-shadow:none;color:#a9a9a9;font-size:10px;line-height:12px}
.pm-cr>span{min-width:0}
.pm-cr small{display:block;color:#a9a9a9;font-size:10px;line-height:12px}
.pm-cr i{font-style:normal;color:#a9a9a9;font-size:10px;line-height:12px;text-align:center}
.pm-cr em{font-style:normal;color:#e8c547;font-size:10px;line-height:12px;text-align:center}
.pm-cr em.same{color:#5fc85f}
.pm-more{display:flex;justify-content:flex-end;padding:0 4px 4px}
.pm-more button{min-height:30px;padding:0 10px}
.pm-opts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;padding:4px}
.pm-opts button{position:relative;display:grid;justify-items:start;gap:1px;min-width:0;min-height:42px;padding:3px 6px;text-align:left;line-height:13px}
.pm-opts button.active{color:#fff;border-color:#c5b47c;box-shadow:inset 0 0 0 1px #c5b47c}
.pm-opts small{color:#a9a9a9;font-size:10px;white-space:nowrap}
.pm-opts .st-price{font-size:11px}
.pm-opts .st-price img{width:16px;height:16px;margin:-3px 0}
.pm-to{display:grid;gap:3px;padding:4px}
.pm-to input{width:100%;min-height:32px}
.pm-to small{color:#a9a9a9;font-size:10px}
@media (min-width:1000px){.pm-durs,.pm-durs.n4{grid-template-columns:repeat(4,minmax(0,1fr))}.pm-opts{grid-template-columns:repeat(4,minmax(0,1fr))}}
#outcome.pm-out .an-kv{grid-template-columns:minmax(0,1fr) auto}
.pm-opt.is-sel{outline:2px solid #c5b47c;outline-offset:-2px;color:#e8c547}