/* سبونج لايف — account, sign-in, admin and legal pages. Loaded after home.css (tokens, fonts, sea, buttons). */
body.pg{min-height:100svh}
.pg-top{display:flex;align-items:center;justify-content:space-between;gap:12px;width:min(1120px,100%);margin:0 auto;padding:18px 16px}
.pg-brand{display:inline-flex;align-items:center;gap:10px;color:var(--foam);text-decoration:none;font-weight:900;font-size:20px}
.pg-brand img{object-fit:contain;filter:drop-shadow(0 0 6px rgba(255,214,42,.5)) drop-shadow(0 2px 3px rgba(0,0,0,.45));transition:transform .25s cubic-bezier(.3,1.6,.5,1)}
.pg-brand:hover img{transform:rotate(-8deg) scale(1.08)}
.pg-brand b{color:var(--sun-soft)}
.pg-nav{display:flex;flex-wrap:wrap;gap:8px 16px}
.pg-nav a,.pg-linkbtn{color:var(--aqua);font-weight:800;text-decoration:none;background:none;border:0;padding:4px 0;font:inherit;font-weight:800;cursor:pointer}
.pg-nav a:hover,.pg-linkbtn:hover{color:#fff}
.pg-main{width:min(1120px,100%);margin:0 auto;padding:8px 16px 64px}
.pg-narrow{width:min(520px,100%);margin:0 auto}
.pg-card{position:relative;padding:clamp(20px,3.5vw,32px);border-radius:24px;background:linear-gradient(160deg,rgba(14,42,104,.72),rgba(4,16,46,.86));border:1px solid rgba(140,232,255,.4);box-shadow:0 0 0 1px rgba(56,212,255,.12),0 0 34px -10px rgba(56,212,255,.4),0 30px 60px -32px #000}
.pg-card + .pg-card{margin-top:18px}
.pg-card h1,.pg-card h2{margin:0 0 6px;font-weight:900;line-height:1.3}
.pg-card h1{font-size:clamp(26px,4vw,34px)}
.pg-card h2{font-size:21px}
.pg-sub{margin:0 0 18px;color:var(--muted);line-height:1.7}
.pg-tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:5px;margin:0 0 20px;border-radius:16px;background:rgba(2,10,34,.6);border:1px solid rgba(140,232,255,.25)}
.pg-tabs a{display:grid;place-items:center;height:44px;border-radius:12px;color:var(--muted);font-weight:800;text-decoration:none}
.pg-tabs a[aria-current="page"]{background:rgba(56,212,255,.18);color:#fff;box-shadow:inset 0 0 0 1px var(--cyan)}
.pg-form{display:grid;gap:14px}
.pg-field{display:grid;gap:6px}
.pg-field > span{font-weight:800;font-size:15px}
.pg-field input,.pg-field select,.pg-field textarea{width:100%;height:52px;padding:0 14px;border-radius:14px;border:2px solid rgba(140,232,255,.35);background:rgba(2,10,34,.75);color:var(--foam);font:600 17px/1.2 "Tajawal",system-ui,sans-serif}
.pg-field input:focus,.pg-field select:focus{outline:none;border-color:var(--sun);box-shadow:0 0 0 4px rgba(255,214,42,.18)}
.pg-field input[aria-invalid="true"]{border-color:var(--coral)}
.pg-field small{color:var(--muted);font-size:13px}
.pg-field .pg-ferr{color:var(--danger-soft);font-weight:700;font-size:14px}
.pg-btn{display:inline-grid;place-items:center;height:54px;padding:0 22px;border:0;border-radius:16px;background:var(--yellow);color:var(--ink);font:900 18px/1 "Tajawal",system-ui,sans-serif;cursor:pointer;text-decoration:none;box-shadow:0 5px 0 var(--sun-edge);transition:transform .12s var(--ease),box-shadow .12s,filter .2s}
.pg-btn:active{transform:translateY(3px);box-shadow:0 2px 0 var(--sun-edge)}
.pg-btn:disabled{cursor:not-allowed;filter:grayscale(.5) brightness(.85)}
.pg-btn:focus-visible,.pg-btn2:focus-visible{outline:3px solid #fff;outline-offset:3px}
.pg-btn2{display:inline-grid;place-items:center;height:46px;padding:0 16px;border-radius:14px;border:2px solid rgba(140,232,255,.55);background:rgba(56,212,255,.1);color:var(--foam);font:800 16px/1 "Tajawal",system-ui,sans-serif;cursor:pointer;text-decoration:none}
.pg-btn2:hover{background:rgba(56,212,255,.2)}
.pg-btn2.is-danger{border-color:rgba(255,106,138,.7);background:rgba(255,106,138,.1)}
.pg-row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.pg-msg{margin:0;padding:10px 14px;border-radius:14px;font-weight:700;line-height:1.6}
.pg-msg.is-err{background:rgba(255,106,138,.12);border:1px solid rgba(255,106,138,.55);color:#FFD0DA}
.pg-msg.is-ok{background:rgba(59,227,139,.12);border:1px solid rgba(59,227,139,.5);color:#C9FFE2}
.pg-msg.is-info{background:rgba(56,212,255,.1);border:1px solid rgba(56,212,255,.4);color:var(--foam)}
.pg-foot{margin:18px 0 0;text-align:center;color:var(--muted)}
.pg-foot a{color:var(--sun-soft);font-weight:800}

/* account page */
.pg-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px}
.pg-grid .pg-card + .pg-card{margin-top:0}
.pg-span{grid-column:1/-1}
@media (max-width:820px){.pg-grid{grid-template-columns:minmax(0,1fr)}}
.pg-who{display:flex;align-items:center;gap:16px}
.pg-avatar{display:grid;place-items:center;width:72px;height:72px;flex:0 0 auto;border-radius:22px;font-size:38px;background:radial-gradient(circle at 30% 25%,rgba(255,255,255,.25),rgba(56,212,255,.18) 50%,rgba(4,16,46,.9));box-shadow:0 0 0 2px rgba(140,232,255,.6),0 0 22px -6px var(--cyan)}
.pg-id{display:inline-flex;align-items:center;gap:8px;margin-top:6px;padding:6px 10px 6px 6px;border-radius:12px;background:rgba(2,10,34,.7);border:1px solid rgba(255,214,42,.55)}
.pg-id code{font:900 18px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.08em;color:var(--sun-soft)}
.pg-copy{height:30px;padding:0 10px;border-radius:9px;border:0;background:rgba(255,214,42,.18);color:var(--sun-soft);font:800 13px/1 "Tajawal",system-ui,sans-serif;cursor:pointer}
.pg-dl{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:10px 16px;margin:16px 0 0}
.pg-dl dt{color:var(--muted)}
.pg-dl dd{margin:0;font-weight:800;overflow-wrap:anywhere}
.pg-badge{display:inline-block;padding:3px 10px;border-radius:999px;font-size:13px;font-weight:900}
.pg-badge.is-on{background:rgba(59,227,139,.18);color:#9FF5C8}
.pg-badge.is-off{background:rgba(123,139,168,.22);color:#C8D2E4}
.pg-badge.is-warn{background:rgba(255,214,42,.18);color:var(--sun-soft)}
.pg-badge.is-bad{background:rgba(255,106,138,.18);color:var(--danger-soft)}
.pg-big{font-size:clamp(28px,5vw,40px);font-weight:900;font-variant-numeric:tabular-nums;letter-spacing:.02em}
.pg-code{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:12px 0}
.pg-code code{padding:10px 16px;border-radius:14px;border:2px dashed rgba(255,214,42,.7);background:rgba(2,10,34,.7);font:900 24px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.14em;color:var(--sun-soft)}
.pg-avatars{display:flex;flex-wrap:wrap;gap:8px}
.pg-avatars label{position:relative;cursor:pointer}
.pg-avatars input{position:absolute;opacity:0;pointer-events:none}
.pg-avatars span{display:grid;place-items:center;width:48px;height:48px;border-radius:14px;font-size:26px;background:rgba(2,10,34,.6);border:2px solid rgba(140,232,255,.25)}
.pg-avatars input:checked + span{border-color:var(--sun);box-shadow:0 0 0 3px rgba(255,214,42,.25)}
.pg-avatars input:focus-visible + span{outline:3px solid #fff;outline-offset:2px}
.pg-table{width:100%;border-collapse:collapse;font-size:15px}
.pg-table th,.pg-table td{padding:10px 8px;text-align:start;border-bottom:1px solid rgba(140,232,255,.15);vertical-align:top}
.pg-table th{color:var(--muted);font-weight:700;font-size:13px}
.pg-scroll{overflow-x:auto}
.pg-plans{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:12px}
@media (max-width:560px){.pg-plans{grid-template-columns:minmax(0,1fr)}}
.pg-plan{padding:16px;border-radius:18px;border:1px solid rgba(140,232,255,.35);background:rgba(2,10,34,.5);display:grid;gap:6px}
.pg-plan.is-amir{border:2px solid rgba(255,214,42,.8);box-shadow:0 0 26px -8px rgba(255,190,0,.6)}
.pg-plan b{font-size:18px}
.pg-plan .pg-price{font-size:26px;font-weight:900}
.pg-linked{display:grid;gap:10px;margin-top:10px}
.pg-linked div{display:flex;justify-content:space-between;gap:10px;padding:12px 14px;border-radius:14px;background:rgba(2,10,34,.5);border:1px solid rgba(140,232,255,.2)}

/* legal pages */
.pg-legal{line-height:1.95;font-size:16.5px}
.pg-legal h2{margin:26px 0 6px;font-size:20px;color:var(--sun-soft)}
.pg-legal ul{padding-inline-start:22px}
.pg-legal p,.pg-legal li{color:rgba(234,248,255,.86)}
fieldset.pg-field{border:0;padding:0;margin:0;min-width:0}
html:has(body.pg){scroll-behavior:auto}
form.pg-row{align-items:flex-end}
.pg-check{display:flex;align-items:center;gap:10px;margin:0 0 14px;font-weight:700;cursor:pointer;user-select:none}
.pg-check input{width:20px;height:20px;accent-color:var(--sun);cursor:pointer}
.pg-google{display:grid;place-items:center;min-height:44px;margin-bottom:6px}
.pg-or{display:flex;align-items:center;gap:10px;margin:8px 0 14px;color:var(--muted);font-size:14px}
.pg-or::before,.pg-or::after{content:"";flex:1;height:1px;background:rgba(140,232,255,.2)}
.pg-google iframe{color-scheme:light}
.pg-avatar-img{width:100%;height:100%;border-radius:inherit;object-fit:cover}
.pg-avatar{overflow:hidden}
/* guides */
.pg-games{display:grid;gap:4px 0;margin:8px 0 18px}
.pg-games dt{margin-top:12px;font-weight:900;font-size:18px;color:var(--sun)}
.pg-games dd{margin:0;line-height:1.85;color:rgba(234,248,255,.85)}
.pg-legal ol{padding-inline-start:22px;line-height:1.9}
/* owner tables with inline controls (economy) */
.pg-table input:not([type=checkbox]):not([type=file]),.pg-table select{min-width:96px;height:38px;padding:4px 10px;border-radius:10px;border:1px solid rgba(140,232,255,.3);background:rgba(2,10,34,.6);color:var(--foam);font:600 14px "Tajawal",system-ui,sans-serif}
.pg-table input[type=number]{width:110px}
.pg-table input[type=checkbox]{width:20px;height:20px;accent-color:#2C8BFF}
.pg-table td img{display:block;width:44px;height:44px;object-fit:contain;border-radius:10px;background:rgba(2,10,34,.6)}
.pg-table td .pg-row{flex-wrap:nowrap;gap:6px;align-items:center}
.pg-table td .pg-row input{min-width:150px}
#oddsSum.is-ok{color:#7DF0C6;font-weight:900}#oddsSum.is-err{color:#FF8FA6;font-weight:900}
/* owner panel: frame previews */
.pg-frame-demo{display:inline-flex;align-items:center;gap:8px;padding:8px 6px 4px}
.pg-frame-av{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:linear-gradient(180deg,#4FDBFF,#1E5BFF);color:#03122F;font-weight:900}