/* Cursor-follow "Cannot afford!" toast for exchange/evolve buttons. */
.vir-cannot-afford{position:fixed;transform:translate(-50%,-100%);font-family:Calibri,sans-serif;font-size:15px;font-weight:800;color:#ff6060;text-shadow:0 0 6px rgba(0,0,0,0.9),0 0 10px rgba(255,40,60,0.55);pointer-events:none;z-index:999999;animation:virCannotAfford 1.1s ease-out forwards;white-space:nowrap;}
@keyframes virCannotAfford{
  0%  {opacity:0;transform:translate(-50%,-90%) scale(0.85);}
  15% {opacity:1;transform:translate(-50%,-100%) scale(1.08);}
  30% {transform:translate(-50%,-105%) scale(1);}
  100%{opacity:0;transform:translate(-50%,-160%) scale(1);}
}
/* ─── Virility Panel ─── */
#virility-panel{padding:8px 6px;border-top:2px solid #5a2040;background:#1a0c12;flex-shrink:0;min-height:96px;overflow-y:auto;max-height:32%;container-type:inline-size;position:relative;}
/* Action-button label compaction — when the panel is narrow enough that
   "Exchange Trait" / "Evolve Trait" wouldn't fit alongside the title, drop
   the word "Trait" from both labels. Threshold tuned for the title +
   score + chevron + both buttons fitting on one row. */
@container (max-width: 360px) {
  #virility-panel .vir-trait-word { display: none; }
}
/* Keep the Exchange / Evolve buttons shrinking with the panel instead of
   running off its right edge when the mid column gets narrow. The buttons are
   allowed to flex-shrink, and their padding + font-size scale down with the
   container's inline size (cqi) — full size at ~320px and above, gradually
   smaller below that. */
#virility-panel .virility-header-actions { flex-wrap: nowrap; min-width: 0; }
#virility-panel .virility-exchange-btn,
#virility-panel .virility-evolve-btn {
  flex-shrink: 1;
  min-width: 0;
  padding: 5px clamp(5px, 3.75cqi, 12px);
  font-size: clamp(10px, 4.5cqi, 14px);
}
.virility-header{display:flex;align-items:center;justify-content:flex-start;margin-bottom:8px;padding:0 44px 0 4px;gap:8px;flex-wrap:wrap;}
.virility-title{font-size:23px;font-weight:500;color:#c090a8;letter-spacing:0.03em;}
.virility-sperm-icon{width:1.15em;height:1.15em;vertical-align:-0.2em;display:inline-block;}
.virility-score{font-size:26px;font-weight:700;}
.virility-exchange-btn{background:#2a1040;border:1px solid #a050d0;border-radius:8px;padding:5px 12px;font-size:14px;font-weight:700;color:#d0a0ff;cursor:pointer;transition:background 0.15s,border-color 0.15s;white-space:nowrap;}
.virility-exchange-btn:hover{background:#4020a0;border-color:#c080ff;}
/* Now its own row beneath the bars (was previously a flex child of
   .virility-header pushed right via margin-left:auto). */
.virility-header-actions{display:flex;flex-direction:row;align-items:center;justify-content:flex-end;gap:6px;padding:0 4px;margin-bottom:8px;}
/* Mirrors #pin-upper-btn (the Shop "pin upper section" button): transparent
   fill, 1px thin pink-border on a 26×26 square with a 6px radius, soft
   purple hover. The chevron glyph stays as text content. */
.virility-collapse-btn{position:absolute;top:8px;right:10px;background:transparent;border:1px solid #4a2035;border-radius:6px;padding:0;width:28px;height:26px;font-size:13px;font-weight:700;color:#a07088;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;line-height:1;transition:border-color 0.15s,background 0.15s,box-shadow 0.15s,color 0.15s;flex-shrink:0;margin-left:0;z-index:2;}
.virility-collapse-btn:hover{border-color:#a060d0;background:rgba(160,80,200,0.12);color:#d0a0ff;}
#virility-panel.collapsed{min-height:0;padding-bottom:6px;}
#virility-panel.collapsed .virility-header{margin-bottom:0;}
/* Collapsed state hides everything except the title row + the score bar
   (the bar stays visible so the player can still see their virility at a
   glance). */
#virility-panel.collapsed .virility-header-actions,
#virility-panel.collapsed .virility-cat-label,
#virility-panel.collapsed .virility-icons{display:none;}
#virility-panel.collapsed .virility-bars{margin-bottom:0;}
.virility-header-actions .virility-evolve-btn{margin-left:0;}
.virility-cat-label{font-size:20px;font-weight:700;color:#7a4060;margin:8px 0 4px 4px;letter-spacing:0.04em;}
/* Virility Bars */
.virility-bars{margin-bottom:8px;padding:0 4px;}
.virility-bar-track{position:relative;height:14px;background:#0d0608;border-radius:7px;border:1px solid #3a1828;overflow:hidden;}
.virility-bar-fill{position:absolute;top:0;left:0;height:100%;border-radius:7px;transition:width 0.4s ease;}
.virility-bar-base{background:linear-gradient(90deg,#803030,#ff4040);}
.virility-bar-blue{background:linear-gradient(90deg,#3060d0,#50a0ff);box-shadow:0 0 8px rgba(80,160,255,0.6),0 0 16px rgba(80,160,255,0.3);animation:virility-glow-blue 1.5s ease-in-out infinite alternate;}
.virility-bar-purple{background:linear-gradient(90deg,#7030a0,#b050ff);box-shadow:0 0 8px rgba(176,80,255,0.6),0 0 16px rgba(176,80,255,0.3);animation:virility-glow-purple 1.5s ease-in-out infinite alternate;}
.virility-bar-label{position:absolute;right:6px;top:0;height:100%;display:flex;align-items:center;font-size:9px;color:rgba(255,255,255,0.7);font-weight:600;}
@keyframes virility-glow-blue{from{box-shadow:0 0 6px rgba(80,160,255,0.4),0 0 12px rgba(80,160,255,0.2);}to{box-shadow:0 0 12px rgba(80,160,255,0.8),0 0 24px rgba(80,160,255,0.4);}}
@keyframes virility-glow-purple{from{box-shadow:0 0 6px rgba(176,80,255,0.4),0 0 12px rgba(176,80,255,0.2);}to{box-shadow:0 0 12px rgba(176,80,255,0.8),0 0 24px rgba(176,80,255,0.4);}}
.virility-icons{display:flex;flex-wrap:wrap;gap:5px;padding:0 2px;}
.virility-icon{width:35px;height:35px;display:flex;align-items:center;justify-content:center;border-radius:7px;border:2.4px solid #555;background:#1e0e18;cursor:pointer;transition:all 0.15s;opacity:0.4;font-size:17px;}
.virility-icon.active{opacity:1;}
.virility-icon.bad{border-color:#cc3030;}
.virility-icon.bad.active{border-color:#ff4040;background:#2a0c0c;box-shadow:0 0 6px rgba(255,60,60,0.4);}
.virility-icon.good{border-color:#30a040;}
.virility-icon.good.active{border-color:#40e060;background:#0c2a10;box-shadow:0 0 6px rgba(60,220,80,0.4);}
.virility-icon.neutral{border-color:#888;}
.virility-icon.neutral.active{border-color:#ddd;background:#1a1a1a;box-shadow:0 0 6px rgba(200,200,200,0.3);}

/* Narrow-panel layout: when the panel itself is ≤550px, stack the action
   buttons side-by-side on their own row so the score stays beside the title.
   Trait labels and icons shrink 20% to keep things from wrapping further. */
@container (max-width: 550px){
  .virility-header-actions{flex-direction:row;align-items:center;justify-content:flex-end;gap:6px;flex-basis:100%;margin-left:0;}
  .virility-header-actions .virility-evolve-btn{margin-left:0;}
  .virility-cat-label{font-size:16px;}
  .virility-icon{width:28px;height:28px;font-size:13px;border-width:1.92px;border-radius:6px;}
}

/* ─── Exchange Wheel Modal ────────────────────────────────────────────────── */
.vir-wheel-modal{background:linear-gradient(145deg,#1a0a1e,#2a0f3a);border:2px solid #a050d0;border-radius:16px;padding:18px 22px 22px;width:540px;max-width:96vw;display:flex;flex-direction:column;align-items:center;gap:10px;position:relative;box-shadow:0 10px 40px rgba(0,0,0,0.6),0 0 24px rgba(160,80,208,0.35);animation:fadeInScale 0.25s ease;}
.vir-wheel-title{font-size:22px;font-weight:700;color:#e0b0ff;letter-spacing:0.04em;text-shadow:0 0 8px rgba(192,96,255,0.6);}
.vir-wheel-sub{font-size:13px;color:#c090c8;text-align:center;min-height:18px;max-width:460px;}
.vir-wheel-stage{position:relative;display:flex;align-items:center;justify-content:center;user-select:none;touch-action:none;}
.vir-wheel-guide{position:absolute;left:0;top:0;pointer-events:none;z-index:1;}
.vir-wheel-pointer{position:absolute;top:8px;left:50%;transform:translateX(-50%);font-size:30px;color:#ffd870;text-shadow:0 0 10px rgba(255,216,112,0.9),0 2px 3px rgba(0,0,0,0.7);z-index:3;pointer-events:none;}
.vir-wheel-spinner{display:flex;align-items:center;justify-content:center;filter:drop-shadow(0 4px 12px rgba(0,0,0,0.5));will-change:transform;position:relative;z-index:2;}
.vir-wheel-svg{display:block;}
.vir-wheel-handle{position:absolute;transform:translate(-50%,-50%);z-index:6;background:linear-gradient(180deg,#c080ff,#6030a0);border:2px solid #ffd870;border-radius:999px;padding:9px 16px 11px;color:#fff;font-weight:800;font-size:15px;letter-spacing:0.08em;cursor:grab;display:flex;align-items:center;gap:6px;box-shadow:0 6px 14px rgba(0,0,0,0.5),0 0 14px rgba(192,96,255,0.7);touch-action:none;animation:virHandlePulse 1.1s ease-in-out infinite;will-change:left,top;}
.vir-wheel-handle:active{cursor:grabbing;animation:none;}
.vir-wheel-handle-lbl{font-size:13px;}
.vir-wheel-target{position:absolute;transform:translate(-50%,-50%);z-index:4;font-size:12px;font-weight:800;letter-spacing:0.12em;color:#ffd870;background:rgba(40,10,60,0.85);border:1.5px dashed #ffd870;border-radius:999px;padding:6px 12px;pointer-events:none;opacity:0.45;transition:opacity 0.1s linear,transform 0.1s linear;}
@keyframes virHandlePulse{0%,100%{box-shadow:0 6px 14px rgba(0,0,0,0.5),0 0 14px rgba(192,96,255,0.7);}50%{box-shadow:0 6px 14px rgba(0,0,0,0.5),0 0 22px rgba(255,216,112,0.85);}}
.vir-wheel-winflash{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(0);font-size:72px;z-index:10;filter:drop-shadow(0 0 18px #ffd870);animation:virWinPop 0.9s cubic-bezier(0.34,1.56,0.64,1) forwards;pointer-events:none;}
@keyframes virWinPop{0%{transform:translate(-50%,-50%) scale(0);opacity:0;}40%{transform:translate(-50%,-50%) scale(1.4);opacity:1;}70%{transform:translate(-50%,-50%) scale(1);opacity:1;}100%{transform:translate(-50%,-50%) scale(1);opacity:0.9;}}

/* ─── PREMIUM SHOP ─────────────────────────────────────────────────────────── */
.premium-shop-modal{background:#1a0a0f;border:2px solid #c0a030;border-radius:16px;width:1060px;max-width:96vw;max-height:92vh;display:flex;flex-direction:column;overflow:hidden;animation:fadeInScale 0.25s ease;position:relative;}
.pshop-header{background:linear-gradient(135deg,#3a2000,#5a3800);padding:12px 22px 8px;text-align:center;border-bottom:2px solid #c0a030;position:relative;}
.pshop-x-btn{background:#3a0808;border:1px solid #7a1010;border-radius:6px;color:#ff6060;font-size:17px;font-weight:700;cursor:pointer;padding:3px 9px;line-height:1;transition:background 0.12s,border-color 0.12s;position:absolute;top:12px;right:16px;}
.pshop-x-btn:hover{background:#5a0c0c;border-color:#cc2020;}
.pshop-title{font-size:29px;font-weight:700;color:#ffe080;text-shadow:0 0 10px rgba(255,200,40,0.6);letter-spacing:1px;}
.pshop-subtitle{font-size:16px;color:#d0a050;margin-top:4px;animation:pulseDot 1.5s ease-in-out infinite;}
.pshop-timer{font-size:17px;color:#ff6060;font-weight:600;margin-top:6px;}
.pshop-banner{background:linear-gradient(90deg,#ff2020,#ff8020,#ff2020);background-size:200% 100%;animation:shopBannerSlide 3s linear infinite;padding:8px;text-align:center;font-size:17px;font-weight:700;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,0.5);}
@keyframes shopBannerSlide{0%{background-position:0% 50%;}100%{background-position:200% 50%;}}
.pshop-scroll{flex:1;overflow-y:auto;padding:12px 18px;}
.pshop-cat-label{font-size:17px;font-weight:600;color:#f0c0d0;margin:10px 0 6px;padding-bottom:3px;border-bottom:1px solid #3a1525;}
.pshop-cat-label:first-child{margin-top:0;}
.pshop-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(163px,1fr));gap:8px;margin-bottom:6px;}
.shop-item-card{background:#2a1020;border:1.5px solid #6a3050;border-radius:10px;padding:10px 8px 8px;text-align:center;cursor:pointer;transition:all 0.15s;position:relative;overflow:hidden;}
.shop-item-card:hover{background:#3a1535;border-color:#c0a030;transform:translateY(-2px);box-shadow:0 4px 16px rgba(200,160,40,0.3);}
.shop-tag{position:absolute;top:0;right:0;background:#ff2020;color:#fff;font-size:12px;font-weight:700;padding:2px 8px;border-radius:0 8px 0 8px;text-transform:uppercase;}
.shop-tag-whale{background:linear-gradient(135deg,#2040ff,#8020ff);animation:pulseDot 1.2s ease-in-out infinite;}
.shop-tag-best{background:#20a020;}
.shop-item-icon{font-size:26px;margin-bottom:3px;}
.shop-item-name{font-size:14px;font-weight:600;color:#f0c0d0;margin-bottom:2px;}
.shop-item-desc{font-size:13px;color:#a07088;margin-bottom:4px;line-height:1.25;}
.shop-item-price{font-size:16px;font-weight:700;color:#ffe080;}
.shop-old-price{font-size:13px;color:#805060;text-decoration:line-through;margin-right:4px;}
.shop-item-btn{background:#7030c0;border-radius:6px;padding:4px 0;margin-top:5px;font-size:13px;font-weight:700;color:#fff;text-transform:uppercase;letter-spacing:0.5px;}
.shop-item-card:hover .shop-item-btn{background:#9040e0;}
.pshop-footer{padding:10px 18px;border-top:1px solid #3a1525;text-align:center;}

/* ─── FAKE PAYMENT MODAL ──────────────────────────────────────────────────── */
.fake-pay-modal{background:#1a0a0f;border:2px solid #4080c0;border-radius:16px;width:420px;max-width:94vw;overflow:hidden;animation:fadeInScale 0.25s ease;transform:scale(1.3);transform-origin:center center;}
.fp-header{background:linear-gradient(135deg,#0a1a30,#1a3060);padding:16px 20px 10px;text-align:center;border-bottom:1px solid #3060a0;}
.fp-title{font-size:18px;font-weight:600;color:#90c0ff;}
.fp-lock{font-size:10px;color:#506080;margin-top:4px;}
.fp-order{padding:12px 20px;background:#120818;border-bottom:1px solid #2a1535;}
.fp-order-label{font-size:10px;color:#705080;font-weight:600;letter-spacing:1px;margin-bottom:6px;}
.fp-order-row{display:flex;justify-content:space-between;font-size:13px;color:#c0a0c0;padding:2px 0;}
.fp-order-price{color:#ffe080;font-weight:600;}
.fp-order-fee{font-size:11px;color:#605060;}
.fp-order-total{font-size:15px;font-weight:700;color:#f0c0d0;border-top:1px solid #3a1525;margin-top:6px;padding-top:6px;}
.fp-tabs{display:flex;border-bottom:1px solid #2a1535;background:#1a0d14;}
.fp-tab{flex:1;background:none;border:none;padding:10px;font-size:12px;color:#806080;cursor:pointer;transition:all 0.15s;border-bottom:2px solid transparent;}
.fp-tab.active{color:#90c0ff;border-bottom-color:#4080c0;background:#0a1020;}
.fp-tab:hover{color:#c0a0c0;}
.fp-form{padding:14px 20px;}
.fp-form label{display:block;font-size:11px;color:#806080;margin-bottom:3px;margin-top:10px;}
.fp-form label:first-child{margin-top:0;}
.fp-form input,.fp-form select{width:100%;background:#2a1525;border:1px solid #5a3050;border-radius:6px;padding:8px 10px;font-size:13px;color:#f0c0d0;outline:none;transition:border-color 0.15s;}
.fp-form input:focus{border-color:#4080c0;}
.fp-static-field{width:100%;box-sizing:border-box;background:#2a1525;border:1px solid #5a3050;border-radius:6px;padding:8px 10px;font-size:13px;color:#fff;font-family:monospace;letter-spacing:0.5px;user-select:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:default;}
.fp-row{display:flex;gap:10px;}
.fp-field{flex:1;}
.fp-pay-btn{display:block;width:calc(100% - 40px);margin:0 20px 12px;background:linear-gradient(135deg,#20a040,#40c060);border:none;border-radius:10px;padding:13px;font-size:16px;font-weight:700;color:#fff;cursor:pointer;text-transform:uppercase;letter-spacing:1px;transition:all 0.15s;text-shadow:0 1px 3px rgba(0,0,0,0.3);}
.fp-pay-btn:hover{background:linear-gradient(135deg,#30c050,#50e070);box-shadow:0 0 20px rgba(40,200,60,0.4);}
.fp-footer{text-align:center;padding:0 20px 10px;font-size:9px;color:#504050;}
.fp-cancel{display:block;width:calc(100% - 40px);margin:0 20px 16px;background:none;border:1px solid #3a1525;border-radius:8px;padding:8px;font-size:12px;color:#705060;cursor:pointer;}
.fp-cancel:hover{border-color:#6a3050;color:#a07088;}