/* VOLT v9 · platform: legal pages, consent line, my data, admin errors / usage / legal editor */
@keyframes vpUp{from{opacity:0;transform:translateY(18px)}}
@keyframes vpPop{from{opacity:0;transform:scale(.6)}}
@keyframes vpGrow{from{width:0}}
@keyframes vpRise{from{height:0}}
@keyframes vpReveal{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}

/* ---------- legal pages ---------- */
.lg-page{width:min(100% - 32px,860px);margin:28px auto 56px;display:grid;gap:18px;animation:vpUp .6s cubic-bezier(.2,.8,.2,1) both}
.lg-hero{position:relative;overflow:hidden;padding:22px 26px 24px;border-radius:26px;border:1px solid var(--v8-line,#ffffff1a);background:radial-gradient(120% 160% at 100% 0%,#FF6B3D2e,transparent 55%),radial-gradient(80% 120% at 0% 100%,#7CC7FF1a,transparent 60%),var(--v8-card,#17191D)}
.lg-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}
.lg-back{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:0 14px 0 12px;border-radius:999px;border:1px solid var(--v8-line2,#ffffff26);background:#ffffff0a;color:var(--v8-t1,#fff);font:inherit;font-size:13px;font-weight:700;cursor:pointer;transition:background .25s,transform .25s}
.lg-back .icon{width:15px;height:15px}
.lg-back:hover{background:#ffffff16;transform:translateX(3px)}
.lg-mark{display:inline-flex;align-items:center;gap:6px;font-weight:900;letter-spacing:.06em;color:var(--v8-t1,#fff)}
.lg-mark i{display:grid;place-items:center;width:30px;height:30px;border-radius:10px;background:linear-gradient(135deg,#FFB37A,#FF6B3D);color:#1A0B05;font-style:normal;box-shadow:0 0 22px #FF6B3D66}
.lg-kicker{display:block;font-size:11px;font-weight:800;letter-spacing:.18em;color:var(--v8-acc2,#FF9466)}
.lg-hero h1{margin:6px 0 4px;font-size:clamp(26px,4vw,38px);font-weight:900;line-height:1.3}
.lg-date{margin:0;font-size:13px;color:var(--v8-t3,#9aa0aa)}
.lg-toc{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.lg-toc button{min-height:34px;padding:0 14px;border-radius:999px;border:1px solid var(--v8-line2,#ffffff26);background:#ffffff08;color:var(--v8-t2,#c9cdd4);font:inherit;font-size:12.5px;font-weight:700;cursor:pointer;animation:vpPop .45s cubic-bezier(.3,1.6,.5,1) both;animation-delay:calc(200ms + var(--i,0) * 40ms);transition:background .25s,color .25s,border-color .25s}
.lg-toc button:hover{background:#FF6B3D1f;border-color:#FF6B3D66;color:var(--v8-t1,#fff)}
.lg-body{padding:6px 28px 26px;border-radius:24px;border:1px solid var(--v8-line,#ffffff1a);background:var(--v8-card,#17191D);line-height:2;font-size:15px;color:var(--v8-t2,#c9cdd4)}
.lg-body h2{position:relative;margin:26px 0 8px;padding-inline-start:16px;font-size:18px;font-weight:900;color:var(--v8-t1,#fff);scroll-margin-top:90px;outline:none}
.lg-body h2::before{content:"";position:absolute;inset-inline-start:0;top:.35em;width:5px;height:1.1em;border-radius:3px;background:linear-gradient(#FFB37A,#FF6B3D)}
.lg-body p{margin:10px 0}
.lg-body ul{margin:8px 0;padding:0;list-style:none;display:grid;gap:6px}
.lg-body li{position:relative;padding:8px 34px 8px 12px;border-radius:12px;background:#ffffff05}
.lg-body li::before{content:"";position:absolute;right:14px;top:1.15em;width:8px;height:8px;border-radius:50%;background:var(--v8-acc,#FF6B3D);box-shadow:0 0 0 4px #FF6B3D22}
.lg-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:0 6px;font-size:12.5px;color:var(--v8-t3,#9aa0aa)}
.lg-foot a{display:inline-flex;align-items:center;gap:6px;color:var(--v8-acc2,#FF9466);font-weight:800;text-decoration:none}
.lg-foot a .icon{width:16px;height:16px}
.lg-consent{display:flex;align-items:flex-start;gap:8px;margin:16px 0 0;padding:10px 12px;border-radius:12px;background:#ffffff08;font-size:12px;line-height:1.9;color:var(--v8-t3,#9aa0aa)}
.lg-consent .icon{flex:none;width:15px;height:15px;margin-top:3px;color:var(--v8-acc2,#FF9466)}
.lg-consent a{color:var(--v8-acc2,#FF9466);font-weight:800;text-decoration:none;border-bottom:1px dashed #FF946680}
@media(max-width:600px){.lg-page{margin-top:14px}.lg-hero{padding:16px 16px 18px;border-radius:22px}.lg-body{padding:2px 16px 18px;border-radius:20px;font-size:14.5px}.lg-body h2{font-size:16.5px}.lg-toc button{min-height:32px;padding:0 12px;font-size:12px}}

/* ---------- my data ---------- */
.pv-page{display:grid;gap:18px;animation:vpUp .6s cubic-bezier(.2,.8,.2,1) both}
.pv-hero{display:flex;align-items:center;gap:16px;padding:22px;border-radius:26px;border:1px solid var(--v8-line);background:radial-gradient(110% 150% at 100% 0%,#36CFA024,transparent 55%),var(--v8-card)}
.pv-hero h1{margin:0;font-size:clamp(22px,3vw,30px);font-weight:900;line-height:1.35}
.pv-hero p{margin:6px 0 0;font-size:13.5px;line-height:1.8;color:var(--v8-t2)}
.pv-hero-ic{display:grid;place-items:center;flex:0 0 58px;width:58px;height:58px;border-radius:18px;background:linear-gradient(135deg,#C0F7E6,#36CFA0);color:#062a1f;box-shadow:0 16px 30px -16px #36CFA0}
.pv-hero-ic .icon{width:28px;height:28px}
.pv-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);grid-template-areas:"who copy" "who danger";gap:18px;align-items:start}
.pv-card{position:relative;padding:22px;border-radius:24px;border:1px solid var(--v8-line);background:var(--v8-card);animation:vpUp .6s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(120ms + var(--i,0) * 90ms)}
.pv-who{grid-area:who}.pv-copy{grid-area:copy}.pv-danger{grid-area:danger}
.pv-card h2{display:flex;align-items:center;gap:10px;margin:0 0 12px;font-size:17px;font-weight:900}
.pv-card h2 .icon{width:20px;height:20px;color:var(--v8-acc2)}
.pv-card p{margin:0 0 14px;font-size:13px;line-height:1.9;color:var(--v8-t2)}
.pv-who ul{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.pv-who li{display:flex;align-items:center;gap:12px;padding:12px;border-radius:16px;border:1px solid var(--v8-line);background:#ffffff05}
.pv-who li b{display:block;font-size:13.5px;line-height:1.6}
.pv-who li small{font-size:12px;color:var(--v8-t3)}
.pv-li-ic{display:grid;place-items:center;flex:0 0 38px;width:38px;height:38px;border-radius:12px;background:#ffffff0d;color:var(--v8-t2)}
.pv-li-ic .icon{width:18px;height:18px}
.pv-links{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.pv-links a{display:inline-flex;align-items:center;gap:6px;min-height:38px;padding:0 14px;border-radius:999px;border:1px solid var(--v8-line2);color:var(--v8-t1);font-size:12.5px;font-weight:700;text-decoration:none;transition:background .25s,border-color .25s}
.pv-links a .icon{width:15px;height:15px;color:var(--v8-acc2)}
.pv-links a:hover{background:#ffffff0d;border-color:#FF946680}
.pv-copy .btn,.pv-danger .btn{gap:8px}
.pv-copy .btn .icon,.pv-danger .btn .icon{width:17px;height:17px}
.pv-note{display:block;margin-top:8px;font-size:11.5px;color:var(--v8-t3)}
.pv-danger{border-color:#FF8A7A40;background:linear-gradient(160deg,#FF6F5E14,transparent 60%),var(--v8-card)}
.pv-danger h2 .icon{color:var(--v8-bad)}
.pv-warn{display:flex;gap:10px;align-items:flex-start;margin-bottom:12px;padding:12px;border-radius:14px;background:#FF6F5E14;border:1px solid #FF8A7A40}
.pv-warn .icon{flex:none;width:20px;height:20px;color:var(--v8-bad)}
.pv-warn p{margin:0;font-size:13px;line-height:1.9;color:var(--v8-t1)}
.pv-delete-form .btn:not(.secondary){background:linear-gradient(135deg,#FF8A7A,#FF5A47)!important;color:#1A0B05!important}
@media(max-width:900px){.pv-grid{grid-template-columns:minmax(0,1fr);grid-template-areas:"who" "copy" "danger"}}
@media(max-width:600px){.pv-hero{padding:16px;gap:12px;border-radius:22px}.pv-hero-ic{flex-basis:48px;width:48px;height:48px;border-radius:15px}.pv-card{padding:16px;border-radius:20px}}

/* ---------- admin · errors ---------- */
.er-msg{display:block;font-size:13px;line-height:1.6;overflow-wrap:anywhere}
.er-where{display:block;margin-top:2px;font-size:11.5px;color:var(--v8-t3);overflow-wrap:anywhere}
.er-count{font-size:15px}
.er-help{display:flex;align-items:flex-start;gap:10px;margin:0 0 14px;padding:12px 14px;border-radius:16px;border:1px dashed #7CC7FF55;background:#7CC7FF0d;font-size:12.5px;line-height:1.9;color:var(--v8-t2)}
.er-help .icon{flex:none;width:17px;height:17px;margin-top:3px;color:var(--v8-sky)}
.er-help b{overflow-wrap:anywhere}
.er-detail dl{display:grid;grid-template-columns:auto minmax(0,1fr);gap:6px 14px;margin:12px 0;font-size:13px}
.er-detail dt{color:var(--v8-t3)}
.er-detail dd{margin:0;overflow-wrap:anywhere}
.er-ua{font-size:11.5px;color:var(--v8-t2)}
.er-detail pre{max-height:260px;overflow:auto;margin:0;padding:12px;border-radius:12px;background:#0b0c0e;font-size:11.5px;line-height:1.6;white-space:pre-wrap;overflow-wrap:anywhere;text-align:left}

/* ---------- admin · legal editor ---------- */
.lg-edits{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.lg-edit header{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.lg-edit h2{margin:0;font-size:17px}
.lg-edit textarea{min-height:420px;font-size:13.5px;line-height:1.9}
@media(max-width:1100px){.lg-edits{grid-template-columns:minmax(0,1fr)}}

/* ---------- admin · usage ---------- */
.uc-filters{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 14px}
.uc-filters button{min-height:38px;padding:0 16px;border-radius:999px;border:1px solid var(--v8-line2);background:#ffffff08;color:var(--v8-t2);font:inherit;font-size:13px;font-weight:700;cursor:pointer;transition:background .25s,color .25s,border-color .25s}
.uc-filters button.on{background:var(--v8-acc);border-color:transparent;color:#1A0B05}
.uc-filters span{margin-inline-start:auto;font-size:12px;color:var(--v8-t3)}
.uc-kpis{margin-bottom:18px}
.uc-grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.uc-card{margin:0!important;padding:20px!important;border-radius:22px!important;min-width:0;animation:vpUp .6s cubic-bezier(.2,.8,.2,1) both}
.uc-card:nth-child(2){animation-delay:.06s}.uc-card:nth-child(3){animation-delay:.12s}.uc-card:nth-child(4){animation-delay:.18s}.uc-card:nth-child(5){animation-delay:.24s}.uc-card:nth-child(6){animation-delay:.3s}
.uc-wide{grid-column:1/-1}
.uc-card h2{margin:0;font-size:16px;font-weight:900}
.uc-sub{margin:4px 0 14px;font-size:12px;color:var(--v8-t3)}
.uc-empty{margin:0;padding:18px 0;font-size:13px;color:var(--v8-t3);text-align:center}
.uc-chart{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 34px;grid-template-rows:200px 26px;gap:0 8px}
.uc-chart.cols{grid-template-rows:170px 26px}
.uc-y{position:relative;grid-column:2;grid-row:1}
.uc-y span{position:absolute;inset-inline-start:0;transform:translateY(50%);font-size:11px;color:var(--v8-t3);font-variant-numeric:tabular-nums}
.uc-plot{position:relative;grid-column:1;grid-row:1;border-bottom:1px solid var(--v8-line2);outline:none;touch-action:pan-y}
.uc-plot:focus-visible{box-shadow:0 0 0 3px #FF6B3D66;border-radius:6px}
.uc-plot svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.uc-grid{position:absolute;left:0;right:0;height:1px;background:var(--v8-line)}
.uc-line{fill:none;stroke:var(--v8-acc);stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.uc-plot svg{animation:vpReveal 1.3s cubic-bezier(.2,.8,.2,1) .15s both}
.uc-area{fill:#FF6B3D;opacity:.1}
.uc-end{position:absolute;width:10px;height:10px;margin:0 0 -5px -5px;border-radius:50%;background:var(--v8-acc);box-shadow:0 0 0 2px var(--v8-card);animation:vpPop .5s cubic-bezier(.3,1.6,.5,1) 1.2s both}
.uc-end-label{position:absolute;right:-2px;transform:translate(100%,50%);padding-inline-start:8px;font-size:12px;font-weight:800;color:var(--v8-t1);display:none}
.uc-cross{position:absolute;top:0;bottom:0;width:1px;background:var(--v8-t3);pointer-events:none}
.uc-dot{position:absolute;width:12px;height:12px;margin:0 0 -6px -6px;border-radius:50%;background:var(--v8-acc);box-shadow:0 0 0 2px var(--v8-card);pointer-events:none}
.uc-tip{position:absolute;bottom:calc(100% + 8px);z-index:3;display:grid;gap:2px;min-width:150px;padding:10px 12px;border-radius:12px;border:1px solid var(--v8-line2);background:#0f1013f2;box-shadow:0 14px 30px -12px #000a;pointer-events:none;direction:rtl;text-align:right}
.uc-tip b{font-size:18px;line-height:1.2;color:var(--v8-t1)}
.uc-tip small{font-size:11.5px;color:var(--v8-t2)}
.uc-tip em{font-style:normal;font-size:11.5px;color:var(--v8-t3)}
.uc-tip span{display:flex;align-items:center;gap:6px;margin-top:4px;font-size:11.5px;color:var(--v8-t2)}
.uc-tip span i{display:inline-block;width:12px;height:2px;border-radius:2px;background:var(--v8-acc)}
.uc-x{position:relative;grid-column:1;grid-row:2}
.uc-x span{position:absolute;top:6px;transform:translateX(-50%);font-size:11px;color:var(--v8-t3);white-space:nowrap}
.uc-x span:first-child{transform:none}
.uc-x span:last-child{transform:translateX(-100%)}
.uc-cols{display:flex;align-items:flex-end;gap:2px;padding:0 1px}
.uc-col{position:relative;flex:1 1 0;display:flex;align-items:flex-end;justify-content:center;height:100%;min-width:0;cursor:default}
.uc-col i{display:block;width:100%;max-width:24px;height:var(--h);min-height:0;border-radius:4px 4px 0 0;background:var(--v8-sky);animation:vpRise .8s cubic-bezier(.2,.8,.2,1) both;transition:filter .2s}
.uc-col.on i{filter:brightness(1.25)}
.uc-bars{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.uc-bars li{display:grid;grid-template-columns:minmax(0,9.5em) minmax(0,1fr) auto;align-items:center;gap:10px;font-size:13px;animation:vpUp .5s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i,0) * 50ms)}
.uc-bar-label{display:flex;align-items:center;gap:6px;min-width:0;overflow-wrap:anywhere;line-height:1.5;color:var(--v8-t1)}
.uc-bar-label .icon{flex:none;width:15px;height:15px;color:var(--v8-t3)}
.uc-bar-track{position:relative;height:12px;border-radius:999px;background:#ffffff0a;overflow:hidden}
.uc-bar-track i{position:absolute;inset-block:0;right:0;width:var(--w);border-radius:999px;background:linear-gradient(270deg,#FF6B3D,#FF9466);animation:vpGrow 1s cubic-bezier(.2,.8,.2,1) .2s both}
.uc-bars b{font-size:13px;white-space:nowrap;color:var(--v8-t1)}
.uc-bars b small{margin-inline-start:4px;font-size:11px;font-weight:600;color:var(--v8-t3)}
.uc-table-wrap{overflow-x:auto;border-radius:14px}
.uc-cohort{width:100%;border-collapse:separate;border-spacing:3px;font-size:12.5px;text-align:center}
.uc-cohort th{padding:8px 6px;font-weight:700;color:var(--v8-t3);white-space:nowrap}
.uc-cohort tbody th{color:var(--v8-t2);text-align:right}
.uc-cohort td{padding:10px 6px;border-radius:8px;background:#ffffff06;font-weight:700;white-space:nowrap}
.uc-heat{background:rgba(255,107,61,var(--a))!important}
.uc-raw{margin-top:18px;border-radius:18px;border:1px solid var(--v8-line);background:var(--v8-card);padding:6px 16px}
.uc-raw summary{padding:10px 0;font-weight:800;font-size:13.5px;cursor:pointer}
.uc-raw table{width:100%;border-collapse:collapse;font-size:12.5px;margin-bottom:10px}
.uc-raw th,.uc-raw td{padding:8px 6px;border-top:1px solid var(--v8-line);text-align:center;white-space:nowrap}
.uc-raw tbody th{text-align:right;font-weight:700}
@media(max-width:1100px){.uc-grid2{grid-template-columns:minmax(0,1fr)}}
@media(max-width:600px){.uc-card{padding:16px!important}.uc-chart{grid-template-rows:170px 26px}.uc-bars li{grid-template-columns:minmax(0,7em) minmax(0,1fr) auto;gap:8px;font-size:12.5px}.uc-filters span{flex-basis:100%;margin:2px 0 0}}
@media(prefers-reduced-motion:reduce){.lg-page,.lg-toc button,.pv-page,.pv-card,.uc-card,.uc-plot svg,.uc-end,.uc-col i,.uc-bars li,.uc-bar-track i{animation:none!important}}
.uc-tip[hidden],.uc-cross[hidden],.uc-dot[hidden]{display:none!important}

/* ---------- phone notifications ---------- */
@keyframes psRing{0%,100%{transform:rotate(0)}15%{transform:rotate(14deg)}30%{transform:rotate(-12deg)}45%{transform:rotate(8deg)}60%{transform:rotate(-5deg)}75%{transform:rotate(2deg)}}
@keyframes psPing{from{opacity:.8;transform:scale(.6)}to{opacity:0;transform:scale(1.9)}}
.ps-card{display:flex;align-items:flex-start;gap:16px;margin:0 0 18px;padding:20px;border-radius:24px;border:1px solid var(--v8-line);background:radial-gradient(110% 150% at 100% 0%,#FF6B3D24,transparent 55%),var(--v8-card);animation:vpUp .6s cubic-bezier(.2,.8,.2,1) both}
.ps-card.tone-on{background:radial-gradient(110% 150% at 100% 0%,#C5E86C22,transparent 55%),var(--v8-card)}
.ps-card.tone-bad{background:radial-gradient(110% 150% at 100% 0%,#FF8A7A1f,transparent 55%),var(--v8-card)}
.ps-ic{position:relative;display:grid;place-items:center;flex:0 0 52px;width:52px;height:52px;border-radius:17px;background:linear-gradient(135deg,#FFB37A,#FF6B3D);color:#1A0B05;box-shadow:0 14px 28px -14px #FF6B3D}
.ps-ic .icon{width:24px;height:24px;transform-origin:50% 10%;animation:psRing 2.6s ease-in-out 1s infinite}
.ps-ic i{position:absolute;top:8px;left:8px;width:10px;height:10px;border-radius:50%;background:#fff;box-shadow:0 0 0 2px #FF6B3D}
.ps-ic i::after{content:"";position:absolute;inset:-2px;border-radius:50%;border:2px solid #fff;animation:psPing 1.8s ease-out infinite}
.tone-on .ps-ic{background:linear-gradient(135deg,#E4F8AE,#9FD143);box-shadow:0 14px 28px -14px #9FD143}
.tone-bad .ps-ic{background:linear-gradient(135deg,#FFC8BF,#FF6F5E)}
.tone-bad .ps-ic .icon,.tone-bad .ps-ic i,.tone-on .ps-ic i{animation:none}
.tone-bad .ps-ic i,.tone-off .ps-ic i{display:none}
.ps-tx{min-width:0;flex:1}
.ps-tx h2{margin:0;font-size:17px;font-weight:900;line-height:1.5}
.ps-tx p{margin:4px 0 0;font-size:13px;line-height:1.85;color:var(--v8-t2)}
.ps-tx .action-row{margin-top:12px}
.ps-tx .btn .icon{width:17px;height:17px}
.ps-invite{position:fixed;z-index:60;left:16px;right:16px;bottom:calc(96px + env(safe-area-inset-bottom));margin:0 auto;max-width:420px;display:flex;align-items:flex-start;gap:12px;padding:14px;border-radius:20px;border:1px solid #FF6B3D55;background:#16171bf5;box-shadow:0 24px 50px -18px #000c,0 0 0 1px #ffffff0d;backdrop-filter:blur(14px);transform:translateY(30px) scale(.96);opacity:0;transition:transform .45s cubic-bezier(.2,.9,.25,1.2),opacity .35s}
.ps-invite.in{transform:none;opacity:1}
.ps-invite .ps-ic{flex-basis:44px;width:44px;height:44px;border-radius:14px}
.ps-invite b{display:block;font-size:14px;line-height:1.6}
.ps-invite p{margin:2px 0 10px;font-size:12.5px;line-height:1.7;color:var(--v8-t2)}
.ps-invite-acts{display:flex;gap:8px}
.ps-invite-acts .btn{min-height:40px;padding:0 16px}
@media(min-width:741px){.ps-invite{bottom:24px;left:24px;right:auto}}
@media(max-width:600px){.ps-card{padding:16px;gap:12px;border-radius:20px}.ps-ic{flex-basis:44px;width:44px;height:44px;border-radius:14px}}
@media(prefers-reduced-motion:reduce){.ps-card,.ps-ic .icon,.ps-ic i::after{animation:none!important}.ps-invite{transition:none}}

/* ---------- phones: form fields stay inside their box ----------
   iOS Safari draws date and time fields at a width of their own and ignores width:100%; that pushed whole dialogs
   wider than the screen, so the boxes slid sideways under a finger. These fields now follow their box, and a dialog
   never scrolls sideways. */
input[type=date],input[type=time],input[type=datetime-local],input[type=month],input[type=week]{-webkit-appearance:none;appearance:none;display:block;box-sizing:border-box;width:100%;max-width:100%;min-width:0;min-height:48px}
input[type=date]::-webkit-date-and-time-value,input[type=time]::-webkit-date-and-time-value,input[type=datetime-local]::-webkit-date-and-time-value,input[type=month]::-webkit-date-and-time-value{min-height:1.5em;margin:0;text-align:right}
#dialog-body{overflow-x:hidden}
#dialog-body form,#dialog-body label,#dialog-body fieldset,#dialog-body .form-grid>*{min-width:0;max-width:100%}