:root { --guardian-danger:#b4233b; --guardian-danger-deep:#8f182d; --guardian-green:#1f6a58; }
* { box-sizing:border-box; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.guardian-page { min-height:100vh; margin:0; background:radial-gradient(circle at 76% 0,rgba(72,150,124,.1),transparent 28%),var(--ui-bg); }
.guardian-shell { width:min(1160px,calc(100% - 40px)); margin:0 auto; padding:28px 0 60px; }
.guardian-appbar { min-height:58px; display:flex; align-items:center; gap:12px; }
.guardian-appbar h1,.guardian-appbar p { margin:0; }
.guardian-appbar h1 { font:900 20px/1.05 "Manrope",sans-serif; letter-spacing:-.5px; }
.guardian-appbar p { margin-top:4px; color:var(--ui-muted); font-size:11px; }
.guardian-mark { width:42px; height:42px; flex:0 0 auto; border-radius:14px; display:grid; place-items:center; color:#fff; background:linear-gradient(145deg,#1f6a58,#45a183); box-shadow:0 10px 24px rgba(31,106,88,.24); }
.guardian-mark svg { width:25px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.guardian-route-link { min-height:42px; margin-left:auto; padding:0 16px; border:1px solid var(--ui-border); border-radius:16px; display:inline-flex; align-items:center; gap:8px; color:var(--ui-text); background:var(--ui-surface-raised); text-decoration:none; font-size:12px; font-weight:800; }
.guardian-route-link svg { width:17px; fill:none; stroke:currentColor; stroke-width:2; }

.guardian-hero { position:relative; min-height:300px; margin-top:22px; padding:48px; border:1px solid rgba(255,255,255,.09); border-radius:30px; display:grid; grid-template-columns:minmax(0,1.3fr) minmax(260px,.7fr); align-items:center; overflow:hidden; color:#f2fff9; background:radial-gradient(circle at 82% 38%,rgba(89,217,174,.2),transparent 29%),linear-gradient(135deg,#09251e 0%,#104e40 58%,#17352e 100%); box-shadow:0 24px 70px rgba(11,45,36,.18); }
.guardian-hero::before { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(105deg,rgba(255,255,255,.045),transparent 42%); }
.guardian-hero-copy { position:relative; z-index:2; max-width:670px; }
.guardian-eyebrow,.guardian-kicker { display:block; color:#62caaa; font-size:10px; font-weight:900; letter-spacing:1.45px; text-transform:uppercase; }
.guardian-hero h2 { max-width:640px; margin:11px 0 13px; font:900 clamp(38px,5vw,66px)/.98 "Manrope",sans-serif; letter-spacing:-3.4px; }
.guardian-hero p { max-width:630px; margin:0; color:rgba(236,255,247,.72); font-size:16px; line-height:1.65; }
.guardian-trust-row { margin-top:27px; display:flex; flex-wrap:wrap; gap:14px 22px; color:rgba(241,255,249,.85); font-size:11px; font-weight:700; }
.guardian-trust-row span { display:flex; align-items:center; gap:7px; }
.guardian-trust-row i { width:7px; height:7px; border-radius:50%; background:#62caaa; box-shadow:0 0 0 4px rgba(98,202,170,.1); }
.guardian-hero-radar,.response-radar { position:relative; width:240px; height:240px; margin:auto; border-radius:50%; display:grid; place-items:center; }
.radar-ring { position:absolute; border:1px solid rgba(123,225,193,.22); border-radius:50%; }
.ring-one { width:96%; height:96%; }.ring-two { width:67%; height:67%; }.ring-three { width:38%; height:38%; }
.radar-sweep { position:absolute; width:48%; height:2px; left:50%; top:50%; transform-origin:left; background:linear-gradient(90deg,#7fe1c2,transparent); animation:guardian-sweep 4s linear infinite; }
.radar-sweep::after { content:""; position:absolute; width:105px; height:105px; left:0; bottom:0; background:conic-gradient(from 270deg,rgba(103,224,186,.17),transparent 25%); }
.radar-center { position:relative; z-index:2; width:64px; height:64px; border-radius:50%; display:grid; place-items:center; color:#fff; background:linear-gradient(145deg,#2c9577,#145c4b); box-shadow:0 0 0 10px rgba(70,176,142,.08),0 10px 25px rgba(0,0,0,.28); }
.radar-center svg { width:30px; fill:none; stroke:currentColor; stroke-width:1.7; }
.radar-person { position:absolute; z-index:3; width:13px; height:13px; border:3px solid #103d33; border-radius:50%; background:#8be5c8; box-shadow:0 0 13px #5cd8af; }
.radar-person.p-one { top:18%; right:24%; }.radar-person.p-two { left:11%; bottom:34%; }.radar-person.p-three { right:9%; bottom:23%; }
@keyframes guardian-sweep { to { transform:rotate(360deg); } }

.guardian-emergency-grid,.guardian-support-grid { margin-top:18px; display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.guardian-sos-card,.guardian-radar-card,.guardian-feature-card,.guardian-escape-card { border:1px solid var(--ui-border); border-radius:24px; background:var(--ui-surface-raised); box-shadow:0 15px 45px rgba(21,56,46,.07); }
.guardian-sos-card { min-height:350px; padding:28px; display:grid; grid-template-columns:1fr auto; align-items:center; gap:24px; }
.guardian-sos-card h2,.guardian-radar-card h2,.guardian-feature-card h2,.guardian-escape-card h2 { margin:7px 0; font:900 22px/1.12 "Manrope",sans-serif; letter-spacing:-.6px; }
.guardian-sos-card p,.guardian-feature-card p,.guardian-escape-card p { margin:0; color:var(--ui-muted); font-size:12px; line-height:1.6; }
.guardian-sos-button { --hold:0%; position:relative; width:154px; height:154px; padding:18px; border:0; border-radius:50%!important; display:flex; flex-direction:column; align-items:center; justify-content:center; overflow:hidden; color:#fff; background:linear-gradient(145deg,var(--guardian-danger),#e55168); box-shadow:0 0 0 10px rgba(180,35,59,.07),0 22px 38px rgba(180,35,59,.24); cursor:pointer; user-select:none; touch-action:none; }
.guardian-sos-button:focus-visible { outline:4px solid rgba(180,35,59,.24); outline-offset:5px; }
.guardian-sos-button .sos-progress { position:absolute; inset:0; border-radius:inherit; background:conic-gradient(rgba(255,255,255,.34) var(--hold),transparent 0); }
.guardian-sos-button svg,.guardian-sos-button strong,.guardian-sos-button small { position:relative; z-index:2; }
.guardian-sos-button svg { width:38px; fill:none; stroke:currentColor; stroke-width:1.75; }
.guardian-sos-button strong { margin-top:8px; font:900 15px "Manrope",sans-serif; }.guardian-sos-button small { margin-top:3px; opacity:.72; font-size:9px; }
.guardian-sos-button.is-holding { transform:scale(.97); }
.guardian-sos-button:disabled { filter:saturate(.5); opacity:.72; cursor:wait; }
.guardian-status { margin:14px 0 0!important; color:var(--ui-muted)!important; font-size:11px!important; line-height:1.45!important; }
.guardian-status[data-tone="error"] { color:#b4233b!important; }.guardian-status[data-tone="success"] { color:#1b7958!important; }

.guardian-radar-card,.guardian-feature-card { padding:22px; }
.guardian-card-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:15px; }
.guardian-icon-button { width:40px; height:40px; padding:0; border:1px solid var(--ui-border); border-radius:14px!important; display:grid; place-items:center; color:var(--ui-brand); background:var(--ui-surface-soft); cursor:pointer; }
.guardian-icon-button svg { width:19px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; }
.response-radar { width:170px; height:170px; margin:2px auto 10px; }
.response-radar .radar-ring { border-color:color-mix(in srgb,var(--ui-brand) 25%,transparent); }
.response-center { z-index:2; width:48px; height:48px; border-radius:50%; display:grid; place-items:center; color:#fff; background:linear-gradient(145deg,var(--guardian-danger),#e24c66); font-size:10px; font-weight:900; box-shadow:0 8px 20px rgba(180,35,59,.22); }
.response-puck { position:absolute; z-index:3; width:29px; height:29px; border:3px solid var(--ui-surface-raised); border-radius:50%; display:grid; place-items:center; color:#fff; background:#7f8b87; font-size:10px; font-weight:900; transform:translate(-50%,-50%); }
.response-puck.responding { background:#18855d; }.response-puck.unavailable { background:#a15831; }
.response-list { max-height:130px; overflow:auto; }
.response-list p { margin:0; color:var(--ui-muted); font-size:11px; text-align:center; }
.response-item { padding:8px 0; border-top:1px solid var(--ui-border); display:flex; justify-content:space-between; gap:10px; font-size:11px; }.response-item strong { font-weight:800; }.response-item span { color:var(--ui-muted); text-transform:capitalize; }

.guardian-action-grid { margin-top:18px; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.guardian-action-card { min-height:105px; padding:14px; border:1px solid var(--ui-border); border-radius:22px!important; display:grid; grid-template-columns:46px 1fr auto; align-items:center; gap:12px; color:var(--ui-text); background:var(--ui-surface-raised); box-shadow:0 12px 34px rgba(21,56,46,.05); text-align:left; cursor:pointer; }
.guardian-action-card:hover { border-color:color-mix(in srgb,var(--ui-brand) 44%,var(--ui-border)); transform:translateY(-2px); }
.guardian-action-card strong,.guardian-action-card small { display:block; }.guardian-action-card strong { font-size:13px; font-weight:900; }.guardian-action-card small { margin-top:4px; color:var(--ui-muted); font-size:9.5px; line-height:1.35; }
.guardian-action-icon { width:46px; height:46px; border-radius:16px; display:grid; place-items:center; }.guardian-action-icon svg { width:22px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.guardian-action-icon.coral { color:#9e3a42; background:#fde5e4; }.guardian-action-icon.mint { color:#1f6a58; background:#dcefe8; }.guardian-action-icon.blue { color:#315e80; background:#e1edf4; }.guardian-action-icon.amber { color:#8d621f; background:#f8edd7; }
.guardian-action-icon.violet { color:#6c4d89; background:#eee5f5; }
html[data-theme="dark"] .guardian-action-icon { background:color-mix(in srgb,currentColor 15%,transparent); }
.guardian-action-card .chevron { width:17px; fill:none; stroke:var(--ui-faint); stroke-width:2; }

.guardian-feature-card { min-height:260px; }.guardian-feature-card p { margin-top:12px; }.crowd-card { background:linear-gradient(145deg,var(--ui-surface-raised),color-mix(in srgb,var(--ui-brand) 8%,var(--ui-surface-raised))); }
.live-card { background:linear-gradient(145deg,var(--ui-surface-raised),color-mix(in srgb,#487cad 7%,var(--ui-surface-raised))); }
.guardian-switch { position:relative; width:48px; height:29px; flex:0 0 auto; }.guardian-switch input { position:absolute; opacity:0; }.guardian-switch span { position:absolute; inset:0; border-radius:999px; background:#b8c2be; cursor:pointer; transition:.2s; }.guardian-switch span::after { content:""; position:absolute; width:23px; height:23px; left:3px; top:3px; border-radius:50%; background:#fff; box-shadow:0 2px 7px rgba(0,0,0,.18); transition:.2s; }.guardian-switch input:checked+span { background:var(--ui-brand); }.guardian-switch input:checked+span::after { transform:translateX(19px); }
.heading-icon { width:34px; fill:none; stroke:#39759b; stroke-width:1.7; }
.guardian-field { display:grid; gap:7px; margin-top:14px; color:var(--ui-text); font-size:11px; font-weight:800; }.guardian-field input,.guardian-field select,.guardian-field textarea { width:100%; min-height:48px; padding:11px 13px; border:1px solid var(--ui-border); color:var(--ui-text); background:var(--ui-surface-soft); font:500 13px "DM Sans",sans-serif; }.guardian-field textarea { resize:vertical; }
.guardian-inline-actions { margin-top:15px; display:flex; flex-wrap:wrap; gap:9px; }.guardian-primary-button,.guardian-secondary-button { min-height:46px; padding:0 16px; border-radius:16px!important; font-size:12px; font-weight:900; cursor:pointer; }.guardian-primary-button { border:0; color:#fff; background:var(--ui-brand); }.guardian-secondary-button { border:1px solid var(--ui-border); color:var(--ui-text); background:var(--ui-surface-raised); }
.guardian-share-output { margin-top:12px; display:flex; gap:7px; }.guardian-share-output input { min-width:0; flex:1; padding:10px; border:1px solid var(--ui-border); background:var(--ui-surface-soft); }.guardian-share-output button { padding:0 14px; border:0; color:#fff; background:var(--ui-brand); font-weight:800; cursor:pointer; }

.guardian-escape-card { margin-top:18px; padding:24px; display:grid; grid-template-columns:minmax(220px,.65fr) 1.35fr; align-items:center; gap:26px; }
.escape-options { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:9px; }.escape-options a { min-height:86px; padding:11px; border:1px solid var(--ui-border); border-radius:18px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; color:var(--ui-text); background:var(--ui-surface-soft); text-decoration:none; text-align:center; font-size:10px; font-weight:850; }.escape-options a:hover { color:var(--ui-brand); border-color:var(--ui-brand); }.escape-options svg { width:24px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.guardian-disclosure { margin-top:20px; padding:18px 20px; border:1px solid var(--ui-border); border-radius:20px; display:flex; gap:14px; color:var(--ui-muted); background:var(--ui-surface-soft); }.guardian-disclosure svg { width:25px; flex:0 0 auto; fill:none; stroke:var(--ui-brand); stroke-width:1.7; }.guardian-disclosure p,.guardian-disclosure strong,.guardian-disclosure span { margin:0; display:block; }.guardian-disclosure strong { color:var(--ui-text); font-size:11px; }.guardian-disclosure span { margin-top:4px; font-size:10px; line-height:1.55; }

.guardian-panel,.vault-unlock { width:min(720px,calc(100vw - 28px)); max-height:92vh; padding:0; border:1px solid var(--ui-border); border-radius:28px; color:var(--ui-text); background:var(--ui-surface); box-shadow:0 30px 90px rgba(4,22,17,.3); }.guardian-panel::backdrop,.vault-unlock::backdrop { background:rgba(5,20,16,.55); backdrop-filter:blur(5px); }.guardian-panel-shell { margin:0; }.guardian-panel header,.vault-unlock header { position:sticky; z-index:4; top:0; padding:20px 22px; border-bottom:1px solid var(--ui-border); display:flex; align-items:center; justify-content:space-between; gap:16px; background:color-mix(in srgb,var(--ui-surface) 95%,transparent); backdrop-filter:blur(14px); }.guardian-panel h2,.vault-unlock h2 { margin:5px 0 0; font:900 23px "Manrope",sans-serif; }.panel-close,.vault-unlock header button { width:40px; height:40px; padding:0; border:1px solid var(--ui-border); border-radius:14px!important; color:var(--ui-text); background:var(--ui-surface-soft); font-size:24px; cursor:pointer; }.guardian-panel-body { padding:20px 22px 28px; max-height:calc(92vh - 84px); overflow:auto; }.guardian-panel footer { position:sticky; bottom:0; padding:13px 22px; border-top:1px solid var(--ui-border); background:var(--ui-surface); }
.guardian-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }.contact-builder { margin:18px 0 0; padding:15px; border:1px solid var(--ui-border); border-radius:18px; }.contact-builder legend { padding:0 6px; font-size:11px; font-weight:900; }.contact-entry { display:flex; gap:8px; }.contact-entry input { min-width:0; flex:1; min-height:45px; padding:10px 12px; border:1px solid var(--ui-border); background:var(--ui-surface-soft); }.contact-entry select { width:150px; padding:10px; border:1px solid var(--ui-border); background:var(--ui-surface-soft); }.contact-entry button { min-height:45px; padding:0 15px; border:0; color:#fff; background:var(--ui-brand); font-weight:850; cursor:pointer; }.contact-chips { margin-top:10px; display:flex; flex-wrap:wrap; gap:7px; }.contact-chip { padding:7px 8px 7px 11px; border-radius:999px; display:flex; align-items:center; gap:7px; color:var(--ui-brand); background:color-mix(in srgb,var(--ui-brand) 12%,transparent); font-size:10px; font-weight:800; }.contact-chip button { width:22px; height:22px; padding:0; border:0; border-radius:50%!important; color:inherit; background:transparent; cursor:pointer; }.guardian-check { margin-top:17px; display:flex; align-items:flex-start; gap:9px; color:var(--ui-muted); font-size:11px; line-height:1.45; }.guardian-check input { width:18px; height:18px; flex:0 0 auto; accent-color:var(--ui-brand); }
.circle-list,.vault-list { margin-top:16px; display:grid; gap:10px; }.circle-item,.vault-item { padding:14px; border:1px solid var(--ui-border); border-radius:18px; background:var(--ui-surface-soft); }.circle-item header,.vault-item header { position:static; padding:0; border:0; background:transparent; }.circle-item h3,.vault-item h3 { margin:0; font-size:13px; }.circle-item p,.vault-item p { margin:5px 0 0; color:var(--ui-muted); font-size:10px; }.circle-members { margin-top:9px; display:flex; flex-wrap:wrap; gap:6px; }.circle-members span { padding:5px 8px; border-radius:999px; color:var(--ui-muted); background:var(--ui-surface-raised); font-size:9px; }.circle-controls { margin-top:10px; display:flex; flex-wrap:wrap; gap:7px; }.circle-controls input,.circle-controls select { min-height:38px; min-width:140px; flex:1; padding:8px 10px; border:1px solid var(--ui-border); background:var(--ui-surface-raised); }.circle-controls button,.vault-item button { min-height:38px; padding:0 11px; border:1px solid var(--ui-border); color:var(--ui-text); background:var(--ui-surface-raised); font-size:10px; font-weight:800; cursor:pointer; }
.vault-upload { min-height:150px; padding:20px; border:1.5px dashed var(--ui-border); border-radius:20px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; color:var(--ui-text); background:var(--ui-surface-soft); cursor:pointer; }.vault-upload input { position:absolute; opacity:0; pointer-events:none; }.vault-upload svg { width:34px; fill:none; stroke:var(--ui-brand); stroke-width:1.8; }.vault-upload strong { font-size:13px; }.vault-upload span { color:var(--ui-muted); font-size:10px; }.vault-item { display:grid; grid-template-columns:1fr auto; gap:10px; align-items:center; }.vault-item .field-preview { grid-column:1/-1; display:flex; flex-wrap:wrap; gap:6px; }.field-preview span { padding:5px 8px; border-radius:9px; background:var(--ui-surface-raised); color:var(--ui-muted); font-size:9px; }
.vault-unlock { width:min(440px,calc(100vw - 28px)); }.vault-unlock form { padding:0 20px 22px; }.vault-unlock header { margin:0 -20px 14px; }.vault-unlock p { color:var(--ui-muted); font-size:11px; line-height:1.5; }
.timer-display { margin-top:16px; padding:18px; border-radius:18px; display:grid; gap:5px; background:color-mix(in srgb,var(--ui-brand) 10%,var(--ui-surface-soft)); }.timer-display strong { font-size:18px; }.timer-display span { color:var(--ui-muted); font-size:10px; }
.companion-readiness { padding:16px; border-radius:20px; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; background:linear-gradient(145deg,color-mix(in srgb,var(--ui-brand) 12%,var(--ui-surface-soft)),var(--ui-surface-soft)); }.companion-ready-item { padding:12px; border-radius:14px; background:var(--ui-surface-raised); }.companion-ready-item strong,.companion-ready-item span { display:block; }.companion-ready-item strong { font-size:16px; }.companion-ready-item span { margin-top:4px; color:var(--ui-muted); font-size:9px; }.companion-ready-item[data-ready="true"] strong { color:#18815d; }
.companion-section { margin-top:14px; padding:16px; border:1px solid var(--ui-border); border-radius:20px; background:var(--ui-surface-soft); }.companion-section h3,.companion-section p { margin:0; }.companion-section h3 { margin-top:5px; font-size:16px; }.companion-section>div>p { margin-top:5px; color:var(--ui-muted); font-size:10px; line-height:1.45; }.companion-section>.guardian-primary-button { margin-top:13px; }.pack-documents { margin-top:12px; display:flex; flex-wrap:wrap; gap:7px; }.pack-document { padding:7px 9px; border:1px solid var(--ui-border); border-radius:12px; display:flex; align-items:center; gap:7px; color:var(--ui-muted); background:var(--ui-surface-raised); font-size:9px; }.pack-document input { accent-color:var(--ui-brand); }.companion-items { margin-top:10px; display:grid; gap:8px; }.companion-item { padding:12px; border-radius:14px; display:grid; grid-template-columns:1fr auto; gap:8px; background:var(--ui-surface-raised); }.companion-item strong,.companion-item span,.companion-item a { display:block; }.companion-item strong { font-size:11px; }.companion-item span,.companion-item a { margin-top:4px; color:var(--ui-muted); font-size:9px; }.companion-item a { color:var(--ui-brand); font-weight:800; }.companion-item button { padding:0 10px; border:1px solid var(--ui-border); color:var(--ui-text); background:var(--ui-surface-soft); font-size:9px; font-weight:800; cursor:pointer; }.companion-checklist { margin-top:9px; display:grid; gap:5px; }.companion-checklist label { padding:7px 8px; border:1px solid var(--ui-border); border-radius:10px; display:flex; align-items:center; gap:7px; cursor:pointer; }.companion-checklist input { accent-color:var(--ui-brand); }.companion-checklist label span { margin:0; color:var(--ui-text); }
.circle-live-radar { margin-top:10px; padding:10px; border-radius:14px; display:grid; gap:6px; background:var(--ui-surface-raised); }.circle-live-radar a,.circle-live-radar span { color:var(--ui-muted); font-size:9px; text-decoration:none; }.circle-task-list { margin-top:9px; display:grid; gap:6px; }.circle-task { padding:8px 9px; border-radius:11px; display:flex; align-items:center; justify-content:space-between; gap:8px; background:var(--ui-surface-raised); }.circle-task span { font-size:9px; }.circle-task button { min-height:30px; padding:0 8px; }

@media (max-width:900px) { .guardian-action-grid { grid-template-columns:1fr 1fr; }.guardian-hero { padding:38px; }.guardian-hero h2 { font-size:48px; } }
@media (max-width:700px) {
  .guardian-shell { width:min(100% - 24px,620px); padding-top:14px; }
  .guardian-appbar { padding-left:48px; }.guardian-route-link { padding:0 10px; font-size:0; }.guardian-route-link svg { width:20px; }
  .guardian-hero { min-height:360px; padding:28px; grid-template-columns:1fr; }.guardian-hero h2 { font-size:43px; letter-spacing:-2.6px; }.guardian-hero-radar { position:absolute; width:180px; height:180px; right:-45px; bottom:-45px; opacity:.78; }.guardian-hero-copy { padding-bottom:50px; }
  .guardian-emergency-grid,.guardian-support-grid { grid-template-columns:1fr; }.guardian-sos-card { min-height:310px; padding:22px; }.guardian-sos-button { width:134px; height:134px; }
  .guardian-action-grid { grid-template-columns:1fr; }.guardian-action-card { min-height:88px; }
  .guardian-escape-card { grid-template-columns:1fr; }.escape-options { grid-template-columns:1fr 1fr; }
  .guardian-form-grid,.companion-readiness { grid-template-columns:1fr; }.contact-entry { flex-wrap:wrap; }.contact-entry select { width:100%; }.guardian-panel { border-radius:24px; }
}
@media (prefers-reduced-motion:reduce) { .radar-sweep { animation:none; }.guardian-action-card { transition:none; } }
