/* Website service pages (accounts, friends, admin). Builds on styles.css: same ink/paper palette, Georgia display type,
   square buttons and thin rules. Mobile first; every control is at least 44px tall. */
:root{--rule:#d9dfd2;--muted:#56665b;--card:#fff;--ok:#dde8ce;--warn:#fbe9b7;--err:#f6dcd7}
.env-banner{background:#4a3800;color:#fffbe9;text-align:center;font-size:13px;letter-spacing:.3px;padding:6px 12px}
.page{min-height:100svh;display:flex;flex-direction:column}
.site-header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 5.1%;border-bottom:1px solid var(--rule);position:relative}
.site-header .identity img{filter:brightness(.4)}
.nav-menu summary{list-style:none;cursor:pointer;width:44px;height:44px;display:flex;align-items:center;justify-content:center;position:relative}
.nav-menu summary::-webkit-details-marker{display:none}
.nav-burger,.nav-burger:before,.nav-burger:after{display:block;width:22px;height:2px;background:var(--ink,#18362c);position:relative}
.nav-burger:before,.nav-burger:after{content:'';position:absolute;left:0}.nav-burger:before{top:-7px}.nav-burger:after{top:7px}
.nav-dot{position:absolute;top:9px;right:8px;width:8px;height:8px;border-radius:50%;background:#b3261e}
.nav-menu nav{position:absolute;right:0;top:100%;z-index:10;background:var(--paper,#f3f1e8);border:1px solid var(--rule);display:flex;flex-direction:column;min-width:240px;padding:8px 0}
.nav-menu nav a{padding:12px 20px;text-decoration:none;font-size:16px}.nav-menu nav a:hover{background:#e9ece2}
.nav-account{display:flex;align-items:center;gap:10px}.nav-cta{font-weight:600}
.count{display:inline-block;min-width:20px;padding:0 6px;border-radius:10px;background:#b3261e;color:#fff;font-size:12px;text-align:center;line-height:20px}
.nav-desktop{display:none}
@media(min-width:900px){.nav-menu{display:none}.nav-desktop{display:flex;align-items:center;gap:4px}.nav-desktop a{padding:10px 12px;font-size:15px;text-decoration:none}.nav-desktop a:hover{text-decoration:underline;text-underline-offset:4px}.nav-cta{border:1px solid var(--ink,#18362c)}}
.banner{margin:0;padding:12px 5.1%;font-size:15px;display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between}
.banner-ok{background:var(--ok)}.banner-error{background:var(--err);color:#5c140f}.banner-warn{background:var(--warn);color:#4a3800}
.page-main .banner{padding:12px 16px;margin:0 0 20px}
.site-footer-full{flex-wrap:wrap;gap:12px 24px;border-top:1px solid var(--rule)}.site-footer-full nav{display:flex;flex-wrap:wrap;gap:4px 18px}.site-footer-full a{text-underline-offset:3px}
.h-compact{font-size:clamp(32px,5vw,44px)!important;margin-bottom:12px!important}
.page-main h2{font-size:19px}.section-label{font-size:13px!important;letter-spacing:2px;text-transform:uppercase;color:#4e6347;margin-top:32px}
.stack{display:flex;flex-direction:column;gap:16px;max-width:560px;margin:20px 0}.stack.narrow{max-width:280px}.stack-tight{display:flex;flex-direction:column;gap:6px}
.row{display:flex;flex-wrap:wrap;gap:12px 20px;align-items:flex-end}.grow{flex:1 1 200px}
.field{display:flex;flex-direction:column;gap:6px;margin:0;border:0;padding:0;min-width:0}.field label,.field legend{font-size:14px;font-weight:600;color:var(--ink,#18362c)}
.field label{display:flex;flex-direction:column;gap:6px}.hint{font-size:13px;color:var(--muted);font-weight:400}
.page-main input:not([type=checkbox]):not([type=radio]),.page-main select,.page-main textarea{width:100%;min-height:48px;padding:10px 12px;border:1px solid #9fb09a;background:#fff;color:var(--ink,#18362c);font:inherit;font-size:16px;border-radius:0}
.page-main textarea{min-height:120px;resize:vertical}
.page-main input:focus-visible,.page-main select:focus-visible,.page-main textarea:focus-visible,.page-main button:focus-visible,.page-main a:focus-visible{outline:3px solid #b9d890;outline-offset:2px}
.check{display:flex;gap:10px;align-items:flex-start;font-size:15px;line-height:1.5;min-height:44px;padding-top:10px}.check input{width:20px;height:20px;margin:1px 0 0;flex:none;accent-color:#18362c}
.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 22px;font-size:15px;text-decoration:none}
.button-small{min-height:40px;padding:8px 14px;font-size:14px}.button.is-disabled{opacity:.55;cursor:not-allowed}
.oauth{display:flex;flex-direction:column;gap:10px;max-width:560px;margin:16px 0 0}.button-oauth{background:#fff;border:1px solid #9fb09a;color:var(--ink,#18362c)}
.divider{display:flex;align-items:center;gap:12px;max-width:560px;color:var(--muted);font-size:13px;margin:20px 0 0}.divider:before,.divider:after{content:'';flex:1;border-top:1px solid var(--rule)}
form.inline{display:inline}.actions{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;margin-top:12px}.actions-quiet{margin-top:28px;font-size:14px}
.card{background:var(--card);border:1px solid var(--rule);padding:20px;margin:20px 0}.card h2{margin-top:0}.card-danger{border-color:#e4b9b2}
.badge{display:inline-block;font-size:12px;letter-spacing:.5px;text-transform:uppercase;padding:3px 8px;background:#e7e9df;color:var(--ink,#18362c);vertical-align:middle}
.badge-founder{background:#18362c;color:#f3e9b9}
.avatar{border-radius:50%;display:block;flex:none;background:#e7e9df}
.avatar-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:10px;max-width:560px}
.avatar-choice{position:relative;display:flex;justify-content:center;padding:4px;border:2px solid transparent;cursor:pointer}
.avatar-choice input{position:absolute;opacity:0}.avatar-choice:has(input:checked){border-color:#18362c;background:#fff}.avatar-choice:has(input:focus-visible){outline:3px solid #b9d890}
.profile-head{display:flex;gap:20px;align-items:center;margin-bottom:20px}.profile-head p{margin:4px 0}
.profile-card{max-width:820px}
.facts{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:0;margin:20px 0;border-top:1px solid var(--rule)}
.facts div{padding:12px 0;border-bottom:1px solid var(--rule)}.facts dt{font-size:13px;color:var(--muted)}.facts dd{margin:4px 0 0;font-size:16px;overflow-wrap:anywhere}
.stat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px;margin:12px 0 20px}
.stat{background:#fff;border:1px solid var(--rule);padding:16px}.stat span{display:block;font-size:13px;color:var(--muted)}.stat strong{display:block;font-family:Georgia,serif;font-size:32px;font-weight:400}.stat small{color:var(--muted)}
.people{list-style:none;padding:0;margin:0}.people li{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;padding:10px 0;border-bottom:1px solid var(--rule)}.people li a{font-weight:600}
.search-row{display:flex;gap:10px;flex-wrap:wrap;max-width:640px;margin:16px 0}.search-row .button{flex:none}
.title-row{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between}
.notifications{list-style:none;padding:0;margin:16px 0}.notifications li{display:flex;justify-content:space-between;gap:16px;padding:14px 12px;border-bottom:1px solid var(--rule)}
.notifications li.unread{background:#fff;border-left:3px solid #18362c}.notifications time{font-size:13px;color:var(--muted);white-space:nowrap}
.account-layout{display:grid;gap:24px}.account-nav{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:15px;border-bottom:1px solid var(--rule);padding-bottom:12px}
.account-nav a{text-decoration:none;padding:8px 0}.account-nav a[aria-current]{font-weight:700;text-decoration:underline;text-underline-offset:5px}
@media(min-width:900px){.account-layout{grid-template-columns:200px 1fr;gap:48px}.account-nav{flex-direction:column;border-bottom:0;border-right:1px solid var(--rule);padding:0 20px 0 0;align-self:start}}
.qr{display:block;background:#fff;padding:10px;border:1px solid var(--rule);margin:12px 0}.secret{word-break:break-all;font-size:15px}
.copy-field code{display:block;background:#fff;border:1px solid var(--rule);padding:12px;overflow-wrap:anywhere;font-size:15px}
.item-list{list-style:none;padding:0}.item-list li{padding:8px 0;border-bottom:1px solid var(--rule)}.item-rarity{font-size:11px;text-transform:uppercase;letter-spacing:.6px;padding:2px 6px;background:#e7e9df}.rarity-founder{background:#18362c;color:#f3e9b9}.rarity-rare{background:#d9e4f2}
.feature-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px;margin:24px 0}.feature{background:#fff;border:1px solid var(--rule);padding:20px}.feature h2{margin:10px 0 6px}.feature p{margin:0;font-size:15px}
.faq details{border-bottom:1px solid var(--rule);padding:4px 0}.faq summary{cursor:pointer;font-weight:600;padding:14px 0;font-size:17px;min-height:44px}
.prose{font-size:16px;line-height:1.75}.prose h2{margin-top:28px}.prose code{background:#e7e9df;padding:1px 4px}
.post-list{list-style:none;padding:0}.post-list li{padding:20px 0;border-bottom:1px solid var(--rule)}.post-list h2{margin:4px 0;font-family:Georgia,serif;font-weight:400;font-size:26px}.post-list time{font-size:13px;color:var(--muted)}
.press-assets{display:flex;flex-wrap:wrap;gap:20px}.press-assets img{max-width:100%;height:auto;background:#18362c;display:block}.press-assets figure{margin:0}
.pre{white-space:pre-wrap;overflow-wrap:anywhere}
.log{list-style:none;padding:0}.log li{padding:8px 0;border-bottom:1px solid var(--rule)}
.messages{list-style:none;padding:0}
.admin-actions-grid{display:grid;gap:12px}.admin-action{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.admin-action input,.admin-action select{flex:1 1 160px;width:auto!important}
.tag-active,.tag-confirmed{background:var(--ok)}.tag-suspended,.tag-pending{background:var(--warn)}.tag-banned,.tag-unsubscribed{background:var(--err)}
.admin-nav .eyebrow-dark{margin:0 0 8px}
/* Homepage (staging): sign-in links in the hero masthead. */
.masthead-nav{display:flex;gap:6px;align-items:center}.masthead-nav a{color:#fffdf4;text-decoration:none;font-size:15px;padding:10px 12px;min-height:44px;display:inline-flex;align-items:center}
.masthead-cta{border:1px solid rgba(255,253,244,.7)}
@media(max-width:600px){.site-header{padding:14px 7%}.page-main{padding:28px 7% 48px}.profile-head{gap:14px}.notifications li{flex-direction:column;gap:4px}.masthead-nav a{padding:8px;font-size:14px}}
.page-main input,.page-main select,.page-main textarea{font-weight:400}
.site-footer-full span:last-child{max-width:none;text-align:left}
@media(max-width:600px){.site-footer-full{flex-direction:column;align-items:flex-start}}
