/* Account UI shares the marketing site's typography and paper / ink palette. */
button,input,textarea { font: inherit; }
button { cursor:pointer; }
button:disabled { cursor:not-allowed; opacity:.48; transform:none!important; }
button.btn { border:0; }
input,textarea { width:100%; color:var(--ink); background:#fffdf9; border:1px solid #d4d5d2; border-radius:8px; padding:12px 14px; font-size:1rem; }
input:focus-visible,textarea:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
input::placeholder,textarea::placeholder { color:#787d7e; }
label { display:block; font-size:.87rem; font-weight:500; margin-bottom:8px; }
button.text-button { border:0; background:none; color:var(--ink-soft); text-decoration:underline; text-underline-offset:4px; font-size:.88rem; padding:5px 0; }
button.text-button:hover,.text-link:hover { color:var(--accent); }
.text-link { font-size:.9rem; font-weight:600; text-decoration:underline; text-underline-offset:5px; }
.kicker,.section-number { display:block; font-family:var(--mono); font-size:.69rem; font-weight:400; letter-spacing:.08em; color:var(--muted); }
.muted { color:var(--muted); }
.small { font-size:.78rem; }
.mono { font-family:var(--mono); }
h1,h2,h3 { font-family:var(--display); line-height:1.12; letter-spacing:-.035em; }
h3 { font-size:1.3rem; font-weight:600; }
nav { border-bottom:1px solid var(--hairline); max-width:1240px; min-height:85px; }
nav .nav-links { margin-left:auto; }
nav .brand img { border-radius:7px; }
.skip-link { position:absolute; top:-60px; left:20px; padding:10px; background:white; z-index:10; }
.skip-link:focus { top:10px; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.skeleton-line { display:block; max-width:100%; height:14px; border-radius:5px; background:var(--hairline); }
.skeleton-label { width:140px; height:11px; }
.skeleton-nav { width:140px; height:35px; margin-top:20px; }
.skeleton-title { width:280px; height:43px; margin:35px 0 24px; }
.skeleton-copy { width:390px; }
.loading-membership { min-height:260px; }
.loading-details { display:grid; grid-template-columns:minmax(0,1fr); min-width:0; align-content:start; gap:26px; }
.loading-details .skeleton-title { margin:0; height:60px; width:220px; }
.account-loading .account-sidebar { gap:7px; }
#main { min-height:calc(100svh - 175px); }
.login-layout { max-width:1060px; margin:0 auto; padding:clamp(58px,10vh,114px) 32px 72px; display:grid; grid-template-columns:1fr 1fr; gap:clamp(50px,9vw,125px); align-items:start; }
.login-story { padding-top:4px; }
.login-story h1 { font-size:clamp(2.8rem,4.6vw,4.1rem); line-height:1.04; margin-top:22px; font-weight:600; }
.login-story > p { max-width:290px; margin-top:23px; font-size:1.03rem; color:var(--muted); }
.device-note { display:flex; gap:15px; align-items:center; margin-top:48px; font-size:.81rem; color:var(--muted); line-height:1.5; }
.device-note strong { color:var(--ink-soft); font-weight:500; }
.device-mark { display:grid; place-items:center; width:47px; height:47px; border:1px solid var(--hairline); border-radius:10px; font-size:1.9rem; color:var(--ink-soft); box-shadow:0 3px 0 var(--paper-dim); }
.login-panel { padding-top:4px; }
.login-panel h2 { font-size:1.9rem; font-weight:600; margin-top:22px; }
.panel-sub { color:var(--muted); font-size:.94rem; margin:14px 0 26px; }
.wide { width:100%; justify-content:center; padding:13px 17px; border-radius:8px; }
.wide > span:last-child { margin-left:auto; }
.wide.primary { margin-top:14px; }
.btn.google { background:#fffdf9; box-shadow:inset 0 0 0 1px #d4d5d2; color:var(--ink); font-weight:500; }
.btn.google svg { width:19px; height:19px; margin-right:9px; }
.btn.google:hover { background:var(--paper-dim); }
.divider { display:flex; align-items:center; gap:14px; color:var(--muted); font-size:.75rem; margin:25px 0; }
.divider:before,.divider:after { content:''; flex:1; border-top:1px solid var(--hairline); }
.fine-note { color:var(--muted); font-size:.76rem; line-height:1.6; margin-top:17px; }
.resend-row { display:flex; justify-content:space-between; gap:14px; margin-top:18px; }
#code { font-family:var(--mono); letter-spacing:.11em; font-size:1.1rem; }
.login-bottom { display:flex; justify-content:space-between; gap:20px; max-width:996px; margin:0 auto 60px; padding-top:22px; border-top:1px solid var(--hairline); color:var(--muted); font-family:var(--mono); font-size:.62rem; letter-spacing:.04em; }
.message { margin:16px 0; padding:11px 14px; border-left:2px solid var(--accent); background:#eef3f2; color:#244c50; font-size:.87rem; line-height:1.5; overflow-wrap:anywhere; }
.message.error { background:#f8eeeb; color:#8d3728; border-color:#b7533f; }
.message[hidden] { display:none; }
.account-footer { background:transparent; max-width:1240px; margin:0 auto; padding:24px 40px; border-top:1px solid var(--hairline); display:flex; justify-content:space-between; gap:18px; color:var(--muted); font-size:.75rem; }
.workspace { max-width:1240px; margin:0 auto; display:grid; grid-template-columns:222px minmax(0,1fr); min-height:650px; }
.account-sidebar { padding:42px 23px 30px 40px; border-right:1px solid var(--hairline); display:flex; flex-direction:column; gap:7px; }
.account-sidebar .kicker { margin-bottom:19px; }
.side-link { padding:10px 11px; margin:0 -11px; display:flex; justify-content:space-between; color:var(--muted); font-size:.88rem; border-radius:7px; }
.side-link.selected { color:var(--ink); background:var(--paper-dim); font-weight:600; }
.sidebar-identity { margin-top:auto; padding-top:60px; display:grid; justify-items:start; gap:9px; }
.avatar { display:grid; place-items:center; width:32px; height:32px; border:1px solid var(--hairline); background:#eaf0ee; border-radius:50%; font-family:var(--display); font-size:.87rem; }
.identity-email { font-size:.78rem; max-width:100%; overflow-wrap:anywhere; }
.workspace-content { padding:42px 40px 60px; min-width:0; }
.workspace-heading { display:flex; align-items:end; justify-content:space-between; gap:15px; margin-bottom:34px; }
.workspace-heading h1 { font-size:clamp(1.7rem,2.6vw,2.3rem); margin-top:13px; }
.workspace-heading p { font-size:.88rem; color:var(--muted); margin-top:12px; }
.workspace-heading > button,.workspace-heading > a { flex-shrink:0; }
.membership { padding:28px 30px 0; border:1px solid var(--hairline); border-radius:12px; background:linear-gradient(115deg,#f1f2ed,var(--paper)); overflow:hidden; }
.membership.pro { background:#14242b; color:#f5f6f3; border-color:#14242b; }
.membership-top { display:flex; align-items:center; justify-content:space-between; gap:15px; }
.membership-top .kicker { color:inherit; opacity:.65; }
.status-pill { font-size:.69rem; border:1px solid var(--hairline); padding:3px 9px; border-radius:99px; }
.pro .status-pill { border-color:#54736e; color:#b4e0cb; }
.membership h2 { font-size:2.8rem; font-weight:500; margin:33px 0 14px; position:relative; }
.membership h2 em { font-style:normal; color:var(--accent); }
.pro h2 em { color:#91dbe1; }
.plan-star { position:absolute; right:7px; top:-7px; font-size:4.4rem; font-family:var(--sans); font-weight:400; color:#c2d3cf; }
.pro .plan-star { color:#567e81; }
.membership > p { font-size:.88rem; opacity:.74; padding-right:55px; }
.membership-bottom { margin-top:32px; padding:18px 0; border-top:1px solid var(--hairline); display:flex; justify-content:space-between; gap:16px; font-size:.73rem; }
.pro .membership-bottom { border-color:#35484e; }
.pro .membership-bottom a:hover { color:#91dbe1; }
.membership-bottom span { opacity:.7; }
.account-details { display:grid; grid-template-columns:1.3fr 1fr; margin-top:40px; gap:40px; }
.account-details dl { margin-top:17px; }
.account-details dl > div { padding:13px 0; border-bottom:1px solid var(--hairline); }
dt { color:var(--muted); font-size:.75rem; }
dd { font-size:.88rem; overflow-wrap:anywhere; margin-top:3px; }
.account-note { border-left:1px solid var(--hairline); padding-left:30px; }
.account-note h3 { margin-top:23px; font-size:1.55rem; }
.account-note p { color:var(--muted); font-size:.84rem; margin:15px 0 24px; }
.checked-at { margin-top:30px; font-size:.7rem; color:var(--muted); }
.users-toolbar { display:flex; align-items:center; justify-content:space-between; gap:15px; margin:10px 0 20px; }
.users-toolbar form { display:flex; gap:8px; width:min(420px,75%); }
.users-toolbar input { min-width:0; font-size:.85rem; padding:10px 12px; }
.count { font-family:var(--mono); font-size:.72rem; color:var(--muted); white-space:nowrap; }
.table-scroll { width:100%; overflow-x:auto; border-top:1px solid var(--hairline); }
table { width:100%; border-collapse:collapse; text-align:left; font-size:.79rem; }
th { font-weight:500; color:var(--muted); font-size:.7rem; }
th,td { padding:17px 12px; border-bottom:1px solid var(--hairline); }
th:first-child,td:first-child { padding-left:0; }
th:last-child,td:last-child { padding-right:0; text-align:right; }
td { white-space:nowrap; }
td .muted { display:block; margin-top:5px; }
.user-email { font-weight:500; }
.plan-label { font-weight:500; font-size:.75rem; }
.plan-label.vip { color:#266454; }
.empty-state { text-align:center!important; padding:55px 20px; color:var(--muted); white-space:normal; }
.pagination { display:flex; align-items:center; justify-content:space-between; margin:22px 0; font-size:.75rem; color:var(--muted); }
.pagination > div { display:flex; gap:7px; }
.pagination .btn { font-size:.75rem; padding:7px 10px; }
#user-detail:not(:empty) { border-top:1px solid var(--ink); margin-top:45px; padding-top:30px; scroll-margin-top:30px; }
.detail-heading { display:flex; align-items:start; justify-content:space-between; gap:16px; }
.detail-heading h2 { font-size:1.55rem; margin:10px 0; overflow-wrap:anywhere; }
.detail-grid { display:grid; grid-template-columns:1.25fr 1fr; gap:38px; margin-top:30px; }
.detail-grid h3 { font-size:1.1rem; margin-bottom:7px; }
.detail-grid p { font-size:.8rem; }
.grant-list { margin:20px 0; }
.grant-row { display:flex; align-items:start; gap:15px; justify-content:space-between; border-top:1px solid var(--hairline); padding:13px 0; }
.grant-row strong { font-size:.78rem; font-weight:600; }
.grant-row p { margin-top:4px; overflow-wrap:anywhere; }
.grant-actions { display:flex; gap:10px; }
.audit-list { list-style:none; }
.audit-list li { margin-top:20px; padding-left:12px; border-left:1px solid var(--hairline); }
.audit-list strong { font-size:.76rem; font-weight:600; }
.audit-list p { margin:4px 0; color:var(--muted); overflow-wrap:anywhere; }
.audit-list time { color:var(--muted); font-size:.67rem; }
.empty-note { font-size:.8rem; color:var(--muted); }
.grant-form { padding:24px; margin-top:25px; border:1px solid var(--hairline); border-radius:9px; background:var(--paper-dim); }
.grant-form h3 { margin:10px 0; }
.grant-form p { font-size:.82rem; }
.date-fields { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin:23px 0 16px; }
.checkbox-label { display:flex; align-items:center; gap:10px; margin:15px 0 22px; }
.checkbox-label input { width:17px; height:17px; accent-color:var(--accent); }
.form-actions { display:flex; gap:20px; margin-top:18px; align-items:center; }
button.danger { color:#9a4431; }
button.danger-button { background:#933f30; }
.service-error { max-width:650px; padding:110px 30px; margin:0 auto; }
.service-error h1 { margin:20px 0; font-size:2.8rem; }
.service-error p { color:var(--muted); margin-bottom:30px; }
.service-error > a { margin-left:20px; }
@media(max-width:1000px) {
  .workspace { grid-template-columns:180px minmax(0,1fr); }
  .account-sidebar { padding-left:25px; }
  .workspace-content { padding:35px 25px; }
  .account-details { gap:25px; }
}
@media(max-width:720px) {
  .account-loading .account-sidebar { min-height:76px; }
  .account-loading .account-sidebar .skeleton-line { width:90px; height:20px; margin:0; }
  .account-loading .account-sidebar .skeleton-label { display:none; }
  nav { padding:18px 20px; gap:18px; }
  nav .nav-links { display:flex; gap:15px; }
  nav .nav-links a:not(.pricing-link) { display:block; }
  nav > .btn { display:none; }
  .login-layout { grid-template-columns:1fr; gap:40px; padding:44px 24px 50px; max-width:480px; }
  .login-story h1 { font-size:2.65rem; }
  .login-story h1 br { display:none; }
  .login-story > p { max-width:none; margin-top:15px; font-size:.94rem; }
  .device-note { display:none; }
  .login-panel { padding-top:28px; border-top:1px solid var(--hairline); }
  .login-panel h2 { font-size:1.7rem; margin-top:15px; }
  .login-bottom { display:none; }
  .account-footer { padding:20px 24px; flex-direction:column; gap:7px; }
  .workspace { display:block; }
  .account-sidebar { border-right:0; border-bottom:1px solid var(--hairline); padding:15px 24px; flex-direction:row; align-items:center; flex-wrap:wrap; gap:24px; }
  .account-sidebar > .kicker,.sidebar-identity .avatar,.identity-email { display:none; }
  .side-link { margin:0; padding:7px 10px; gap:15px; }
  .sidebar-identity { margin:0 0 0 auto; padding:0; display:block; }
  .workspace-content { padding:32px 20px; }
  .workspace-heading { display:block; margin-bottom:25px; }
  .workspace-heading > button,.workspace-heading > a { display:inline-block; margin-top:14px; }
  .membership { padding:23px 22px 0; }
  .membership h2 { font-size:2.25rem; }
  .plan-star { font-size:3.3rem; }
  .membership-bottom { align-items:start; }
  .membership-bottom .text-link { font-size:.8rem; flex-shrink:0; }
  .account-details { grid-template-columns:1fr; gap:32px; }
  .account-note { border-left:0; padding:25px 0 0; border-top:1px solid var(--hairline); }
  .users-toolbar { align-items:start; flex-direction:column; }
  .users-toolbar form { width:100%; }
  .detail-grid { grid-template-columns:1fr; gap:30px; }
  .date-fields { grid-template-columns:1fr; gap:14px; }
  .grant-form { padding:20px 16px; }
}
@media(prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { transition:none!important; animation:none!important; }
}
