/* ==========================================================
   OTSI Player Login page — Ronin blocks shared stylesheet
   Loaded by every pms-ronin-playerlogin-* block. Relies on
   the shared design tokens defined in ronin-shell.css.
   ========================================================== */

/* ---------- Hero ---------- */
.pllh{ display:grid; grid-template-columns:49fr 51fr; align-items:stretch; }
.pllh__left{ position:relative; overflow:hidden; background:var(--navy-950); color:#fff; padding:34px 34px 28px; display:flex; flex-direction:column; }
.pllh__glow{ position:absolute; inset:0; background:radial-gradient(420px 320px at 40% 45%, rgba(63,126,232,.22), transparent 70%); pointer-events:none; }
.pllh__eyebrow-sub{ position:relative; font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:#93a4c2; margin-bottom:6px; }
.pllh__eyebrow{ position:relative; font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--gold); margin-bottom:10px; }
.pllh__title{ position:relative; font-size:27px; line-height:1.2; font-weight:800; color:#fff; margin-bottom:12px; max-width:280px; }
.pllh__desc{ position:relative; font-size:13px; line-height:1.6; color:#b7c2d9; max-width:340px; margin-bottom:20px; }

.pllh__flow{ position:relative; display:flex; align-items:flex-start; justify-content:space-between; max-width:340px; margin-bottom:22px; }
.pllh__flow-node{ display:flex; flex-direction:column; align-items:center; gap:8px; width:78px; text-align:center; }
.pllh__flow-circle{ width:56px; height:56px; border-radius:50%; background:var(--navy-800); border:1.4px solid var(--blue-ring); display:flex; align-items:center; justify-content:center; box-shadow:0 0 14px rgba(63,126,232,.35); }
.pllh__flow-circle svg{ width:22px; height:22px; color:#fff; }
.pllh__flow-node--mid .pllh__flow-circle{ width:64px; height:64px; border:2px solid var(--gold); box-shadow:0 0 18px rgba(212,168,83,.5); }
.pllh__flow-node--mid .pllh__flow-circle svg{ width:24px; height:24px; color:var(--gold); }
.pllh__flow-label{ font-size:10.5px; font-weight:600; color:#dbe4f3; line-height:1.3; }
.pllh__flow-arrow{ flex:1; margin-top:28px; height:12px; display:flex; align-items:center; }
.pllh__flow-arrow svg{ width:100%; height:8px; }
.pllh__flow-arrow line{ stroke:var(--blue-ring); stroke-width:1.4; stroke-dasharray:2.5 3.5; }

.pllh__benefits{ display:flex; flex-direction:column; gap:10px; margin-top:auto; }
.pllh__benefit{ display:flex; align-items:center; gap:10px; font-size:12px; color:#dbe4f3; }
.pllh__benefit-icon{ width:20px; height:20px; flex-shrink:0; border-radius:50%; display:flex; align-items:center; justify-content:center; }
.pllh__benefit-icon svg{ width:12px; height:12px; }
.pllh__benefit-icon--green{ background:rgba(63,196,140,.18); color:var(--green); }
.pllh__benefit-icon--blue{ background:rgba(63,126,232,.18); color:#7fb0ff; }
.pllh__benefit-icon--gold{ background:rgba(212,168,83,.18); color:var(--gold); }

.pllh__right{ background:var(--bg-tint); display:flex; align-items:center; justify-content:center; padding:26px 24px; }
.pllh__card{ width:100%; max-width:390px; background:#fff; border:1px solid var(--gray-200); border-radius:var(--radius-lg); padding:20px 20px 18px; box-shadow:var(--shadow-card); }

.pllh__roletabs{ display:grid; grid-template-columns:1fr 1fr; gap:4px; margin-bottom:16px; border-bottom:1px solid var(--gray-200); }
.pllh__roletab{ display:flex; align-items:center; justify-content:center; gap:6px; padding:0 4px 10px; background:transparent; border:none; border-bottom:2px solid transparent; cursor:pointer; font-size:12px; font-weight:700; color:var(--ink-soft); }
.pllh__roletab-icon{ width:16px; height:16px; color:var(--ink-soft); }
.pllh__roletab-icon svg{ width:100%; height:100%; }
.pllh__roletab.is-active{ color:var(--blue-ring); border-color:var(--blue-ring); }
.pllh__roletab.is-active .pllh__roletab-icon{ color:var(--blue-ring); }

.pllh__form{ display:flex; flex-direction:column; }
.pllh__label{ font-size:11px; font-weight:700; color:var(--ink); margin:10px 0 5px; }
.pllh__input{ width:100%; padding:10px 12px; border:1px solid var(--gray-200); border-radius:8px; font-size:13px; color:var(--ink); background:#fff; }
.pllh__input:focus{ outline:2px solid var(--blue-ring); outline-offset:1px; }
.pllh__pwd-wrap{ position:relative; }
.pllh__pwd-eye{ position:absolute; right:10px; top:50%; transform:translateY(-50%); width:18px; height:18px; padding:0; background:none; border:none; cursor:pointer; color:var(--gray-500); }
.pllh__pwd-eye svg{ width:100%; height:100%; }
.pllh__check{ display:flex; align-items:center; gap:7px; font-size:12px; color:var(--ink-soft); margin-top:10px; cursor:pointer; }
.pllh__check input{ width:14px; height:14px; }
.pllh__submit,a.pllh__submit:link,a.pllh__submit:visited{ width:100%; margin-top:16px; padding:11px; border:none; border-radius:8px; background:var(--gold); color:var(--navy-950); font-size:13px; font-weight:700; display:flex; align-items:center; justify-content:center; gap:8px; cursor:pointer; text-align:center; text-decoration:none; }
.pllh__submit svg{ width:15px; height:15px; }
.pllh__submit:hover{ background:#f4bd5c; }
.pllh__forgot{ display:block; text-align:center; margin-top:12px; font-size:12px; color:var(--blue-ring); font-weight:600; }
.pllh__divider{ display:flex; align-items:center; gap:10px; margin:16px 0; font-size:11px; color:var(--gray-500); }
.pllh__divider::before,.pllh__divider::after{ content:""; flex:1; height:1px; background:var(--gray-200); }
.pllh__verify-btn,a.pllh__verify-btn:link,a.pllh__verify-btn:visited{ width:100%; display:flex; align-items:center; justify-content:center; gap:8px; padding:10px; border:1.4px solid var(--gray-200); border-radius:8px; background:#fff; color:var(--ink); font-size:12.5px; font-weight:700; text-align:center; text-decoration:none; }
.pllh__verify-btn:hover{ background:var(--bg-tint); }
.pllh__verify-btn svg{ width:15px; height:15px; color:var(--ink-soft); }
.pllh__notice{ display:flex; align-items:flex-start; gap:8px; background:var(--bg-tint); border-radius:8px; padding:10px 12px; margin-top:14px; }
.pllh__notice-icon{ width:15px; height:15px; flex-shrink:0; margin-top:1px; color:var(--ink-soft); }
.pllh__notice-icon svg{ width:100%; height:100%; }
.pllh__notice p{ font-size:11px; line-height:1.5; color:var(--gray-500); margin:0; }
.pllh__firsttime{ text-align:center; font-size:12.5px; color:var(--ink-soft); margin-top:14px; }
.pllh__firsttime a{ color:var(--blue-ring); font-weight:700; }
.pllh__error{ background:#fdecec; border:1px solid #f3b8b8; color:#a12727; font-size:12px; padding:8px 10px; border-radius:6px; margin-bottom:10px; }
.pllh__signedin-copy{ font-size:13px; color:var(--ink-soft); margin-bottom:14px; }
.pllh__card-title{ font-size:15px; font-weight:800; color:var(--ink); margin-bottom:14px; }

@media (max-width:900px){
  .pllh{ grid-template-columns:1fr; }
  .pllh__title,.pllh__desc{ max-width:none; }
}

/* ---------- Access routes (3 cards) ---------- */
.pllr{ padding:44px 0 48px; background:#fff; }
.pllr__heading{ font-size:15px; font-weight:800; color:var(--ink); margin-bottom:20px; }
.pllr__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; align-items:stretch; }
.pllr__card{ display:flex; flex-direction:column; background:#fff; border:1px solid var(--gray-200); border-radius:var(--radius-md); padding:18px; }
.pllr__card-head{ display:flex; align-items:center; gap:9px; margin-bottom:12px; }
.pllr__card-icon{ width:22px; height:22px; flex-shrink:0; color:var(--blue-ring); }
.pllr__card-icon svg{ width:100%; height:100%; }
.pllr__card strong{ font-size:13.5px; color:var(--ink); }
.pllr__card p{ font-size:11.5px; line-height:1.5; color:var(--ink-soft); margin-bottom:10px; }
.pllr__reqlist{ list-style:none; margin:0 0 14px; padding:0; display:flex; flex-direction:column; gap:6px; flex:1; }
.pllr__reqlist li{ display:flex; align-items:center; gap:7px; font-size:11.5px; color:var(--ink-soft); }
.pllr__reqlist svg{ width:13px; height:13px; flex-shrink:0; color:var(--green); }
.pllr__card-btn{ margin-top:auto; width:100%; height:36px; background:#fff; border:1.4px solid var(--blue-ring); border-radius:8px; font-size:12px; font-weight:700; color:var(--blue-ring); text-align:center; text-decoration:none; display:flex; align-items:center; justify-content:center; }
.pllr__card-btn:hover{ background:var(--blue-tint); }

@media (max-width:900px){
  .pllr__grid{ grid-template-columns:1fr; }
}

/* ---------- How access works (4-step) + Request form ---------- */
.pllq{ padding:8px 0 48px; background:var(--bg-tint); }
.pllq__heading{ font-size:15px; font-weight:800; color:var(--ink); margin-bottom:20px; }
.pllq__grid{ display:grid; grid-template-columns:1fr 1.35fr; gap:18px; align-items:start; }
.pllq__steps{ display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-bottom:20px; }
.pllq__step{ display:flex; flex-direction:column; align-items:center; text-align:center; gap:8px; }
.pllq__step-num{ width:34px; height:34px; border-radius:50%; background:#fff; border:1.4px solid var(--gray-200); display:flex; align-items:center; justify-content:center; font-size:12px; font-weight:800; color:var(--ink); }
.pllq__step-icon{ width:20px; height:20px; color:var(--blue-ring); }
.pllq__step-icon svg{ width:100%; height:100%; }
.pllq__step strong{ font-size:11px; color:var(--ink); }
.pllq__step span{ font-size:10.5px; color:var(--ink-soft); line-height:1.4; }
.pllq__form-card{ background:#fff; border:1px solid var(--gray-200); border-radius:var(--radius-md); padding:18px; }
.pllq__form{ display:flex; flex-direction:column; gap:2px; }
.pllq__radio-row{ display:flex; gap:16px; margin-bottom:10px; }
.pllq__radio{ display:flex; align-items:center; gap:6px; font-size:12px; color:var(--ink); }
.pllq__row{ display:grid; gap:12px; margin-bottom:8px; grid-template-columns:repeat(2,1fr); }
.pllq__field{ display:flex; flex-direction:column; }
.pllq__label{ font-size:11px; font-weight:700; color:var(--ink); margin-bottom:5px; }
.pllq__input,.pllq__select{ width:100%; padding:9px 10px; border:1px solid var(--gray-200); border-radius:7px; font-size:12.5px; color:var(--ink); background:#fff; }
.pllq__upload{ display:flex; align-items:center; align-self:flex-start; width:fit-content; gap:8px; padding:9px 14px; border:1px dashed var(--gray-200); border-radius:7px; font-size:12px; color:var(--ink-soft); cursor:pointer; margin-top:5px; }
.pllq__upload svg{ width:16px; height:16px; flex-shrink:0; }
.pllq__consent{ display:flex; align-items:flex-start; gap:8px; font-size:11.5px; color:var(--ink-soft); line-height:1.5; margin:12px 0; }
.pllq__consent input{ margin-top:2px; }
.pllq__submit{ margin-top:6px; padding:11px; border:none; border-radius:8px; background:var(--gold); color:var(--navy-950); font-size:12.5px; font-weight:700; display:flex; align-items:center; justify-content:center; gap:8px; cursor:pointer; }
.pllq__submit svg{ width:14px; height:14px; }
.pllq__msg{ font-size:12px; margin-top:10px; display:none; }

@media (max-width:900px){
  .pllq__grid{ grid-template-columns:1fr; }
  .pllq__steps{ grid-template-columns:repeat(2,1fr); }
  .pllq__row{ grid-template-columns:1fr; }
}

/* ---------- Account Recovery Centre (4 boxes) ---------- */
.pllc{ padding:8px 0 48px; background:#fff; }
.pllc__heading{ font-size:15px; font-weight:800; color:var(--ink); margin-bottom:4px; }
.pllc__sub{ font-size:12.5px; color:var(--ink-soft); margin-bottom:18px; }
.pllc__grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; align-items:stretch; }
.pllc__box{ display:flex; flex-direction:column; background:#fff; border:1px solid var(--gray-200); border-radius:var(--radius-md); padding:16px; }
.pllc__box-head{ display:flex; align-items:center; gap:8px; margin-bottom:10px; }
.pllc__box-icon{ width:18px; height:18px; flex-shrink:0; color:var(--blue-ring); }
.pllc__box-icon svg{ width:100%; height:100%; }
.pllc__box strong{ font-size:12.5px; color:var(--ink); }
.pllc__box p{ font-size:11px; line-height:1.5; color:var(--ink-soft); margin-bottom:10px; }
.pllc__box input,.pllc__box select{ width:100%; padding:8px 9px; border:1px solid var(--gray-200); border-radius:6px; font-size:11.5px; color:var(--ink); margin-bottom:8px; }
.pllc__codeinputs{ display:flex; gap:5px; margin-bottom:10px; }
.pllc__codeinputs input{ width:100%; text-align:center; padding:8px 0; margin-bottom:0; }
.pllc__box-btn{ margin-top:auto; width:100%; padding:9px; border:none; border-radius:7px; background:var(--gold); color:var(--navy-950); font-size:11.5px; font-weight:700; cursor:pointer; }
.pllc__box--empty{ align-items:center; justify-content:center; text-align:center; background:var(--bg-tint); border-style:dashed; }
.pllc__empty-icon{ width:30px; height:30px; color:var(--gray-500); margin-bottom:8px; }
.pllc__empty-icon svg{ width:100%; height:100%; }
.pllc__box--empty strong{ font-size:12px; color:var(--ink); margin-bottom:6px; }
.pllc__box--empty p{ font-size:10.5px; color:var(--gray-500); }
.pllc__msg{ font-size:11.5px; margin-top:8px; display:none; }

@media (max-width:1000px){
  .pllc__grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:600px){
  .pllc__grid{ grid-template-columns:1fr; }
}

/* ---------- What opens after sign-in (6 icons) ---------- */
.plla{ padding:8px 0 48px; background:var(--bg-tint); }
.plla__heading{ font-size:15px; font-weight:800; color:var(--ink); margin-bottom:4px; }
.plla__sub{ font-size:12.5px; color:var(--ink-soft); margin-bottom:20px; }
.plla__grid{ display:grid; grid-template-columns:repeat(6,1fr); gap:12px; }
.plla__item{ display:flex; flex-direction:column; align-items:center; text-align:center; gap:8px; background:#fff; border:1px solid var(--gray-200); border-radius:var(--radius-md); padding:16px 10px; }
.plla__icon{ width:26px; height:26px; color:var(--blue-ring); }
.plla__icon svg{ width:100%; height:100%; }
.plla__item strong{ font-size:11.5px; color:var(--ink); }
.plla__item span{ font-size:10px; color:var(--ink-soft); line-height:1.4; }
.plla__note{ margin-top:14px; text-align:center; font-size:11px; color:var(--gray-500); }

@media (max-width:900px){
  .plla__grid{ grid-template-columns:repeat(3,1fr); }
}
@media (max-width:520px){
  .plla__grid{ grid-template-columns:repeat(2,1fr); }
}

/* ---------- Access & data boundaries + Security checklist ---------- */
.pllb{ padding:8px 0 48px; background:#fff; }
.pllb__row{ display:grid; grid-template-columns:1.3fr 1fr; gap:18px; align-items:start; }
.pllb__heading{ font-size:13.5px; font-weight:800; color:var(--ink); margin-bottom:4px; }
.pllb__sub{ font-size:11.5px; color:var(--ink-soft); margin-bottom:12px; }
.pllb__cards{ display:flex; flex-direction:column; gap:10px; }
.pllb__card{ display:flex; gap:12px; background:#fff; border:1px solid var(--gray-200); border-radius:8px; padding:12px; }
.pllb__card-icon{ width:22px; height:22px; flex-shrink:0; color:var(--blue-ring); }
.pllb__card-icon svg{ width:100%; height:100%; }
.pllb__card strong{ display:block; font-size:12px; color:var(--ink); margin-bottom:3px; }
.pllb__card p{ font-size:11.5px; color:var(--ink-soft); line-height:1.5; }
.pllb__checklist{ display:flex; flex-direction:column; gap:8px; margin-top:6px; }
.pllb__check-row{ display:flex; align-items:flex-start; gap:9px; font-size:11.5px; line-height:1.4; color:var(--ink); background:#fff; border:1px solid var(--gray-200); border-radius:8px; padding:9px 10px; }
.pllb__check-icon{ width:16px; height:16px; flex-shrink:0; margin-top:1px; color:var(--green); }
.pllb__check-icon svg{ width:100%; height:100%; }

@media (max-width:900px){
  .pllb__row{ grid-template-columns:1fr; }
}

/* ---------- Need help + What happens next ---------- */
.plls{ padding:8px 0 48px; background:var(--bg-tint); }
.plls__row{ display:grid; grid-template-columns:1.2fr 1fr; gap:18px; align-items:start; }
.plls__card{ background:#fff; border:1px solid var(--gray-200); border-radius:var(--radius-md); padding:18px; }
.plls__heading{ font-size:13.5px; font-weight:800; color:var(--ink); margin-bottom:4px; }
.plls__sub{ font-size:11.5px; color:var(--ink-soft); margin-bottom:14px; }
.plls__form{ display:flex; flex-direction:column; gap:2px; }
.plls__row2{ display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:8px; }
.plls__field{ display:flex; flex-direction:column; }
.plls__label{ font-size:11px; font-weight:700; color:var(--ink); margin-bottom:5px; }
.plls__input,.plls__select,.plls__textarea{ width:100%; padding:9px 10px; border:1px solid var(--gray-200); border-radius:7px; font-size:12.5px; color:var(--ink); font-family:inherit; }
.plls__upload{ display:flex; align-items:center; align-self:flex-start; width:fit-content; gap:8px; padding:9px 14px; border:1px dashed var(--gray-200); border-radius:7px; font-size:12px; color:var(--ink-soft); cursor:pointer; margin-top:5px; margin-bottom:8px; }
.plls__upload svg{ width:16px; height:16px; flex-shrink:0; }
.plls__submit{ margin-top:6px; padding:11px; border:none; border-radius:8px; background:var(--gold); color:var(--navy-950); font-size:12.5px; font-weight:700; display:flex; align-items:center; justify-content:center; gap:8px; cursor:pointer; }
.plls__submit svg{ width:14px; height:14px; }
.plls__msg{ font-size:12px; margin-top:10px; display:none; }
.plls__tl-item{ display:flex; gap:12px; position:relative; padding-bottom:20px; }
.plls__tl-item::before{ content:""; position:absolute; left:11px; top:24px; bottom:-4px; width:1px; background:var(--gray-200); }
.plls__tl-item--final::before{ display:none; }
.plls__tl-dot{ flex-shrink:0; width:23px; height:23px; padding:5px; box-sizing:border-box; border-radius:50%; border:1.5px solid var(--blue-ring); color:var(--blue-ring); background:#fff; }
.plls__tl-dot svg{ width:100%; height:100%; }
.plls__tl-item strong{ display:block; font-size:12.5px; color:var(--ink); margin-bottom:2px; }
.plls__tl-item p{ font-size:11.5px; color:var(--ink-soft); line-height:1.4; }

@media (max-width:900px){
  .plls__row{ grid-template-columns:1fr; }
  .plls__row2{ grid-template-columns:1fr; }
}

/* ---------- Data integrity + FAQ ---------- */
.pllf{ padding:8px 0 48px; background:#fff; }
.pllf__row{ display:grid; grid-template-columns:1fr 1.15fr; gap:18px; align-items:start; }
.pllf__heading{ font-size:13.5px; font-weight:800; color:var(--ink); margin-bottom:4px; }
.pllf__sub{ font-size:11.5px; color:var(--ink-soft); margin-bottom:12px; }
.pllf__table-wrap{ border:1px solid var(--gray-200); border-radius:var(--radius-md); overflow:hidden; }
.pllf__table{ width:100%; border-collapse:collapse; font-size:10px; }
.pllf__table th,.pllf__table td{ padding:7px 8px; text-align:left; border-bottom:1px solid var(--gray-200); }
.pllf__table thead th{ background:var(--bg-tint); font-weight:800; color:var(--ink); font-size:9px; text-transform:uppercase; letter-spacing:.02em; }
.pllf__empty-body{ display:flex; flex-direction:column; align-items:center; text-align:center; padding:32px 16px; }
.pllf__empty-icon{ width:44px; height:44px; border-radius:50%; background:var(--gray-100); display:flex; align-items:center; justify-content:center; margin-bottom:12px; color:var(--gray-500); }
.pllf__empty-icon svg{ width:20px; height:20px; }
.pllf__empty-body strong{ font-size:12.5px; color:var(--ink); margin-bottom:6px; }
.pllf__empty-body p{ font-size:11px; color:var(--gray-500); line-height:1.6; max-width:340px; }
.pllf__faq-grid{ display:flex; flex-direction:column; gap:8px; }
.pllf__faq-item{ background:#fff; border:1px solid var(--gray-200); border-radius:8px; overflow:hidden; }
.pllf__faq-question{ width:100%; display:flex; align-items:center; justify-content:space-between; gap:10px; padding:12px 14px; background:none; border:none; text-align:left; font-size:12.5px; font-weight:700; color:var(--ink); cursor:pointer; }
.pllf__faq-chevron{ width:14px; height:14px; flex-shrink:0; transition:transform .18s ease; }
.pllf__faq-chevron svg{ width:100%; height:100%; }
.pllf__faq-answer{ display:none; padding:0 14px 14px; }
.pllf__faq-answer p{ font-size:12px; color:var(--ink-soft); line-height:1.6; margin:0; }

@media (max-width:900px){
  .pllf__row{ grid-template-columns:1fr; }
}

/* ---------- Closing CTA banner ---------- */
.pllz{ position:relative; overflow:hidden; background:var(--navy-950); padding:56px 24px; display:flex; align-items:center; justify-content:center; min-height:220px; }
.pllz__glow{ position:absolute; inset:0; background:radial-gradient(600px 300px at 50% 50%, rgba(63,126,232,.16), transparent 70%); pointer-events:none; }
.pllz__inner{ position:relative; z-index:2; text-align:center; max-width:520px; }
.pllz__inner h2{ color:#fff; font-size:20px; font-weight:800; margin-bottom:10px; line-height:1.3; }
.pllz__inner p{ color:#b7c2d9; font-size:13px; margin-bottom:22px; }
.pllz__buttons{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }
.pllz__btn-gold{ display:inline-flex; align-items:center; gap:8px; padding:11px 20px; border-radius:8px; background:var(--gold); color:var(--navy-950); font-size:13px; font-weight:700; }
.pllz__btn-gold svg{ width:15px; height:15px; }
.pllz__btn-outline{ display:inline-flex; align-items:center; padding:11px 20px; border-radius:8px; border:1.4px solid rgba(255,255,255,.4); color:#fff; font-size:13px; font-weight:700; }
.pllz__side-icon{ position:absolute; top:50%; transform:translateY(-50%); width:64px; height:64px; border-radius:50%; background:var(--navy-800); border:1.6px solid var(--blue-ring); box-shadow:0 0 16px rgba(63,126,232,.4); display:flex; align-items:center; justify-content:center; z-index:1; }
.pllz__side-icon svg{ width:26px; height:26px; color:#fff; }
.pllz__side-icon--left{ left:8%; }
.pllz__side-icon--right{ right:8%; }

@media (max-width:900px){
  .pllz{ padding:40px 20px; }
  .pllz__side-icon{ display:none; }
}