:root{
  --bg:#07060b;
  --bg2:#0c0a12;
  --card:linear-gradient(155deg,rgba(22,18,34,.92),rgba(10,9,16,.94));
  --line:rgba(255,255,255,.08);
  --line2:rgba(167,139,250,.22);
  --text:#f4f1ff;
  --muted:#9a93ab;
  --accent:#a78bfa;
  --accent2:#6366f1;
  --accent3:#22d3ee;
  --ok:#34d399;
  --danger:#fb7185;
  --radius:20px;
  --font:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--bg);color:var(--text);font-family:var(--font)}
body{overflow-x:hidden}

/* ambient */
.noise{position:fixed;inset:0;pointer-events:none;opacity:.04;z-index:0;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.fx-grid{position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.35;
  background-image:linear-gradient(rgba(167,139,250,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(167,139,250,.06) 1px,transparent 1px);
  background-size:48px 48px;mask-image:radial-gradient(ellipse at 50% 20%,#000 20%,transparent 75%)}
.fx-glow{position:fixed;width:420px;height:420px;border-radius:50%;filter:blur(90px);pointer-events:none;z-index:0;opacity:.2;animation:drift 14s ease-in-out infinite}
.fx-glow.a{background:radial-gradient(circle,#8b5cf6,#6366f1 60%,transparent);left:-120px;top:10%}
.fx-glow.b{background:radial-gradient(circle,#22d3ee,#6366f1 55%,transparent);right:-140px;top:-40px;animation-delay:-5s}
@keyframes drift{50%{transform:translate(30px,-24px) scale(1.08)}}

/* boot */
#boot{min-height:100vh;display:grid;place-items:center}
.boot-card{text-align:center;color:var(--muted)}
.boot-spinner{width:36px;height:36px;margin:0 auto 14px;border-radius:50%;border:2px solid rgba(167,139,250,.2);border-top-color:var(--accent);animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

.shell{position:relative;z-index:1;width:min(1120px,calc(100% - 28px));margin:0 auto;padding:22px 0 72px}

/* header */
.top{height:64px;display:flex;align-items:center;justify-content:space-between}
.brand{display:flex;align-items:center;gap:12px}
.logo{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(145deg,#16111f,#0b0a10);border:1px solid var(--line);box-shadow:0 0 40px rgba(139,92,246,.18)}
.logo svg{width:24px;fill:#fff}
.brand b{display:block;letter-spacing:.18em;font-size:14px}
.brand small{display:block;color:#6f687c;font-size:9px;letter-spacing:.2em;margin-top:2px}
.top-actions{display:flex;gap:8px;align-items:center}
.icon-btn,.ghost-btn{border:1px solid var(--line);background:rgba(12,10,18,.8);color:#cfc7db;border-radius:12px;cursor:pointer;transition:.2s}
.icon-btn{width:42px;height:42px;display:grid;place-items:center}
.icon-btn svg,.ghost-btn svg{width:18px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.ghost-btn{height:42px;padding:0 14px;display:inline-flex;align-items:center;gap:8px;font-weight:650;font-size:13px}
.icon-btn:hover,.ghost-btn:hover{border-color:var(--line2);color:#fff;transform:translateY(-1px)}

/* cards */
.card{border:1px solid var(--line);background:var(--card);border-radius:var(--radius);box-shadow:0 24px 80px rgba(0,0,0,.45),inset 0 1px rgba(255,255,255,.04);backdrop-filter:blur(18px)}
.login-card{max-width:620px;margin:90px auto;padding:42px}
.eyebrow{color:var(--accent);font-size:11px;letter-spacing:.22em;font-weight:800;margin-bottom:10px}
.login-card h1,.hero h1{font-size:clamp(32px,5vw,54px);line-height:1.05;margin:0 0 14px;letter-spacing:-.03em}
.login-card h1 span,.hero h1{background:linear-gradient(110deg,#fff 20%,#c4b5fd 50%,#67e8f9 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.login-card p,.hero p{color:var(--muted);line-height:1.7;margin:0 0 24px}
.input-wrap{display:flex;align-items:center;gap:10px;border:1px solid var(--line);background:#09080f;border-radius:14px;padding:6px 7px 6px 14px}
.input-wrap>svg{width:18px;stroke:#8d849b;fill:none;stroke-width:1.7}
.input-wrap input{min-width:0;flex:1;border:0;background:transparent;color:var(--text);height:40px;outline:none}

.hero{display:flex;justify-content:space-between;align-items:end;padding:48px 4px 22px;gap:16px}
.status-pill{display:inline-flex;gap:8px;align-items:center;color:#b5afc4;font-size:12px;padding:8px 12px;border-radius:999px;border:1px solid var(--line);background:rgba(12,10,18,.7)}
.status-pill i{width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 12px var(--ok);animation:pulse 1.6s infinite}
@keyframes pulse{50%{opacity:.4;transform:scale(.75)}}

/* tabs */
.tabs{display:flex;gap:8px;margin:0 0 18px;padding:6px;border-radius:16px;border:1px solid var(--line);background:rgba(10,8,16,.65);width:fit-content;max-width:100%;overflow:auto}
.tab{border:0;background:transparent;color:var(--muted);height:40px;min-height:40px;padding:0 16px;border-radius:12px;font-weight:700;font-size:13px;cursor:pointer;transition:.2s;white-space:nowrap;display:inline-flex;align-items:center;justify-content:center}
.tab:hover{color:#fff}
.tab.active{background:linear-gradient(135deg,rgba(167,139,250,.25),rgba(99,102,241,.2));color:#fff;box-shadow:inset 0 0 0 1px rgba(167,139,250,.25)}
.tab-pane{display:none}
.tab-pane.active{display:block;animation:fade .25s ease}
@keyframes fade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.card:not(.login-card){padding:22px}
.card-head{display:flex;gap:12px;align-items:center;margin-bottom:20px}
.svgbox{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(145deg,#1a1328,#100e18);border:1px solid rgba(167,139,250,.2)}
.svgbox svg{width:20px;fill:none;stroke:var(--accent);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.card h2{font-size:17px;margin:0}
.card small{color:#716b7c}
label{display:block;color:#aaa3b2;font-size:11px;margin:14px 0 7px}
input,select,textarea{width:100%;height:46px;border-radius:12px;border:1px solid var(--line);background:#09080f;color:var(--text);padding:0 13px;outline:none;transition:.2s}
input:focus,select:focus,textarea:focus{border-color:rgba(167,139,250,.55);box-shadow:0 0 0 3px rgba(139,92,246,.15)}
.two{display:grid;grid-template-columns:1fr 120px;gap:8px;margin-top:8px}
.secret{display:flex;border:1px solid var(--line);background:#09080f;border-radius:12px;overflow:hidden}
.secret input{border:0;border-radius:0}
.secret button{width:48px;background:none;border:0;color:#8e8797;cursor:pointer}
.secret svg{width:18px;fill:none;stroke:currentColor;stroke-width:1.6}

/* Unified buttons — same height everywhere */
button, .primary, .secondary, a.primary, a.secondary, .choice, .tab {
  box-sizing: border-box;
  font-family: inherit;
  line-height: 1.2;
}
.primary,.secondary,a.primary,a.secondary{
  border:1px solid transparent;
  height:44px;min-height:44px;max-height:44px;
  border-radius:12px;padding:0 16px;
  color:#fff;font-weight:700;font-size:13px;
  cursor:pointer;transition:.2s;
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  text-decoration:none;white-space:nowrap;vertical-align:middle;
}
.primary{background:linear-gradient(135deg,#a78bfa,#6366f1 55%,#22d3ee);box-shadow:0 10px 28px rgba(99,102,241,.25)}
.primary:hover{transform:translateY(-1px);filter:brightness(1.06)}
.primary:disabled,.secondary:disabled{opacity:.55;cursor:not-allowed;transform:none;filter:none}
.secondary{background:rgba(17,15,26,.9);border-color:var(--line);color:#cfc7db}
.secondary:hover{border-color:var(--line2);color:#fff}
.secondary svg,.primary svg{width:16px;height:16px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.7}
.full{width:100%;margin-top:10px}
.big{height:44px!important;min-height:44px!important;max-height:44px!important;margin-top:14px;font-size:14px}

.choice-row{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:6px}
.choice{
  height:44px;min-height:44px;max-height:44px;
  border-radius:12px;border:1px solid var(--line);background:#0b0a12;
  color:var(--muted);font-weight:700;font-size:13px;cursor:pointer;transition:.2s;
  display:inline-flex;align-items:center;justify-content:center;padding:0 12px;
}
.choice:hover{color:#fff}
.choice.active{color:#fff;border-color:rgba(167,139,250,.45);background:linear-gradient(135deg,rgba(167,139,250,.18),rgba(34,211,238,.08));box-shadow:inset 0 0 0 1px rgba(167,139,250,.15)}

.repo-open-row{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center}
.open-repo{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 12px;text-decoration:none;white-space:nowrap}
.open-repo.disabled{opacity:.4;pointer-events:none}

/* dropzone */
.dropzone{border:1.5px dashed rgba(167,139,250,.3);border-radius:16px;padding:28px 16px;text-align:center;background:rgba(12,10,20,.5);transition:.2s}
.dropzone.over{border-color:var(--accent3);background:rgba(34,211,238,.06);box-shadow:0 0 0 3px rgba(34,211,238,.1)}
.dz-icon{font-size:28px;margin-bottom:8px;opacity:.8}
.dropzone b{display:block;margin-bottom:4px}
.dropzone small{color:var(--muted)}
.dz-actions{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:14px}
.queue-head{display:flex;justify-content:space-between;align-items:center;margin:14px 0 8px;color:var(--muted);font-size:12px}
.linkish{background:none;border:0;color:var(--accent);cursor:pointer;font-weight:700}
.queue-list{max-height:220px;overflow:auto;border:1px solid var(--line);border-radius:14px;background:#08070d}
.queue-item{display:flex;align-items:center;gap:10px;padding:10px 12px;border-bottom:1px solid rgba(255,255,255,.04)}
.queue-item:last-child{border-bottom:0}
.progress-wrap{margin-top:12px}
.progress-bar{height:8px;border-radius:999px;background:#16131f;overflow:hidden}
.progress-bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--accent),var(--accent3));transition:width .2s}
.progress-wrap small{display:block;margin-top:6px;color:var(--muted);font-size:11px}

/* files */
.files-actions{margin:4px 0 12px}
.danger{border:1px solid rgba(251,113,133,.35);background:rgba(251,113,133,.08);color:#fda4af;border-radius:12px;padding:10px 14px;font-weight:700;cursor:pointer}
.danger:hover{background:rgba(251,113,133,.14)}
.repo-path{font-family:var(--mono);font-size:12px;color:var(--muted);padding:6px 2px 10px}
.file-list{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:15px;overflow:hidden;background:#08070d}
.file-row{display:flex;align-items:center;gap:8px;padding:11px 12px;border-bottom:1px solid rgba(255,255,255,.04)}
.file-row:last-child{border-bottom:0}
.file-row:hover{background:rgba(167,139,250,.05)}
.file-open{display:flex;align-items:center;gap:10px;flex:1;border:0;background:transparent;color:inherit;text-align:left;padding:0;cursor:pointer;min-width:0}
.file-open:hover .file-main b{text-decoration:underline}
.file-icon{width:22px;text-align:center}
.file-main{min-width:0;flex:1}
.file-main b{display:block;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.file-main small{display:block;color:#666171;margin-top:2px;font-size:10px}
.file-tag{font-size:9px;text-transform:uppercase;letter-spacing:.08em;color:#8d7ca7;border:1px solid #30263e;border-radius:999px;padding:3px 7px}
.delete-file{border:1px solid rgba(255,255,255,.06);background:transparent;color:#ff8794;width:30px;height:30px;border-radius:9px;cursor:pointer;font-size:18px;line-height:1}
.delete-file:hover{background:rgba(251,113,133,.12)}
.back-row{border:0;background:transparent;color:inherit;width:100%;cursor:pointer;text-align:left}
.empty{padding:22px;text-align:center;color:#6f6878;font-size:12px}
.privacy-note,.hint{margin-top:12px;color:#716b78;font-size:11px;line-height:1.55}
.hint{margin:12px 0}
code{color:#c4b5fd;font-family:var(--mono);font-size:.92em}

.tip{display:flex;gap:9px;align-items:flex-start;color:#77717f;font-size:11px;line-height:1.6;margin-top:12px}
.tip svg{width:15px;min-width:15px;fill:none;stroke:#8d78b0;stroke-width:1.5}
.result{min-height:20px;margin-top:12px;font-size:12px;color:#9e98a8}
.result.ok,.msg.ok{color:var(--ok)}
.result.err,.msg.err{color:var(--danger)}
.msg{font-size:12px;margin-top:12px;min-height:18px}

.toast{position:fixed;right:18px;bottom:18px;z-index:100;padding:12px 16px;border:1px solid var(--line);background:rgba(16,14,24,.95);color:#eee;border-radius:12px;box-shadow:0 16px 40px rgba(0,0,0,.5);transform:translateY(16px);opacity:0;pointer-events:none;transition:.25s;max-width:min(360px,calc(100% - 24px))}
.toast.show{transform:none;opacity:1}
.toast.err{border-color:rgba(251,113,133,.35)}

/* modal */
.modal{position:fixed;inset:0;z-index:90;display:flex;align-items:center;justify-content:center;padding:16px}
.modal.hidden{display:none!important}
.modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.62);backdrop-filter:blur(8px)}
.modal-panel{position:relative;width:min(920px,100%);max-height:min(86vh,900px);display:flex;flex-direction:column;border:1px solid rgba(167,139,250,.2);border-radius:20px;background:linear-gradient(160deg,#14101c,#0a0910);box-shadow:0 30px 90px rgba(0,0,0,.65);overflow:hidden}
.settings-panel{width:min(520px,100%);max-height:none}
.modal-head{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;padding:18px 20px;border-bottom:1px solid var(--line)}
.modal-title-wrap h2{margin:4px 0 6px;font-size:18px;word-break:break-all}
.modal-title-wrap small{color:#7d7688;font-size:11px}
.modal-actions{display:flex;gap:8px;align-items:center;flex-shrink:0}
.modal-actions .secondary{height:40px;min-height:40px;padding:0 12px;font-size:12px;text-decoration:none}
.modal-body{padding:18px 20px 22px}
.file-content{margin:0;padding:18px 20px;overflow:auto;flex:1;font-family:var(--mono);font-size:12px;line-height:1.55;color:#e8e4f2;white-space:pre-wrap;word-break:break-word;background:#07060a}
.modal-actions .icon-btn svg,.modal-head .icon-btn svg{width:16px;stroke:#cfc7db;fill:none;stroke-width:1.8;stroke-linecap:round}

.hidden{display:none!important}

@media(max-width:820px){
  .grid-2{grid-template-columns:1fr}
  .hero{flex-direction:column;align-items:flex-start;padding-top:36px}
  .login-card{margin-top:48px;padding:28px}
  .input-wrap{flex-wrap:wrap}
  .input-wrap .primary{width:100%}
  .tabs{width:100%}
}
@media(max-width:560px){
  .repo-open-row{grid-template-columns:1fr}
  .open-repo{width:100%}
  .two{grid-template-columns:1fr}
  .modal-head{flex-direction:column}
}

a.ghost-btn{text-decoration:none}
.login-docs{margin-top:18px;text-align:center}
.login-docs a{color:var(--muted);font-size:13px;font-weight:600}
.login-docs a:hover{color:var(--accent)}

.logo-img{
  width:42px;height:42px;object-fit:contain;border-radius:12px;
  background:#fff;padding:3px;border:1px solid rgba(255,255,255,.1);
  box-shadow:0 0 28px rgba(139,92,246,.18);
}
.side-brand .logo-img{width:40px;height:40px}

/* boot screen (no inline styles) */
#boot{min-height:100vh;display:grid;place-items:center;position:relative;z-index:1}
.boot-card{text-align:center;color:var(--muted,#9a93ab)}
.boot-spinner{width:36px;height:36px;margin:0 auto 14px;border-radius:50%;border:2px solid rgba(167,139,250,.2);border-top-color:var(--accent,#a78bfa);animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.boot-error{color:#fb7185;max-width:320px;margin:0 auto}
.boot-reload{margin-top:12px}
.boot-reload a{color:var(--accent,#a78bfa)}

/* replace element.style usage */
body.modal-open{overflow:hidden}
.progress-bar > i.p0{width:0%}
.progress-bar > i.p10{width:10%}
.progress-bar > i.p20{width:20%}
.progress-bar > i.p30{width:30%}
.progress-bar > i.p40{width:40%}
.progress-bar > i.p50{width:50%}
.progress-bar > i.p60{width:60%}
.progress-bar > i.p70{width:70%}
.progress-bar > i.p80{width:80%}
.progress-bar > i.p90{width:90%}
.progress-bar > i.p100{width:100%}
.token-card-wrap{max-width:560px}

.token-layout{align-items:start}
.token-list{display:flex;flex-direction:column;gap:0;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#08070d;max-height:520px;overflow-y:auto}
.token-row{display:flex;gap:10px;align-items:flex-start;padding:12px;border-bottom:1px solid rgba(255,255,255,.05)}
.token-row:last-child{border-bottom:0}
.token-main{min-width:0;flex:1}
.token-main b{display:block;font-size:13px}
.token-main b.ok{color:#86efac}
.token-main b.bad{color:#fda4af}
.token-main small.mono{display:block;font-family:var(--mono,ui-monospace,monospace);font-size:11px;color:#8b8499;margin-top:4px;word-break:break-all}
.token-btns{display:flex;flex-wrap:wrap;gap:6px;flex-shrink:0}
.secondary.sm,.danger.sm,.primary.sm{height:36px;min-height:36px;max-height:36px;padding:0 12px;font-size:12px;border-radius:10px;width:auto;margin:0}
.token-actions{display:grid;gap:8px;margin-top:12px}

/* landing before login */
.landing{margin:18px 0 40px}
.land-hero{padding:28px 8px 10px;max-width:720px}
.land-hero h1{font-size:clamp(30px,5vw,48px);line-height:1.08;margin:0 0 12px;letter-spacing:-.03em}
.land-hero h1 span{background:linear-gradient(110deg,#fff,#c4b5fd 45%,#67e8f9);-webkit-background-clip:text;background-clip:text;color:transparent}
.land-hero .lead{color:var(--muted);margin:0;line-height:1.7}
.land-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:14px;margin-top:18px}
.land-card{padding:20px}
.land-steps{margin:0;padding-left:18px;color:var(--muted)}
.land-steps li{margin:8px 0}
.land-steps b{color:#efeaff}
.land-links{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.land-links .secondary{height:40px;min-height:40px;padding:0 14px;font-size:12px;text-decoration:none}
.login-pane{grid-column:1/-1;max-width:560px}
.device-box{display:flex;flex-direction:column;gap:14px}
.batt-wrap{display:flex;gap:12px;align-items:center}
.batt-shell{width:54px;height:26px;border:2px solid #8b8499;border-radius:6px;padding:2px;position:relative;flex-shrink:0}
.batt-shell:after{content:"";position:absolute;right:-7px;top:6px;width:5px;height:10px;background:#8b8499;border-radius:0 2px 2px 0}
.batt-fill{display:block;height:100%;width:0;border-radius:3px;background:linear-gradient(90deg,#34d399,#a78bfa);transition:width .3s}
.batt-fill.p0{width:4%}
.batt-fill.p10{width:10%}
.batt-fill.p20{width:20%}
.batt-fill.p30{width:30%}
.batt-fill.p40{width:40%}
.batt-fill.p50{width:50%}
.batt-fill.p60{width:60%}
.batt-fill.p70{width:70%}
.batt-fill.p80{width:80%}
.batt-fill.p90{width:90%}
.batt-fill.p100{width:100%}
.batt-wrap b,.loc-box b{display:block;font-size:13px}
.batt-wrap small,.loc-box small{display:block;color:var(--muted);font-size:11px;margin-top:3px;line-height:1.45}
.map-wrap{border-radius:14px;overflow:hidden;border:1px solid var(--line);height:220px;background:#0b0a12}
.map-wrap iframe{width:100%;height:100%;border:0;display:block}
@media(max-width:820px){
  .land-grid{grid-template-columns:1fr}
  .login-pane{grid-column:auto;max-width:none}
}
.map-wrap{display:flex;flex-direction:column}
.map-open{margin:10px 12px 12px;height:36px;text-decoration:none;font-size:12px}
.map-wrap iframe{height:220px}

.tg-preview{display:flex;gap:12px;align-items:center;padding:12px;border-radius:14px;border:1px solid var(--line);background:rgba(14,12,20,.7);margin-bottom:12px}
.tg-preview img{width:56px;height:56px;border-radius:50%;object-fit:cover;background:#1a1525}
.tg-preview b{display:block;font-size:14px}
.tg-preview small{display:block;color:var(--muted);font-size:12px;margin-top:2px}
.tg-role{color:var(--cyan)!important;font-weight:700}
body.role-member #tab-token .repo-open-row,
body.role-member label[for="tokenRepo"]{ }
body.role-member .owner-only{display:none!important}


/* ── Map consent modal ─────────────────────────────────────── */
.consent-modal{position:fixed;inset:0;z-index:120;display:flex;align-items:center;justify-content:center;padding:14px}
.consent-modal.hidden{display:none!important}
.consent-backdrop{position:absolute;inset:0;background:rgba(4,3,10,.78);backdrop-filter:blur(10px)}
.consent-panel{
  position:relative;width:min(480px,100%);max-height:min(92vh,640px);
  display:flex;flex-direction:column;
  border:1px solid rgba(167,139,250,.28);border-radius:22px;
  background:linear-gradient(165deg,#1a1428 0%,#0c0a14 55%,#09080f 100%);
  box-shadow:0 28px 80px rgba(0,0,0,.65),0 0 0 1px rgba(255,255,255,.03) inset;
  overflow:hidden;
}
.consent-head{padding:20px 20px 12px;border-bottom:1px solid rgba(255,255,255,.06)}
.consent-badge{
  display:inline-flex;align-items:center;gap:6px;
  font-size:11px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;
  color:#c4b5fd;background:rgba(139,92,246,.15);border:1px solid rgba(167,139,250,.25);
  padding:5px 10px;border-radius:999px;margin-bottom:10px;
}
.consent-head h2{margin:0 0 6px;font-size:1.25rem;color:#f5f3ff}
.consent-head p{margin:0;font-size:13px;color:#9b93a8;line-height:1.45}
.consent-scroll{
  flex:1;overflow-y:auto;padding:16px 20px;
  scroll-behavior:smooth;min-height:180px;max-height:42vh;
  border-bottom:1px solid rgba(255,255,255,.06);
}
.consent-scroll::-webkit-scrollbar{width:6px}
.consent-scroll::-webkit-scrollbar-thumb{background:rgba(167,139,250,.35);border-radius:8px}
.consent-scroll h3{margin:0 0 10px;font-size:14px;color:#ddd6fe}
.consent-scroll p,.consent-scroll li{font-size:13px;line-height:1.65;color:#b8b0c5;margin:0 0 10px}
.consent-scroll ul{margin:0 0 12px;padding-left:18px}
.consent-scroll .consent-end{
  margin-top:18px;padding:12px 14px;border-radius:14px;
  background:rgba(52,211,153,.08);border:1px solid rgba(52,211,153,.22);
  color:#a7f3d0;font-size:12.5px;font-weight:600;
}
.consent-foot{
  display:flex;flex-wrap:wrap;gap:10px;padding:14px 16px 18px;
  align-items:center;justify-content:space-between;
}
.consent-foot .hint-scroll{font-size:11px;color:#7c748c;flex:1 1 100%;margin:0 0 4px}
.consent-foot .row-btns{display:flex;gap:8px;width:100%;flex-wrap:wrap}
.consent-foot button{flex:1;min-width:110px;height:44px;border-radius:12px;font-weight:600}
.consent-foot button:disabled{
  opacity:.38;cursor:not-allowed;filter:grayscale(.35);
}
.consent-foot .btn-scroll{
  background:rgba(139,92,246,.18);border:1px solid rgba(167,139,250,.35);color:#ddd6fe;
}
.consent-foot .btn-agree{
  background:linear-gradient(135deg,#7c3aed,#5b21b6);border:none;color:#fff;
}
.consent-foot .btn-agree:not(:disabled):hover{filter:brightness(1.08)}
.consent-foot .btn-cancel{
  background:transparent;border:1px solid rgba(251,113,133,.35);color:#fda4af;
}

/* ── User profile card (hero + profile tab) ───────────────── */
.hero-with-profile{
  display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:16px;
}
.hero-right{display:flex;flex-direction:column;align-items:flex-end;gap:10px}
.user-profile-card{
  display:flex;gap:14px;align-items:center;
  min-width:min(320px,100%);
  padding:14px 16px;
  border-radius:18px;
  border:1px solid rgba(99,140,255,.35);
  background:linear-gradient(145deg,rgba(30,42,80,.55) 0%,rgba(14,18,36,.85) 100%);
  box-shadow:0 8px 28px rgba(0,0,0,.35),0 0 0 1px rgba(255,255,255,.04) inset;
}
.user-profile-card.profile-edit-preview{min-width:0;width:100%;margin-bottom:12px}
.up-photo{
  width:64px;height:64px;border-radius:50%;object-fit:cover;
  background:#1a2035;border:2px solid rgba(120,160,255,.45);
  flex-shrink:0;
}
.up-body{min-width:0;flex:1}
.up-name-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:6px}
.up-name-row b{font-size:16px;font-weight:700;color:#f4f6ff;letter-spacing:.01em}
.up-role-badge{
  display:inline-flex;align-items:center;
  font-size:11px;font-weight:600;line-height:1.2;
  padding:4px 10px;border-radius:999px;
  color:#dbe7ff;
  background:linear-gradient(135deg,#3b6ef5 0%,#2a4fd4 100%);
  border:1px solid rgba(150,180,255,.35);
  box-shadow:0 2px 8px rgba(40,80,220,.35);
  white-space:nowrap;
}
.up-meta-row{display:flex;align-items:baseline;gap:10px;margin-top:3px;font-size:12px}
.up-label{color:rgba(180,190,220,.65);font-weight:600;min-width:42px;letter-spacing:.04em;font-size:11px}
.up-value{color:#c8d4ff;font-weight:600;word-break:break-all}
.up-bio{margin-top:8px;font-size:12px;color:var(--muted);line-height:1.45}
.grant-checks{display:flex;flex-direction:column;gap:8px;margin:8px 0 12px;max-height:220px;overflow:auto}
.grant-checks label{display:flex;align-items:center;gap:8px;font-size:13px;cursor:pointer}
.check-row{display:flex!important;align-items:center;gap:8px;margin:10px 0;font-size:13px}
#pfBioInput{width:100%;resize:vertical;min-height:72px;border-radius:12px;border:1px solid var(--line);background:rgba(10,10,18,.6);color:inherit;padding:10px 12px;font:inherit}
@media(max-width:720px){
  .hero-right{align-items:stretch;width:100%}
  .user-profile-card{width:100%}
}