/* ══════════════════════════════════════════════
   DartVault — Shared CSS (modals, rules, animations)
   ══════════════════════════════════════════════ */

/* ── Modals ── */
.modal-ov{display:none;position:fixed;inset:0;z-index:300;background:rgba(0,0,0,.8);backdrop-filter:blur(8px);align-items:center;justify-content:center;}
.modal-ov.open{display:flex;}
.modal{background:var(--bg2);border:1px solid rgba(255,255,255,.1);border-radius:20px;padding:24px 20px;max-width:360px;width:92%;max-height:90dvh;overflow-y:auto;text-align:center;animation:popIn .3s cubic-bezier(.34,1.56,.64,1);}
@keyframes popIn{from{opacity:0;transform:scale(.75)}to{opacity:1;transform:none}}
.modal-title{font-family:'Rajdhani',sans-serif;font-size:1.6rem;font-weight:900;margin-bottom:8px;line-height:1.1;}
.modal-sub{font-size:.85rem;opacity:.75;margin-bottom:20px;white-space:pre-line;line-height:1.7;}
.modal-btns{display:flex;flex-direction:column;gap:9px;align-items:stretch;}
.btn-modal{padding:12px;border-radius:10px;border:none;font-family:'Rajdhani',sans-serif;font-size:1.05rem;font-weight:700;cursor:pointer;transition:transform .15s;touch-action:manipulation;width:100%;text-align:center;}
.btn-modal:active{transform:scale(.96);}
.btn-gold{background:var(--accent);color:#000;}
.btn-green{background:var(--ok);color:#fff;}
.btn-gray{background:var(--bg3);color:var(--text);border:1px solid rgba(255,255,255,.1);}
.btn-red{background:var(--danger);color:#fff;}

/* ── Rules overlay (style welcome) ── */
.rules-overlay{display:none;position:fixed;inset:0;z-index:600;background:rgba(0,0,0,.92);backdrop-filter:blur(18px);align-items:center;justify-content:center;padding:16px;}
.rules-overlay.open{display:flex;}
.rules-card{
  background:linear-gradient(165deg,#1a1520 0%,#0f1923 50%,#131a12 100%);
  border:1px solid rgba(255,255,255,.1);border-radius:24px;padding:0;
  max-width:420px;width:100%;text-align:center;
  max-height:calc(100dvh - 32px);overflow:hidden;
  animation:rulesIn .5s cubic-bezier(.34,1.4,.64,1);
  position:relative;display:flex;flex-direction:column;
}
.rules-card-scroll{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;padding:28px 22px 28px;}
@keyframes rulesIn{from{opacity:0;transform:scale(.85) translateY(20px)}to{opacity:1;transform:none}}
.rules-card::before{content:'';position:absolute;top:-80px;left:50%;transform:translateX(-50%);width:300px;height:300px;border-radius:50%;background:radial-gradient(circle,rgba(232,197,71,.25) 0%,rgba(99,102,241,.12) 40%,transparent 70%);pointer-events:none;}
.rules-card::after{content:'';position:absolute;bottom:-60px;right:-40px;width:200px;height:200px;border-radius:50%;background:radial-gradient(circle,rgba(52,211,153,.15) 0%,transparent 65%);pointer-events:none;}

/* Header */
.rules-quick-header{text-align:center;margin-bottom:12px;position:relative;}
.rules-quick-emoji{display:block;font-size:2.8rem;margin-bottom:4px;line-height:1;position:relative;z-index:2;animation:rqp-bounce 1.2s ease-in-out .4s both;}
@keyframes rqp-bounce{0%{transform:scale(0) rotate(-20deg)}50%{transform:scale(1.15) rotate(5deg)}100%{transform:scale(1) rotate(0)}}
.rules-quick-title{font-family:'Rajdhani',sans-serif;font-size:1.45rem;font-weight:900;letter-spacing:3px;display:block;background:linear-gradient(135deg,#E8C547 30%,#F0A040 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;filter:drop-shadow(0 0 12px rgba(232,197,71,.4));}
.rules-quick-players{display:block;font-size:.75rem;color:#888;margin-top:3px;}
.rules-quick-catch{font-size:.88rem;font-style:italic;color:#E0E0E0;opacity:.75;text-align:center;line-height:1.5;margin-bottom:12px;padding:0 4px;}

/* Points / steps */
@keyframes rqp-enter{from{opacity:0;transform:translateX(-16px)}to{opacity:1;transform:none}}
.rules-quick-points{display:flex;flex-direction:column;gap:8px;margin-bottom:14px;text-align:left;position:relative;}
.rules-quick-point{display:flex;flex-direction:column;align-items:center;gap:3px;padding:8px 14px;border-radius:14px;opacity:0;animation:rqp-enter .4s ease-out forwards;position:relative;}
.rules-quick-point:nth-child(1){animation-delay:.2s;background:rgba(56,189,248,.1);border:1px solid rgba(56,189,248,.25);}
.rules-quick-point:nth-child(1) .rqp-title{color:#38BDF8;}
.rules-quick-point:nth-child(1) .rqp-icon-wrap{filter:drop-shadow(0 0 8px rgba(56,189,248,.5));}
.rules-quick-point:nth-child(2){animation-delay:.4s;background:rgba(255,159,67,.1);border:1px solid rgba(255,159,67,.25);}
.rules-quick-point:nth-child(2) .rqp-title{color:#FBBF24;}
.rules-quick-point:nth-child(2) .rqp-icon-wrap{filter:drop-shadow(0 0 8px rgba(245,158,11,.5));}
.rules-quick-point:nth-child(3){animation-delay:.6s;background:rgba(52,211,153,.1);border:1px solid rgba(52,211,153,.25);}
.rules-quick-point:nth-child(3) .rqp-title{color:#34D399;}
.rules-quick-point:nth-child(3) .rqp-icon-wrap{filter:drop-shadow(0 0 8px rgba(52,211,153,.5));}
.rules-quick-point:nth-child(4){animation-delay:.8s;background:rgba(167,139,250,.1);border:1px solid rgba(167,139,250,.25);}
.rules-quick-point:nth-child(4) .rqp-title{color:#A78BFA;}
.rules-quick-point:nth-child(4) .rqp-icon-wrap{filter:drop-shadow(0 0 8px rgba(167,139,250,.5));}
.rules-quick-point:nth-child(5){animation-delay:1s;background:rgba(251,113,133,.1);border:1px solid rgba(251,113,133,.25);}
.rules-quick-point:nth-child(5) .rqp-title{color:#FB7185;}
.rules-quick-point:nth-child(5) .rqp-icon-wrap{filter:drop-shadow(0 0 8px rgba(251,113,133,.5));}

.rqp-icon-wrap{font-size:1.3rem;flex-shrink:0;line-height:1;}
.rqp-text{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center;}
.rqp-title{font-family:'Rajdhani',sans-serif;font-size:1rem;font-weight:700;letter-spacing:.5px;}
.rqp-desc{font-size:.78rem;line-height:1.45;color:#E0E0E0;opacity:.75;}

/* Expand button */
.rules-expand-btn{display:flex;align-items:center;justify-content:center;gap:7px;width:100%;margin-bottom:14px;padding:9px 14px;background:transparent;border:1px dashed rgba(255,255,255,.2);border-radius:10px;color:rgba(255,255,255,.5);font-family:'Rajdhani',sans-serif;font-size:.83rem;font-weight:700;letter-spacing:1px;cursor:pointer;touch-action:manipulation;transition:all .2s;}
.rules-expand-btn:hover,.rules-expand-btn:active{background:rgba(255,255,255,.05);color:#E8C547;border-color:rgba(232,197,71,.4);border-style:solid;}
.rules-expand-arrow{transition:transform .25s;display:inline-block;font-style:normal;font-size:.7rem;}
.rules-expand-btn.open .rules-expand-arrow{transform:rotate(90deg);}
.rules-full-content{overflow:hidden;transition:max-height .35s cubic-bezier(.4,0,.2,1),opacity .3s;max-height:0;opacity:0;}
.rules-full-content.open{max-height:2000px;opacity:1;}
.rules-full-inner{padding-top:16px;border-top:1px solid rgba(255,255,255,.1);margin-top:2px;text-align:left;}

/* OK button */
.rules-ok-btn{width:100%;padding:13px;border-radius:14px;border:none;background:linear-gradient(135deg,#E8C547 0%,#F0A040 100%);color:#0A0A0A;font-family:'Rajdhani',sans-serif;font-size:1.1rem;font-weight:700;letter-spacing:2.5px;cursor:pointer;touch-action:manipulation;transition:all .2s;position:relative;box-shadow:0 4px 24px rgba(232,197,71,.35);animation:rqp-enter .4s ease-out .9s both;}
.rules-ok-btn:active{transform:scale(.97);box-shadow:0 2px 12px rgba(232,197,71,.3);}
.rules-dismiss{display:flex;align-items:center;justify-content:center;gap:9px;margin-top:12px;position:relative;animation:rqp-enter .4s ease-out 1s both;}
.rules-dismiss input[type="checkbox"]{width:18px;height:18px;accent-color:#E8C547;cursor:pointer;flex-shrink:0;}
.rules-dismiss label{font-size:.76rem;color:#888;cursor:pointer;user-select:none;letter-spacing:.3px;}

/* Rules sections (full rules) */
.rules-section{margin-bottom:14px;}
.rules-section:last-child{margin-bottom:0;}
.rules-section-title{font-family:'Rajdhani',sans-serif;font-size:.72rem;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:rgba(255,255,255,.5);margin-bottom:6px;padding-bottom:4px;border-bottom:1px solid rgba(255,255,255,.1);}
.rules-row{display:flex;align-items:baseline;gap:7px;margin-bottom:4px;font-size:.83rem;line-height:1.5;color:#E0E0E0;opacity:.88;}
.rules-row:last-child{margin-bottom:0;}
.rules-arrow{color:#E8C547;flex-shrink:0;font-size:.8rem;}
.rules-catch{font-style:italic;font-size:.84rem;opacity:.7;margin-bottom:14px;line-height:1.5;text-align:center;}
.rules-game-title{font-family:'Rajdhani',sans-serif;font-size:1.25rem;font-weight:700;color:#E8C547;letter-spacing:2px;text-align:center;margin-bottom:6px;}

/* ── Reduced motion ── */
@media(prefers-reduced-motion:reduce){
  .rules-quick-point,.rules-ok-btn,.rules-dismiss{animation:none;opacity:1;}
  .rules-quick-emoji{animation:none;}
  .modal{animation:none!important;}
  .rules-card{animation:none!important;}
}

/* ── Light theme overrides ── */
[data-theme="light"] .rules-card{background:linear-gradient(165deg,#f5f0ff 0%,#edf5ff 50%,#f0f7ef 100%);border-color:rgba(0,0,0,.1);}
[data-theme="light"] .rules-card::before{background:radial-gradient(circle,rgba(232,197,71,.15) 0%,rgba(99,102,241,.08) 40%,transparent 70%);}
[data-theme="light"] .rules-card::after{background:radial-gradient(circle,rgba(52,211,153,.1) 0%,transparent 65%);}
[data-theme="light"] .rules-quick-title{filter:none;}
[data-theme="light"] .rules-quick-catch{color:#555;}
[data-theme="light"] .rqp-desc{color:#555;opacity:1;}
[data-theme="light"] .rules-quick-point:nth-child(1){background:rgba(14,120,200,.08);border-color:rgba(14,120,200,.2);}
[data-theme="light"] .rules-quick-point:nth-child(1) .rqp-title{color:#0e78c8;}
[data-theme="light"] .rules-quick-point:nth-child(2){background:rgba(200,110,0,.08);border-color:rgba(200,110,0,.2);}
[data-theme="light"] .rules-quick-point:nth-child(2) .rqp-title{color:#c86e00;}
[data-theme="light"] .rules-quick-point:nth-child(3){background:rgba(20,150,80,.08);border-color:rgba(20,150,80,.2);}
[data-theme="light"] .rules-quick-point:nth-child(3) .rqp-title{color:#14965a;}
[data-theme="light"] .rules-quick-point:nth-child(4){background:rgba(124,58,237,.08);border-color:rgba(124,58,237,.2);}
[data-theme="light"] .rules-quick-point:nth-child(4) .rqp-title{color:#7C3AED;}
[data-theme="light"] .rules-quick-point:nth-child(5){background:rgba(220,53,69,.08);border-color:rgba(220,53,69,.2);}
[data-theme="light"] .rules-quick-point:nth-child(5) .rqp-title{color:#dc3545;}
[data-theme="light"] .rules-expand-btn{border-color:rgba(0,0,0,.15);color:#666;}
[data-theme="light"] .rules-expand-btn:hover,[data-theme="light"] .rules-expand-btn:active{background:rgba(0,0,0,.04);color:#333;border-color:rgba(0,0,0,.3);}
[data-theme="light"] .rules-full-inner{border-top-color:rgba(0,0,0,.08);}
[data-theme="light"] .rules-section-title{color:#888;border-bottom-color:rgba(0,0,0,.08);}
[data-theme="light"] .rules-row{color:#333;}
[data-theme="light"] .rules-dismiss label{color:#999;}
[data-theme="light"] .rules-quick-players{color:#999;}

/* ── Profile picker — light mode ── */
[data-theme="light"] .pp-profile-row.checked{border-color:var(--ok)!important;background:rgba(26,138,74,.1)!important;}
[data-theme="light"] .pp-profile-row.checked .pp-check{border-color:var(--ok)!important;background:var(--ok)!important;color:#fff!important;}
[data-theme="light"] .pp-btn-add-manual{background:var(--ok)!important;color:#fff!important;}
[data-theme="light"] .pp-btn-manage{background:rgba(26,138,74,.1)!important;border-color:rgba(26,138,74,.35)!important;color:var(--ok)!important;}