@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=DM+Sans:wght@400;500;600;700&family=Fraunces:opsz,wght@9..144,500;9..144,600&display=swap');

:root { --paper:#f8f6f1; --paper-deep:#eeeae1; --ink:#202d3a; --muted:#66727c; --blue:#486f9e; --blue-dark:#23496b; --line:rgba(32,45,58,.14); --peach:#e8ad91; --mint:#aec7bb; --rose:#d9999b; --sand:#d5bd91; --ease:cubic-bezier(.22,1,.36,1); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:'DM Sans',Arial,sans-serif; font-size:16px; line-height:1.6; }
body:before { content:""; position:fixed; inset:0; pointer-events:none; z-index:-2; background:radial-gradient(ellipse at 15% 5%,rgba(232,173,145,.15),transparent 27%),radial-gradient(ellipse at 94% 30%,rgba(174,199,187,.16),transparent 29%),radial-gradient(ellipse at 50% 100%,rgba(213,189,145,.13),transparent 33%); }
.paper-grain { position:fixed; inset:0; opacity:.1; pointer-events:none; z-index:-1; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' 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)' opacity='.16'/%3E%3C/svg%3E"); mix-blend-mode:multiply; }
a { color:inherit; text-decoration:none; }
button,input,textarea { font:inherit; }
button { cursor:pointer; }
.container { width:min(1160px,calc(100% - 64px)); margin-inline:auto; }
.site-header { position:relative; border-bottom:1px solid var(--line); }
.nav-wrap { height:86px; display:flex; align-items:center; justify-content:space-between; }
.wordmark { display:inline-flex; align-items:center; gap:10px; color:var(--ink); font-weight:700; letter-spacing:-.02em; }
.wordmark-mark { display:grid; place-items:center; width:29px; height:29px; border:1.5px solid var(--ink); border-radius:50%; font-family:Georgia,serif; font-size:20px; font-weight:400; line-height:1; transform:rotate(-12deg); }
.desktop-nav { display:flex; gap:32px; align-items:center; margin-left:auto; margin-right:38px; font-size:14px; color:var(--muted); }
.desktop-nav a { position:relative; padding:7px 0; transition:color .5s var(--ease); }
.desktop-nav a:hover,.desktop-nav a.active { color:var(--ink); }
.desktop-nav a.active:after { content:""; position:absolute; left:0; right:0; bottom:0; height:2px; background:var(--blue); border-radius:2px; }
.desktop-nav .nav-admin { color:var(--blue); }
.nav-actions { display:flex; align-items:center; gap:12px; }
.icon-button,.menu-button { display:grid; place-items:center; width:38px; height:38px; padding:0; border:1px solid var(--line); border-radius:50%; color:var(--ink); background:transparent; transition:box-shadow .5s var(--ease),background .5s var(--ease); }
.icon-button:hover { background:#fff; box-shadow:0 8px 24px rgba(72,111,158,.15); }
.icon-button span { font-size:24px; transform:rotate(-18deg); display:block; }
.menu-button { display:none; border-radius:8px; }
.menu-button span { width:16px; height:1px; display:block; background:var(--ink); transition:transform .4s var(--ease); }
.mobile-nav { display:none; }
.eyebrow,.card-kicker,.admin-eyebrow { font-family:'DM Mono',monospace; font-size:10px; letter-spacing:.14em; color:var(--blue); }
.eyebrow { display:flex; align-items:center; gap:9px; margin:0 0 23px; }
.eyebrow-dot { width:7px; height:7px; border-radius:50%; background:var(--peach); display:inline-block; }
h1,h2,h3,p { margin-top:0; }
h1,h2,h3 { letter-spacing:-.045em; line-height:1.06; font-weight:500; }
h1,h2 { font-family:Fraunces,Georgia,serif; }
h1 em,h2 em { color:var(--blue); font-style:italic; }
.hero-section { min-height:590px; display:grid; grid-template-columns:1.03fr .97fr; align-items:center; gap:60px; padding-top:62px; padding-bottom:76px; }
.hero-copy h1 { max-width:630px; font-size:clamp(3.5rem,6.3vw,6.1rem); margin-bottom:25px; }
.hero-lede { color:var(--muted); font-size:17px; line-height:1.85; max-width:455px; }
.hero-actions { display:flex; align-items:center; gap:27px; margin-top:34px; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:20px; min-height:48px; padding:0 20px; border:1px solid transparent; border-radius:6px; font-size:13px; font-weight:600; transition:box-shadow .5s var(--ease),background .5s var(--ease),transform .2s var(--ease); }
.button:active { transform:scale(.98); }
.button-primary { background:var(--blue); color:#fff; box-shadow:0 11px 28px rgba(72,111,158,.2); }
.button-primary:hover { background:var(--blue-dark); box-shadow:0 16px 34px rgba(72,111,158,.3); }
.button-dark { background:var(--ink); color:#fff; }
.button-dark:hover { background:var(--blue-dark); box-shadow:0 13px 30px rgba(32,45,58,.22); }
.text-link { color:var(--ink); font-size:13px; border-bottom:1px solid var(--ink); padding-bottom:4px; transition:color .5s var(--ease),border-color .5s var(--ease); }
.text-link span,.arrow-link span { margin-left:12px; color:var(--blue); }
.text-link:hover { color:var(--blue); border-color:var(--blue); }
.hero-art { position:relative; height:430px; overflow:hidden; background:rgba(255,255,255,.28); border:1px solid rgba(32,45,58,.08); border-radius:50% 46% 52% 44% / 48% 53% 47% 51%; transform:rotate(2deg); }
.hero-art:after { content:""; position:absolute; inset:13% 12%; border:1px solid rgba(32,45,58,.16); border-radius:48% 53% 46% 52%; transform:rotate(-10deg); }
.paint-shape { position:absolute; filter:blur(16px); opacity:.84; mix-blend-mode:multiply; }
.shape-blue { width:300px; height:245px; right:5%; top:15%; background:radial-gradient(ellipse,#7697bf 0%,#9fb8d0 38%,transparent 71%); transform:rotate(-26deg); }
.shape-peach { width:270px; height:175px; left:0; bottom:16%; background:radial-gradient(ellipse,#e8ad91 0%,#eab9a4 35%,transparent 72%); transform:rotate(25deg); }
.shape-ink { width:230px; height:110px; left:24%; top:42%; background:radial-gradient(ellipse,rgba(48,85,120,.65),transparent 71%); transform:rotate(-19deg); filter:blur(26px); }
.art-note { position:absolute; z-index:2; left:20%; top:22%; color:#244263; font-family:'DM Mono',monospace; font-size:11px; line-height:1.65; transform:rotate(-11deg); }
.art-note strong { display:block; margin-top:7px; font-family:Fraunces,Georgia,serif; font-size:29px; line-height:1.05; letter-spacing:-.04em; font-weight:500; }
.art-line { position:absolute; z-index:2; width:120px; height:1px; right:21%; bottom:25%; background:#244263; transform:rotate(31deg); }
.featured-section,.latest-section,.topics-section { padding-top:75px; }
.section-label { display:flex; gap:18px; color:var(--muted); font-family:'DM Mono',monospace; font-size:10px; letter-spacing:.12em; text-transform:uppercase; }
.section-label span:first-child { color:var(--blue); }
.featured-card { position:relative; display:grid; grid-template-columns:1fr 1.1fr; min-height:325px; margin-top:26px; padding:32px 40px; border:1px solid rgba(32,45,58,.1); border-radius:18px; overflow:hidden; isolation:isolate; transition:box-shadow .5s var(--ease); }
.featured-card:before { content:""; position:absolute; inset:0; z-index:-1; opacity:.7; background:radial-gradient(ellipse at 88% 35%,rgba(255,255,255,.8),transparent 45%),radial-gradient(ellipse at 20% 90%,rgba(232,173,145,.75),transparent 50%),linear-gradient(120deg,rgba(188,211,230,.75),rgba(248,246,241,.2)); }
.featured-card:hover,.article-card:hover { box-shadow:0 18px 48px rgba(72,111,158,.16); }
.featured-meta,.article-meta { display:flex; gap:17px; align-items:center; color:var(--muted); font-family:'DM Mono',monospace; font-size:10px; letter-spacing:.03em; }
.featured-meta span:first-child,.article-meta span:first-child { color:var(--blue); }
.featured-content { align-self:end; max-width:490px; padding-bottom:4px; }
.card-kicker { margin-bottom:14px; }
.featured-content h2 { font-size:clamp(2.3rem,4vw,4rem); max-width:470px; margin-bottom:16px; }
.featured-content p:not(.card-kicker) { max-width:410px; color:var(--muted); }
.arrow-link { display:inline-block; margin-top:14px; font-size:13px; border-bottom:1px solid var(--ink); padding-bottom:4px; }
.featured-stamp { position:absolute; right:10%; top:23%; z-index:1; width:120px; height:120px; display:grid; place-items:center; border:1px solid rgba(36,66,99,.5); border-radius:50%; color:#355b80; font-family:Fraunces,Georgia,serif; font-size:20px; line-height:1; text-align:center; transform:rotate(12deg); opacity:.7; }
.section-heading { display:flex; justify-content:space-between; align-items:end; gap:30px; }
.section-heading h2 { font-size:clamp(2.5rem,4.8vw,4.4rem); margin:19px 0 0; }
.search-form { min-width:250px; margin-bottom:6px; }
.search-form label { display:block; margin-bottom:8px; color:var(--muted); font-family:'DM Mono',monospace; font-size:10px; letter-spacing:.1em; }
.search-input { display:flex; align-items:center; border-bottom:1px solid var(--ink); }
.search-input input { width:100%; padding:10px 0; border:0; outline:0; color:var(--ink); background:transparent; }
.search-input input::placeholder { color:#a1a6a7; }
.search-input button { border:0; background:none; color:var(--blue); font-size:20px; }
.filter-row { display:flex; gap:8px; margin-top:34px; border-bottom:1px solid var(--line); padding-bottom:13px; }
.filter-chip { padding:7px 13px; border:1px solid var(--line); border-radius:50px; color:var(--muted); font-size:12px; transition:background .5s var(--ease),color .5s var(--ease),border-color .5s var(--ease); }
.filter-chip:hover,.filter-chip.selected { color:#fff; border-color:var(--blue); background:var(--blue); }
.article-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:25px; margin-top:29px; }
.article-card { display:flex; flex-direction:column; min-width:0; overflow:hidden; border:1px solid rgba(32,45,58,.1); border-radius:13px; background:rgba(255,255,255,.33); transition:box-shadow .5s var(--ease); }
.article-card-art { position:relative; height:175px; overflow:hidden; }
.wash-peach { background:radial-gradient(ellipse at 72% 35%,rgba(255,255,255,.85),transparent 35%),radial-gradient(ellipse at 44% 70%,rgba(232,173,145,.9),transparent 66%),#d8e1e4; }
.wash-mint { background:radial-gradient(ellipse at 24% 29%,rgba(255,255,255,.75),transparent 40%),radial-gradient(ellipse at 55% 65%,rgba(154,195,183,.88),transparent 67%),#d6e0d7; }
.wash-rose { background:radial-gradient(ellipse at 80% 22%,rgba(255,255,255,.7),transparent 35%),radial-gradient(ellipse at 46% 66%,rgba(215,150,157,.86),transparent 68%),#e2dcda; }
.wash-sand { background:radial-gradient(ellipse at 24% 70%,rgba(255,255,255,.65),transparent 38%),radial-gradient(ellipse at 60% 47%,rgba(207,180,125,.86),transparent 67%),#e1ded1; }
.article-card-art:after { content:""; position:absolute; width:75%; height:80%; left:13%; top:7%; border:1px solid rgba(35,73,107,.23); border-radius:46% 54% 51% 48%; transform:rotate(-18deg); }
.article-card-art span { position:absolute; z-index:1; top:17px; left:18px; color:#355b80; font-family:'DM Mono',monospace; font-size:11px; }
.article-card-art i { position:absolute; z-index:1; width:100px; height:28px; bottom:24px; right:20px; border-top:1px solid rgba(35,73,107,.44); transform:rotate(-28deg); }
.article-card-body { padding:21px 22px 18px; }
.article-card-body h3 { font-family:Fraunces,Georgia,serif; font-size:25px; margin:15px 0 11px; }
.article-card-body p { min-height:52px; margin-bottom:20px; color:var(--muted); font-size:13px; line-height:1.65; }
.article-footer { display:flex; justify-content:space-between; align-items:center; color:#8b9294; font-family:'DM Mono',monospace; font-size:10px; }
.circle-arrow { display:grid; place-items:center; width:28px; height:28px; border:1px solid var(--line); border-radius:50%; color:var(--blue); font-size:16px; }
.empty-state { margin:30px 0; padding:55px; border:1px dashed var(--line); text-align:center; color:var(--muted); }
.empty-state a { color:var(--blue); border-bottom:1px solid var(--blue); }
.topics-section { padding-bottom:90px; }
.topics-grid { display:grid; grid-template-columns:repeat(3,1fr); margin-top:26px; border-top:1px solid var(--line); }
.topics-grid a { display:flex; flex-direction:column; gap:7px; min-height:160px; padding:23px 20px 18px 0; border-bottom:1px solid var(--line); transition:color .5s var(--ease); }
.topics-grid a + a { padding-left:25px; border-left:1px solid var(--line); }
.topics-grid a:hover { color:var(--blue); }
.topic-number { color:var(--blue); font-family:'DM Mono',monospace; font-size:11px; }
.topics-grid strong { font-family:Fraunces,Georgia,serif; font-size:28px; font-weight:500; }
.topics-grid a > span:last-child { color:var(--muted); font-size:12px; }
.about-section { display:grid; grid-template-columns:.9fr 1.1fr; align-items:center; gap:110px; padding-top:25px; padding-bottom:110px; }
.about-portrait { display:grid; place-items:center; }
.portrait-paper { position:relative; width:min(290px,100%); aspect-ratio:1/1.08; display:grid; place-items:center; background:#e5ded0; border-radius:48% 55% 43% 57% / 52% 44% 56% 48%; color:#31567a; font-family:Fraunces,Georgia,serif; font-size:29px; line-height:1.1; text-align:center; transform:rotate(-6deg); overflow:hidden; }
.portrait-paper:before { content:""; position:absolute; width:160%; height:80%; left:-32%; top:30%; background:radial-gradient(ellipse,rgba(72,111,158,.5),transparent 68%); filter:blur(24px); transform:rotate(-21deg); }
.portrait-paper span { position:relative; z-index:1; }
.portrait-paper i { position:absolute; width:70%; height:50%; bottom:-15%; right:-12%; border:1px solid rgba(49,86,122,.4); border-radius:50%; transform:rotate(18deg); }
.about-copy h2 { margin:20px 0 23px; font-size:clamp(2.6rem,4.4vw,4.25rem); }
.about-copy p { max-width:470px; color:var(--muted); font-size:15px; }
.about-copy .text-link { display:inline-block; margin-top:16px; }
.subscribe-section { padding:73px 0; background:rgba(219,211,193,.43); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.subscribe-inner { display:flex; justify-content:space-between; align-items:end; gap:50px; }
.subscribe-inner h2 { font-size:clamp(2.5rem,4vw,4rem); margin:0 0 14px; }
.subscribe-inner > div > p:last-child { color:var(--muted); margin:0; }
.subscribe-form { width:min(430px,100%); }
.subscribe-form label { display:block; color:var(--muted); font-family:'DM Mono',monospace; font-size:10px; letter-spacing:.1em; margin-bottom:8px; }
.subscribe-form > div { display:flex; gap:9px; }
.subscribe-form input { flex:1; min-width:0; padding:12px 14px; border:1px solid var(--line); border-radius:5px; outline:0; background:rgba(255,255,255,.5); }
.subscribe-form input:focus { border-color:var(--blue); }
.form-message { min-height:20px; margin:9px 0 0; color:var(--blue); font-size:12px; }
.site-footer { padding:43px 0 38px; background:#edf0ec; }
.footer-grid { display:grid; grid-template-columns:1.2fr 1fr .8fr; gap:40px; align-items:end; }
.footer-wordmark { margin-bottom:13px; }
.footer-grid p { color:var(--muted); font-size:12px; }
.footer-links { display:flex; flex-wrap:wrap; gap:11px 22px; align-items:center; }
.footer-links a { color:var(--muted); font-size:12px; border-bottom:1px solid transparent; }
.footer-links a:hover { color:var(--blue); border-color:var(--blue); }
.footer-note { text-align:right; margin:0; }
/* Article */
.article-page { padding:47px 0 95px; }
.article-shell { max-width:980px; }
.back-link { display:inline-block; color:var(--muted); font-size:12px; margin-bottom:47px; transition:color .5s var(--ease); }
.back-link:hover { color:var(--blue); }
.article-header { max-width:780px; }
.article-header h1 { font-size:clamp(3rem,6vw,5.8rem); margin:22px 0 24px; }
.article-excerpt { color:var(--muted); font-size:18px; max-width:640px; line-height:1.75; }
.article-byline { display:flex; gap:12px; align-items:center; margin-top:28px; color:var(--muted); font-size:11px; line-height:1.4; }
.article-byline strong { color:var(--ink); font-weight:600; }
.avatar { display:grid; place-items:center; width:35px; height:35px; border-radius:50%; color:#fff; background:var(--blue); font-family:Fraunces,Georgia,serif; font-size:17px; }
.article-layout { display:grid; grid-template-columns:minmax(0,1fr) 270px; gap:75px; margin-top:67px; align-items:start; }
.prose { max-width:600px; font-family:Georgia,'Times New Roman',serif; font-size:18px; line-height:1.95; }
.prose h2 { margin:0 0 16px; font-size:31px; }
.prose h3 { margin:42px 0 13px; font-family:Fraunces,Georgia,serif; font-size:25px; }
.prose p { margin-bottom:24px; }
.prose blockquote { margin:36px 0; padding:7px 0 7px 24px; border-left:2px solid var(--peach); color:var(--blue-dark); font-family:Fraunces,Georgia,serif; font-size:25px; line-height:1.4; }
.prose ol { padding-left:25px; }
.geo-panel { position:sticky; top:25px; padding:25px 22px 23px; border:1px solid rgba(72,111,158,.2); border-radius:10px; background:rgba(220,229,231,.48); }
.geo-panel h2 { font-size:24px; margin:0 0 14px; }
.geo-panel > p:not(.card-kicker):not(.geo-audience) { color:var(--muted); font-size:13px; line-height:1.7; }
.geo-panel h3 { margin:26px 0 11px; font-family:'DM Sans',Arial,sans-serif; font-size:11px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; }
.geo-panel ul { padding-left:18px; color:var(--ink); font-size:13px; line-height:1.7; }
.geo-audience { margin:24px 0 0; padding-top:18px; border-top:1px solid rgba(32,45,58,.13); color:var(--blue); font-size:11px; }
.faq-section { max-width:600px; margin:72px 0 0; padding-top:31px; border-top:1px solid var(--line); }
.faq-section h2 { margin:0 0 21px; font-size:34px; }
.faq-section details { padding:17px 0; border-top:1px solid var(--line); }
.faq-section details:last-child { border-bottom:1px solid var(--line); }
.faq-section summary { display:flex; justify-content:space-between; gap:20px; cursor:pointer; list-style:none; font-weight:600; font-size:14px; }
.faq-section summary::-webkit-details-marker { display:none; }
.faq-section summary span { color:var(--blue); font-size:19px; font-weight:400; }
.faq-section details p { max-width:520px; margin:13px 0 0; color:var(--muted); font-size:13px; }
.article-end { display:flex; justify-content:space-between; max-width:600px; margin-top:71px; padding-top:18px; border-top:1px solid var(--line); color:var(--muted); font-family:'DM Mono',monospace; font-size:10px; }
.article-end a { color:var(--blue); }
/* Admin */
.admin-body { background:#f4f2ec; }
.admin-topbar { height:72px; padding:0 38px; display:flex; align-items:center; justify-content:space-between; background:var(--paper); border-bottom:1px solid var(--line); }
.admin-topbar > div { display:flex; align-items:center; gap:23px; }
.admin-view-link { color:var(--blue); font-size:12px; }
.inline-form button { padding:0; border:0; background:transparent; color:var(--muted); font-size:12px; }
.admin-layout { display:grid; grid-template-columns:225px minmax(0,1fr); min-height:calc(100vh - 72px); }
.admin-sidebar { padding:34px 23px; background:#eceee9; border-right:1px solid var(--line); }
.admin-eyebrow { margin:0 0 23px 12px; }
.admin-sidebar nav { display:grid; gap:4px; }
.admin-sidebar nav a { display:flex; justify-content:space-between; padding:11px 12px; border-radius:5px; color:var(--muted); font-size:13px; }
.admin-sidebar nav a span { color:#a3aba9; font-family:'DM Mono',monospace; font-size:10px; }
.admin-sidebar nav a.active,.admin-sidebar nav a:hover { color:var(--ink); background:rgba(255,255,255,.58); }
.admin-sidebar nav a.active span { color:var(--blue); }
.sidebar-note { margin:100px 11px 0; padding:15px 0; border-top:1px solid var(--line); color:var(--muted); }
.sidebar-note span { color:var(--peach); font-family:'DM Mono',monospace; font-size:9px; }
.sidebar-note p { margin:8px 0 0; font-family:Fraunces,Georgia,serif; font-size:16px; line-height:1.35; }
.admin-main { width:min(1000px,calc(100% - 64px)); padding:63px 0 95px; margin:0 auto; }
.admin-heading { display:flex; justify-content:space-between; align-items:end; gap:20px; margin-bottom:48px; }
.admin-heading h1 { margin:0 0 11px; font-size:47px; }
.admin-heading p:last-child { margin:0; color:var(--muted); font-size:14px; }
.admin-stats { display:grid; grid-template-columns:repeat(auto-fit, minmax(210px, 1fr)); border-top:1px solid var(--line); border-bottom:1px solid var(--line); margin-bottom:61px; }
.admin-stats > div { padding:20px 23px 23px 0; }
.admin-stats > div + div { padding-left:23px; border-left:1px solid var(--line); }
.admin-stats span,.admin-stats small { display:block; color:var(--muted); font-size:11px; }
.admin-stats strong { display:block; margin:10px 0 2px; font-family:Fraunces,Georgia,serif; font-size:39px; font-weight:500; }
.admin-stats small { color:var(--blue); font-family:'DM Mono',monospace; font-size:10px; }
.dashboard-section .section-heading { margin-bottom:20px; }
.dashboard-section .section-heading h2 { margin-top:8px; font-size:31px; }
.admin-table { border-top:1px solid var(--line); }
.admin-table > a { display:grid; grid-template-columns:40px minmax(0,1fr) auto 24px; align-items:center; gap:17px; min-height:75px; padding:12px 0; border-bottom:1px solid var(--line); }
.admin-table > a:hover strong { color:var(--blue); }
.table-index { color:var(--blue); font-family:'DM Mono',monospace; font-size:10px; }
.admin-table strong,.admin-table small { display:block; }
.admin-table strong { font-family:Fraunces,Georgia,serif; font-size:19px; font-weight:500; transition:color .5s var(--ease); }
.admin-table small { margin-top:2px; color:var(--muted); font-size:11px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.status-pill { padding:4px 9px; border-radius:50px; color:#577667; background:rgba(174,199,187,.3); font-family:'DM Mono',monospace; font-size:9px; }
.admin-table > a > span:last-child { color:var(--blue); }
.quick-links { display:grid; grid-template-columns:1fr 1fr; gap:17px; margin-top:45px; }
.quick-links a { display:grid; grid-template-columns:29px 1fr; column-gap:12px; padding:18px; border:1px solid var(--line); border-radius:7px; background:rgba(255,255,255,.27); }
.quick-links a > span { grid-row:span 2; display:grid; place-items:center; width:29px; height:29px; border:1px solid var(--blue); border-radius:50%; color:var(--blue); }
.quick-links strong { font-family:Fraunces,Georgia,serif; font-size:19px; font-weight:500; }
.quick-links small { color:var(--muted); font-size:11px; }
.save-banner { margin:-24px 0 35px; padding:12px 15px; border:1px solid rgba(72,111,158,.22); border-radius:5px; color:var(--blue-dark); background:rgba(174,199,187,.25); font-size:12px; }
.placeholder-panel { max-width:700px; padding:52px 40px; border:1px dashed var(--line); border-radius:8px; background:rgba(255,255,255,.32); }
.placeholder-icon { display:grid; place-items:center; width:44px; height:44px; margin-bottom:22px; border:1px solid var(--blue); border-radius:50%; color:var(--blue); font-family:Fraunces,Georgia,serif; font-size:23px; }
.placeholder-panel h2 { margin:0 0 12px; font-size:31px; }
.placeholder-panel p { max-width:500px; margin-bottom:25px; color:var(--muted); font-size:13px; }
.settings-form { max-width:760px; }
.settings-form section { padding:31px 0 37px; border-top:1px solid var(--line); }
.form-section-heading { display:flex; gap:17px; margin-bottom:27px; }
.form-section-heading > span { color:var(--blue); font-family:'DM Mono',monospace; font-size:11px; }
.form-section-heading h2 { margin:0 0 7px; font-size:28px; }
.form-section-heading p { margin:0; color:var(--muted); font-size:12px; }
.settings-form label { display:block; margin:15px 0 7px; color:var(--muted); font-size:11px; }
.settings-form input,.settings-form textarea { width:100%; padding:11px 13px; border:1px solid var(--line); border-radius:4px; outline:0; color:var(--ink); background:rgba(255,255,255,.55); resize:vertical; }
.settings-form input:focus,.settings-form textarea:focus { border-color:var(--blue); box-shadow:0 0 0 3px rgba(72,111,158,.1); }
.preview-snippet { margin-top:22px; padding:17px; border:1px solid rgba(72,111,158,.19); border-radius:6px; background:rgba(255,255,255,.47); }
.preview-snippet span { display:block; color:#5c876d; font-size:11px; }
.preview-snippet strong { display:block; margin:7px 0 4px; color:#315b9a; font-size:17px; font-weight:500; }
.preview-snippet p { margin:0; color:var(--muted); font-size:12px; }
.geo-check { display:flex; gap:12px; align-items:flex-start; margin-top:24px; padding:15px; border:1px solid rgba(174,199,187,.6); border-radius:5px; background:rgba(174,199,187,.16); }
.geo-check > span { color:#577667; }
.geo-check strong { font-size:12px; }
.geo-check p { margin:3px 0 0; color:var(--muted); font-size:11px; }
/* Login and 404 */
.login-body { display:grid; min-height:100vh; place-items:center; overflow:hidden; }
.login-wash { position:fixed; width:700px; height:600px; right:-190px; bottom:-170px; opacity:.7; filter:blur(30px); transform:rotate(-22deg); }
.login-card { position:relative; width:min(430px,calc(100% - 40px)); padding:48px 44px; border:1px solid var(--line); border-radius:10px; background:rgba(255,255,255,.6); box-shadow:0 22px 80px rgba(32,45,58,.08); }
.login-card .wordmark { margin-bottom:74px; }
.login-card h1 { margin:0 0 11px; font-size:49px; }
.login-card > p:not(.eyebrow) { margin-bottom:27px; color:var(--muted); font-size:13px; }
.login-card form { display:grid; gap:7px; }
.login-card label { color:var(--muted); font-size:11px; }
.login-card input { margin-bottom:9px; padding:12px 13px; border:1px solid var(--line); border-radius:4px; outline:0; background:rgba(255,255,255,.65); }
.login-card input:focus { border-color:var(--blue); }
.login-card button { margin-top:12px; }
.login-card .back-link { margin-top:31px; margin-bottom:0; }
.form-error { margin-bottom:16px; padding:9px 11px; color:#9a5253; border:1px solid rgba(217,153,155,.45); border-radius:4px; background:rgba(217,153,155,.15); font-size:12px; }
.not-found { min-height:620px; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; }
.not-found h1 { margin:0 0 31px; font-size:clamp(3.2rem,7vw,6.4rem); }
@media (max-width:900px) { .container { width:min(100% - 42px,720px); } .desktop-nav { gap:17px; margin-right:16px; } .hero-section { gap:30px; } .hero-copy h1 { font-size:clamp(3.3rem,8vw,5.2rem); } .article-layout { gap:38px; } .about-section { gap:60px; } }
@media (max-width:700px) { .container { width:calc(100% - 36px); } .nav-wrap { height:72px; } .desktop-nav { display:none; } .menu-button { display:grid; } .mobile-nav { display:none; flex-wrap:wrap; gap:12px 24px; padding-bottom:17px; } .mobile-nav.is-open { display:flex; } .mobile-nav a { width:calc(50% - 12px); color:var(--muted); font-size:13px; } .hero-section { display:flex; flex-direction:column; align-items:stretch; min-height:0; gap:34px; padding-top:58px; padding-bottom:60px; } .hero-copy h1 { font-size:clamp(3rem,14vw,4.4rem); } .hero-art { height:270px; width:83%; align-self:flex-end; } .featured-section,.latest-section,.topics-section { padding-top:58px; } .featured-card { display:block; min-height:390px; padding:24px; } .featured-meta { flex-wrap:wrap; gap:8px 15px; } .featured-content { margin-top:130px; } .featured-content h2 { font-size:2.55rem; } .featured-stamp { top:105px; right:17%; width:93px; height:93px; font-size:16px; } .section-heading { display:block; } .search-form { margin-top:30px; } .article-grid { grid-template-columns:1fr; gap:17px; } .article-card-art { height:140px; } .topics-grid { grid-template-columns:1fr; } .topics-grid a,.topics-grid a + a { min-height:112px; padding:18px 0; border-left:0; } .about-section { grid-template-columns:1fr; gap:46px; padding-top:0; padding-bottom:70px; } .about-portrait { justify-content:start; } .portrait-paper { width:230px; } .subscribe-inner { display:block; } .subscribe-form { margin-top:31px; } .footer-grid { grid-template-columns:1fr; gap:25px; } .footer-note { text-align:left; } .article-page { padding-top:32px; } .back-link { margin-bottom:33px; } .article-header h1 { font-size:3.1rem; } .article-excerpt { font-size:16px; } .article-layout { display:flex; flex-direction:column; gap:39px; margin-top:48px; } .prose { font-size:17px; } .geo-panel { position:static; width:100%; } .faq-section { margin-top:50px; } .admin-topbar { height:62px; padding:0 18px; } .admin-layout { display:block; } .admin-sidebar { padding:13px 18px; border-right:0; border-bottom:1px solid var(--line); } .admin-sidebar .admin-eyebrow,.sidebar-note { display:none; } .admin-sidebar nav { display:flex; overflow:auto; gap:5px; } .admin-sidebar nav a { white-space:nowrap; padding:8px 10px; } .admin-main { width:calc(100% - 36px); padding:39px 0 70px; } .admin-heading { display:block; margin-bottom:34px; } .admin-heading .button { margin-top:22px; } .admin-heading h1 { font-size:40px; } .admin-stats { margin-bottom:45px; } .admin-stats > div { padding:15px 8px 17px 0; } .admin-stats > div + div { padding-left:8px; } .admin-stats strong { font-size:28px; } .admin-stats span { min-height:34px; } .admin-table > a { grid-template-columns:24px minmax(0,1fr) 24px; gap:10px; } .admin-table .status-pill { display:none; } .quick-links { grid-template-columns:1fr; } .settings-form section { padding-top:25px; } .login-card { padding:34px 27px; } .login-card .wordmark { margin-bottom:56px; } }
@media (prefers-reduced-motion:reduce) { *,*:before,*:after { scroll-behavior:auto !important; transition-duration:.01ms !important; animation-duration:.01ms !important; } }

/* Poetize visual system */
:root { --poet-bg:#eef7fa; --poet-card:rgba(255,255,255,.72); --poet-ink:#263747; --poet-muted:#71828e; --poet-coral:#ff725b; --poet-mint:#73c7bd; --poet-blue:#68add5; --poet-yellow:#f2cf70; }
body { background:var(--poet-bg); color:var(--poet-ink); }
body:before { opacity:.35; }
.site-header { display:none; }
.poetize-toolbar { position:fixed; inset:0 0 auto; z-index:50; height:74px; color:#fff; background:rgba(28,40,48,.78); backdrop-filter:blur(14px); }
.poetize-toolbar-inner { width:min(1280px,calc(100% - 56px)); height:74px; margin:auto; display:flex; align-items:center; gap:28px; }
.poetize-brand { color:#fff; display:flex; align-items:center; gap:10px; flex-shrink:0; font-size:20px; font-weight:700; letter-spacing:.04em; }
.poetize-brand-mark { display:grid; place-items:center; width:31px; height:31px; border:1px solid rgba(255,255,255,.7); border-radius:50%; font-family:Georgia,serif; font-size:21px; }
.poetize-nav { margin-left:auto; display:flex; gap:7px; align-items:center; }
.poetize-nav a { display:flex; align-items:center; gap:6px; padding:11px 9px; color:rgba(255,255,255,.9); border-radius:9px; font-size:13px; transition:background .25s ease,color .25s ease; }
.poetize-nav a:hover,.poetize-nav a.active { color:#fff; background:rgba(255,255,255,.16); }
.poetize-nav a span { font-size:16px; }
.poetize-toolbar-actions { display:flex; gap:8px; margin-left:8px; }
.poetize-toolbar .icon-button { width:36px; height:36px; color:#fff; border-color:rgba(255,255,255,.3); }
.poetize-toolbar .menu-button { display:none; }
.poetize-mobile-nav { display:none; }
.poetize-home { padding-top:0; }
.poetize-hero { min-height:620px; position:relative; display:grid; place-items:center; overflow:hidden; background-image:var(--hero-image); background-size:cover; background-position:center; }
.poetize-hero-overlay { position:absolute; inset:0; background:linear-gradient(180deg,rgba(12,27,37,.4),rgba(25,54,63,.16) 55%,rgba(238,247,250,.96) 100%); }
.poetize-hero-copy { position:relative; z-index:1; width:min(700px,calc(100% - 36px)); padding:110px 18px 95px; color:#fff; text-align:center; }
.poetize-kicker { margin:0 0 15px; color:rgba(255,255,255,.86); font-family:'DM Mono',monospace; font-size:10px; letter-spacing:.14em; }
.poetize-kicker.dark { color:var(--poet-coral); }
.poetize-hero h1 { margin:0 0 18px; font-family:Fraunces,Georgia,serif; font-size:76px; letter-spacing:.02em; text-shadow:0 4px 26px rgba(0,0,0,.2); }
.poetize-hero-copy > p:not(.poetize-kicker) { margin:0 auto 27px; font-family:Fraunces,Georgia,serif; font-size:24px; line-height:1.45; }
.poetize-hero-copy > p span { font-family:'DM Sans',sans-serif; font-size:14px; opacity:.9; }
.poetize-search { width:min(580px,100%); min-height:48px; margin:0 auto; display:flex; align-items:center; padding:0 16px; border:1px solid rgba(255,255,255,.34); border-radius:28px; background:rgba(26,39,47,.54); backdrop-filter:blur(10px); }
.poetize-search span { font-size:21px; }
.poetize-search input { flex:1; min-width:0; padding:0 12px; border:0; outline:0; color:#fff; background:transparent; }
.poetize-search input::placeholder { color:rgba(255,255,255,.8); }
.poetize-search button { border:0; color:#fff; background:transparent; font-size:20px; }
.hero-scroll { position:absolute; z-index:2; left:50%; bottom:40px; color:#fff; font-size:27px; animation:poetize-bob 2.5s ease-in-out infinite; }
@keyframes poetize-bob { 50% { transform:translateY(7px); } }
.poetize-portals { position:relative; z-index:3; margin-top:-61px; display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.portal-card { min-height:118px; padding:18px 17px; display:flex; align-items:center; gap:13px; border:1px solid rgba(255,255,255,.72); border-radius:12px; background:var(--poet-card); box-shadow:0 13px 30px rgba(33,87,105,.11); transition:box-shadow .25s ease,transform .25s ease; }
.portal-card:hover { box-shadow:0 18px 40px rgba(33,87,105,.18); transform:translateY(-2px); }
.portal-icon { display:grid; place-items:center; width:47px; height:47px; flex-shrink:0; border-radius:50%; background:rgba(255,255,255,.65); font-size:25px; }
.portal-card > span:nth-child(2) { display:flex; flex-direction:column; }
.portal-card strong { font-family:Fraunces,Georgia,serif; font-size:20px; }
.portal-card small { margin-top:3px; color:var(--poet-muted); font-size:11px; }
.portal-card b { margin-left:auto; align-self:flex-start; color:var(--poet-coral); font-size:18px; }
.portal-mint { border-top:3px solid var(--poet-mint); } .portal-blue { border-top:3px solid var(--poet-blue); } .portal-yellow { border-top:3px solid var(--poet-yellow); } .portal-coral { border-top:3px solid var(--poet-coral); }
.poetize-main { display:grid; grid-template-columns:245px minmax(0,1fr); gap:37px; padding-top:72px; padding-bottom:75px; }
.poetize-aside { align-self:start; position:sticky; top:100px; }
.aside-profile { display:flex; gap:11px; align-items:center; padding:15px; border:1px solid rgba(55,103,120,.13); border-radius:12px; background:rgba(255,255,255,.55); }
.aside-profile img { width:47px; height:47px; object-fit:cover; border:3px solid #fff; border-radius:50%; box-shadow:0 5px 16px rgba(40,84,100,.14); }
.aside-profile strong,.aside-profile small { display:block; } .aside-profile strong { font-size:14px; } .aside-profile small { color:var(--poet-muted); font-size:11px; }
.aside-block { margin-top:22px; padding-top:17px; border-top:1px solid rgba(55,103,120,.14); }
.aside-title { margin-bottom:10px; color:var(--poet-coral); font-size:12px; font-weight:700; letter-spacing:.1em; }
.aside-title span { margin-right:7px; }
.aside-block a { display:flex; justify-content:space-between; padding:8px 4px; color:var(--poet-muted); border-radius:5px; font-size:13px; }
.aside-block a:hover { color:var(--poet-ink); background:rgba(255,255,255,.7); } .aside-block a b { color:var(--poet-blue); font-weight:400; }
.aside-notice p { padding-left:4px; color:var(--poet-muted); font-size:12px; line-height:1.65; }
.poetize-section-head { display:flex; justify-content:space-between; align-items:end; gap:18px; padding-bottom:13px; border-bottom:1px solid rgba(55,103,120,.18); }
.poetize-section-head h2 { margin:0; font-family:Fraunces,Georgia,serif; font-size:37px; }
.poetize-feed-tabs { display:flex; gap:7px; } .poetize-feed-tabs a,.poetize-filter-row a { padding:7px 12px; color:var(--poet-muted); border-radius:20px; font-size:11px; }
.poetize-feed-tabs a.active,.poetize-feed-tabs a:hover,.poetize-filter-row a.selected,.poetize-filter-row a:hover { color:#fff; background:var(--poet-coral); }
.poetize-filter-row { display:flex; flex-wrap:wrap; gap:6px; padding:14px 0 18px; }
.poetize-article-list { display:grid; gap:18px; }
.poetize-post { display:grid; grid-template-columns:39% 1fr; min-height:194px; overflow:hidden; border:1px solid rgba(55,103,120,.13); border-radius:12px; background:rgba(255,255,255,.62); box-shadow:0 8px 20px rgba(55,103,120,.06); transition:box-shadow .25s ease; }
.poetize-post:hover { box-shadow:0 16px 32px rgba(55,103,120,.14); } .poetize-post.post-reverse { grid-template-columns:1fr 39%; } .poetize-post.post-reverse .post-cover { order:2; }
.post-cover { min-height:194px; position:relative; background-image:var(--post-image),radial-gradient(circle at 60% 40%,rgba(255,255,255,.3),transparent 55%); background-position:center; background-size:cover; }
.post-cover-shade { position:absolute; inset:0; background:linear-gradient(180deg,transparent 30%,rgba(17,40,49,.4)); } .post-index { position:absolute; z-index:1; top:14px; left:15px; color:#fff; font-family:'DM Mono',monospace; font-size:11px; }
.post-body { display:flex; flex-direction:column; justify-content:center; padding:25px 27px; } .post-meta { display:flex; gap:16px; color:var(--poet-muted); font-family:'DM Mono',monospace; font-size:10px; } .post-meta span:last-child { color:var(--poet-coral); }
.post-body h3 { margin:14px 0 10px; font-family:Fraunces,Georgia,serif; font-size:27px; } .post-body p { margin:0; color:var(--poet-muted); font-size:13px; line-height:1.7; }
.post-footer { display:flex; justify-content:space-between; gap:10px; margin-top:20px; color:#9ba7ad; font-family:'DM Mono',monospace; font-size:10px; } .post-more { color:var(--poet-blue); }
.poetize-lower { display:grid; grid-template-columns:1fr 1.35fr; gap:60px; padding-top:70px; padding-bottom:92px; border-top:1px solid rgba(55,103,120,.14); }
.poetize-lower h2 { margin:14px 0 0; font-family:Fraunces,Georgia,serif; font-size:44px; } .poetize-lower h2 em { color:var(--poet-coral); font-style:italic; }
.archive-links { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; } .archive-links a { display:flex; flex-direction:column; gap:7px; min-height:140px; padding:17px 13px; border:1px solid rgba(55,103,120,.13); border-radius:10px; background:rgba(255,255,255,.58); transition:box-shadow .25s ease; } .archive-links a:hover { box-shadow:0 13px 24px rgba(55,103,120,.13); }
.archive-links a > span { font-size:25px; } .archive-links strong { font-family:Fraunces,Georgia,serif; font-size:19px; } .archive-links small { color:var(--poet-muted); font-size:11px; line-height:1.45; }
.poetize-float-tools { position:fixed; right:22px; bottom:21px; z-index:20; display:flex; flex-direction:column; gap:9px; } .poetize-float-tools a,.poetize-float-tools button { display:grid; place-items:center; width:38px; height:38px; padding:0; border:1px solid rgba(40,55,65,.16); border-radius:50%; color:var(--poet-ink); background:rgba(255,255,255,.82); box-shadow:0 7px 17px rgba(40,55,65,.1); font-size:18px; } .poetize-float-tools a:hover,.poetize-float-tools button:hover { color:#fff; background:var(--poet-coral); }
.poetize-footer { background:#e2f0f3; }
.section-page { min-height:100vh; padding-top:74px; background:var(--poet-bg); } .section-hero { position:relative; width:min(1200px,calc(100% - 50px)); min-height:285px; margin:25px auto 0; display:flex; align-items:end; overflow:hidden; border-radius:18px; background-size:cover; background-position:center; } .section-hero:before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 15% 25%,rgba(115,199,189,.78),transparent 55%),radial-gradient(circle at 82% 70%,rgba(255,114,91,.72),transparent 55%); mix-blend-mode:multiply; } .section-hero-shade { position:absolute; inset:0; background:linear-gradient(180deg,rgba(17,42,52,.05),rgba(17,42,52,.65)); } .section-hero-copy { position:relative; z-index:1; padding-bottom:34px; color:#fff; } .section-hero-copy h1 { margin:0 0 7px; font-family:Fraunces,Georgia,serif; font-size:54px; } .section-hero-copy > p:last-child { margin:0; font-size:14px; opacity:.9; }
.section-content { padding-top:53px; padding-bottom:95px; } .section-intro-row { display:flex; justify-content:space-between; align-items:end; gap:25px; margin-bottom:24px; } .section-intro-row h2 { margin:0; font-family:Fraunces,Georgia,serif; font-size:37px; } .section-intro-row > span { color:var(--poet-muted); font-size:12px; }
.photo-masonry { columns:2 280px; column-gap:17px; } .photo-masonry figure { break-inside:avoid; margin:0 0 17px; overflow:hidden; border-radius:11px; background:#fff; box-shadow:0 8px 20px rgba(55,103,120,.08); } .photo-masonry img { display:block; width:100%; max-height:390px; object-fit:cover; } .photo-masonry figcaption { padding:10px 13px; color:var(--poet-muted); font-size:11px; }
.resource-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:18px; } .resource-card { display:grid; grid-template-columns:130px 1fr; min-height:145px; overflow:hidden; border:1px solid rgba(55,103,120,.13); border-radius:12px; background:rgba(255,255,255,.7); box-shadow:0 8px 19px rgba(55,103,120,.06); } .resource-card:hover { box-shadow:0 15px 29px rgba(55,103,120,.13); } .resource-card img { width:100%; height:100%; min-height:145px; object-fit:cover; } .resource-card div { padding:20px 17px; } .resource-card h3 { margin:0 0 7px; font-family:Fraunces,Georgia,serif; font-size:22px; } .resource-card p { margin:0 0 14px; color:var(--poet-muted); font-size:12px; } .resource-card span { color:var(--poet-blue); font-size:11px; }
.message-layout,.love-layout,.about-layout { display:grid; grid-template-columns:1fr 1fr; gap:40px; } .message-board,.love-card,.about-hero-card { padding:32px; border:1px solid rgba(55,103,120,.13); border-radius:14px; background:rgba(255,255,255,.68); box-shadow:0 8px 22px rgba(55,103,120,.06); } .message-board h2,.love-card h2,.about-hero-card h2 { margin:0 0 20px; font-family:Fraunces,Georgia,serif; font-size:39px; }
.message-form { display:grid; gap:12px; } .message-form label { display:grid; gap:6px; color:var(--poet-muted); font-size:11px; } .message-form input,.message-form textarea { width:100%; padding:11px 13px; border:1px solid rgba(55,103,120,.17); border-radius:5px; outline:0; background:rgba(255,255,255,.72); resize:vertical; } .message-form input:focus,.message-form textarea:focus { border-color:var(--poet-blue); }
.message-sample { display:grid; gap:15px; align-content:start; } .message-sample article { padding:20px 21px; border:1px solid rgba(55,103,120,.13); border-radius:10px; background:rgba(255,255,255,.5); } .message-sample span { color:var(--poet-coral); font-family:'DM Mono',monospace; font-size:10px; } .message-sample p { margin:10px 0 0; color:var(--poet-muted); font-size:14px; }
.love-layout { align-items:center; } .love-card { position:relative; overflow:hidden; background:linear-gradient(135deg,rgba(255,255,255,.72),rgba(255,224,214,.65)); } .love-symbol { display:block; margin-bottom:18px; color:var(--poet-coral); font-size:42px; } .love-card p:last-child { max-width:390px; color:var(--poet-muted); } .love-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:13px; } .love-grid div { display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:145px; border:1px solid rgba(55,103,120,.13); border-radius:11px; background:rgba(255,255,255,.55); } .love-grid strong { color:var(--poet-coral); font-family:Fraunces,Georgia,serif; font-size:40px; font-weight:500; } .love-grid span { color:var(--poet-muted); font-size:11px; text-align:center; }
.about-hero-card { display:grid; grid-template-columns:220px 1fr; gap:32px; align-items:center; } .about-hero-card img { width:220px; height:250px; object-fit:cover; border-radius:13px; } .about-hero-card p:not(.poetize-kicker) { color:var(--poet-muted); font-size:14px; line-height:1.75; }
.poetize-float-tools button[hidden] { display:none; }
body.poetize-night { --poet-bg:#182932; --poet-card:rgba(38,58,67,.86); --poet-ink:#edf6f4; --poet-muted:#b0c1c1; }
body.poetize-night .aside-profile,body.poetize-night .poetize-post,body.poetize-night .archive-links a,body.poetize-night .resource-card,body.poetize-night .message-board,body.poetize-night .love-card,body.poetize-night .about-hero-card,body.poetize-night .message-sample article,body.poetize-night .love-grid div { border-color:rgba(219,242,240,.15); background:rgba(37,59,68,.72); }
body.poetize-night .poetize-footer { background:#14242c; }
@media (max-width:1050px) { .poetize-nav a { padding-inline:6px; font-size:12px; } .poetize-main { grid-template-columns:205px minmax(0,1fr); } }
@media (max-width:760px) { .poetize-toolbar { height:auto; } .poetize-toolbar-inner { width:calc(100% - 30px); height:66px; } .poetize-nav { display:none; } .poetize-toolbar .menu-button { display:grid; width:36px; height:36px; border-color:rgba(255,255,255,.3); } .poetize-mobile-nav { display:none; grid-template-columns:repeat(2,1fr); gap:4px 15px; padding:10px 15px 15px; background:rgba(28,40,48,.94); } .poetize-mobile-nav.is-open { display:grid; } .poetize-mobile-nav a { padding:7px 0; color:#fff; font-size:13px; } .poetize-hero { min-height:570px; } .poetize-hero h1 { font-size:53px; } .poetize-hero-copy > p:not(.poetize-kicker) { font-size:20px; } .poetize-portals { grid-template-columns:1fr 1fr; margin-top:-45px; gap:10px; } .portal-card { min-height:106px; padding:13px 11px; gap:8px; } .portal-icon { width:37px; height:37px; font-size:20px; } .portal-card strong { font-size:16px; } .portal-card small { font-size:10px; } .poetize-main { display:block; padding-top:46px; } .poetize-aside { position:static; margin-bottom:35px; } .aside-block { display:none; } .aside-profile { width:max-content; } .poetize-section-head h2 { font-size:31px; } .poetize-post,.poetize-post.post-reverse { display:flex; flex-direction:column; } .poetize-post.post-reverse .post-cover { order:0; } .post-cover { min-height:190px; } .post-body { padding:21px 20px 22px; } .post-body h3 { font-size:24px; } .poetize-lower { display:block; padding-top:55px; padding-bottom:65px; } .poetize-lower h2 { font-size:37px; margin-bottom:24px; } .archive-links { grid-template-columns:1fr; } .section-page { padding-top:66px; } .section-hero { width:calc(100% - 24px); min-height:250px; margin-top:15px; } .section-hero-copy h1 { font-size:45px; } .section-content { padding-top:38px; } .section-intro-row { display:block; } .section-intro-row > span { display:block; margin-top:8px; } .resource-grid { grid-template-columns:1fr; } .message-layout,.love-layout,.about-layout { grid-template-columns:1fr; gap:18px; } .about-hero-card { grid-template-columns:1fr; } .about-hero-card img { width:100%; height:280px; } .love-grid { order:-1; } .site-footer .footer-grid { display:block; } .site-footer .footer-links { margin:19px 0; } .footer-note { text-align:left; } }

/* ---------- 后台扩展：安装向导 / 全量管理 ---------- */
.admin-mode-tag { display:inline-block; margin-right:14px; padding:4px 10px; border:1px solid var(--line); border-radius:999px; color:var(--blue); font-family:'DM Mono',monospace; font-size:10px; letter-spacing:.08em; }
.admin-banner { padding:11px 24px; color:#7a4a12; background:#fdf1de; border-bottom:1px solid #f0dcbc; font-size:13px; }
.admin-banner a { color:var(--blue); font-weight:600; border-bottom:1px solid currentColor; }
.admin-panel { margin-bottom:26px; padding:24px; border:1px solid var(--line); border-radius:10px; background:#fff; }
.admin-panel h3 { margin:0 0 14px; font-size:16px; }
.inline-grid { display:grid; grid-template-columns:1fr 1fr 1.4fr auto; gap:12px; align-items:end; }
.inline-grid label { display:grid; gap:6px; color:var(--muted); font-size:11px; }
.inline-grid input { padding:9px 11px; border:1px solid var(--line); border-radius:6px; outline:0; }
.inline-grid input:focus { border-color:var(--blue); }
.admin-table-row { display:flex; align-items:center; gap:14px; padding:13px 6px; border-bottom:1px solid var(--line); }
.admin-table-row:last-child { border-bottom:0; }
.admin-table-row.slim { font-size:12px; color:var(--muted); }
.admin-table-row.row-split { justify-content:space-between; flex-wrap:wrap; }
.admin-table-link { display:flex; align-items:center; gap:14px; flex:1; min-width:0; }
.row-form { display:flex; align-items:center; gap:14px; flex:1; min-width:0; flex-wrap:wrap; }
.row-fields { display:flex; gap:10px; flex:1; min-width:0; flex-wrap:wrap; }
.row-fields input { flex:1 1 130px; min-width:110px; padding:8px 10px; border:1px solid var(--line); border-radius:6px; outline:0; font-size:13px; }
.row-fields input:focus { border-color:var(--blue); }
.table-actions { display:flex; align-items:center; gap:8px; }
.table-actions form { margin:0; }
.table-meta { color:var(--muted); font-family:'DM Mono',monospace; font-size:10px; white-space:nowrap; }
.table-meta.wide { flex:1; }
.button-light { border-color:var(--line); color:var(--ink); background:#fff; }
.button-light:hover { border-color:var(--blue); color:var(--blue); }
.button-danger { background:#fdf0ee; color:#b4503f; border:1px solid #ecd2cc; }
.button-danger:hover { background:#b4503f; color:#fff; }
.status-draft { background:#fdf1de; color:#7a4a12; }
.featured-mark { display:inline-block; margin-left:6px; padding:1px 7px; border-radius:999px; background:var(--peach); color:#5c3a24; font-size:10px; font-style:normal; }
.message-cell { flex:1; min-width:0; }
.message-cell strong { font-size:14px; }
.message-cell small { margin-left:10px; color:var(--muted); font-family:'DM Mono',monospace; font-size:10px; }
.message-cell p { margin:6px 0 0; color:var(--muted); font-size:13px; overflow-wrap:anywhere; }
.message-cell.is-hidden { opacity:.55; }
.log-cell { flex:1; min-width:0; }
.log-cell strong { font-size:13px; }
.log-cell small { display:block; margin-top:3px; color:var(--muted); font-family:'DM Mono',monospace; font-size:10px; }
.tag-cloud { display:flex; flex-wrap:wrap; gap:10px; }
.tag-chip { display:inline-flex; align-items:center; gap:9px; padding:8px 12px; border:1px solid var(--line); border-radius:999px; background:#fff; font-size:13px; }
.tag-chip small { color:var(--muted); font-family:'DM Mono',monospace; font-size:10px; }
.tag-chip form { margin:0; }
.tag-chip button { padding:0 2px; border:0; background:transparent; color:var(--muted); font-size:14px; line-height:1; }
.tag-chip button:hover { color:#b4503f; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.toggle-row { display:flex; gap:28px; flex-wrap:wrap; }
.settings-form textarea, .settings-form select { width:100%; padding:11px 13px; border:1px solid var(--line); border-radius:6px; outline:0; background:#fff; resize:vertical; }
.settings-form textarea:focus, .settings-form select:focus, .settings-form input:focus { border-color:var(--blue); }
.install-checkbox { display:flex !important; align-items:center; gap:9px; color:var(--muted); font-size:12px; }
.install-checkbox input { width:auto; }
.article-editor textarea[name="content"] { font-family:'DM Mono',monospace; font-size:13px; line-height:1.8; }
.editor-toolbar { display:flex; align-items:center; gap:14px; margin-bottom:10px; }
.editor-toolbar small { color:var(--muted); font-size:11px; }
.editor-preview { margin-top:14px; padding:20px 22px; border:1px dashed var(--line); border-radius:8px; background:#fff; }
.editor-preview-loading { color:var(--muted); font-size:12px; }
.editor-footer { display:flex; align-items:center; gap:18px; margin-top:6px; }
.portal-row { display:grid; grid-template-columns:34px 70px 1fr 1.2fr 1.2fr 100px; gap:10px; align-items:end; margin-bottom:14px; padding:14px; border:1px solid var(--line); border-radius:9px; background:#fff; }
.portal-index { color:var(--blue); font-family:'DM Mono',monospace; font-size:12px; }
.portal-row label { display:grid; gap:5px; color:var(--muted); font-size:10px; }
.portal-row input, .portal-row select { padding:8px 10px; border:1px solid var(--line); border-radius:6px; outline:0; font-size:12px; }
.section-edit { margin-bottom:18px; padding:16px; border:1px solid var(--line); border-radius:9px; background:#fff; }
.section-edit h3 { margin:0 0 12px; font-size:15px; }
/* ---------- 安装向导 ---------- */
.install-body { min-height:100vh; display:grid; place-items:center; padding:40px 18px; background:var(--paper-deep); }
.install-wash { position:fixed; inset:0; z-index:-1; background:radial-gradient(ellipse at 12% 8%,rgba(232,173,145,.28),transparent 34%),radial-gradient(ellipse at 88% 82%,rgba(174,199,187,.3),transparent 38%); }
.install-card { width:min(680px,100%); padding:34px 38px 38px; border:1px solid rgba(32,45,58,.12); border-radius:16px; background:rgba(255,255,255,.86); box-shadow:0 24px 60px rgba(32,45,58,.12); }
.install-head { display:flex; align-items:center; gap:13px; margin-bottom:24px; }
.install-head strong { display:block; font-size:17px; letter-spacing:-.02em; }
.install-head small { color:var(--muted); font-size:12px; }
.install-steps { display:grid; grid-template-columns:repeat(5,1fr); gap:6px; margin:0 0 28px; padding:0; list-style:none; }
.install-steps li { display:flex; flex-direction:column; gap:4px; padding:9px 10px; border:1px solid var(--line); border-radius:8px; color:var(--muted); font-size:11px; }
.install-steps li span { font-family:'DM Mono',monospace; font-size:10px; }
.install-steps li.current { border-color:var(--blue); color:var(--ink); background:rgba(72,111,158,.06); }
.install-steps li.current span { color:var(--blue); }
.install-steps li.done { color:var(--blue); border-color:rgba(72,111,158,.35); }
.install-section h1 { margin:0 0 8px; font-size:31px; }
.install-section > p { margin:0 0 22px; color:var(--muted); font-size:14px; }
.install-section code { padding:2px 7px; border-radius:5px; background:var(--paper-deep); font-family:'DM Mono',monospace; font-size:12px; }
.install-checks { display:grid; gap:10px; margin:0 0 26px; padding:0; list-style:none; }
.install-checks li { display:flex; align-items:center; gap:12px; padding:12px 14px; border:1px solid var(--line); border-radius:9px; background:#fff; }
.install-check-mark { display:grid; place-items:center; width:26px; height:26px; border-radius:50%; font-size:13px; }
.install-check-mark.ok { background:#e4f0e8; color:#2e6b46; }
.install-check-mark.bad { background:#f7e5e1; color:#b4503f; }
.install-checks strong { display:block; font-size:13px; }
.install-checks small { color:var(--muted); font-size:11px; }
.install-actions { display:flex; align-items:center; gap:20px; margin-top:24px; flex-wrap:wrap; }
.install-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px 16px; margin-bottom:18px; }
.install-error { background:#fbe9e5; color:#8f3c2c; }
.install-done { text-align:center; }
.install-done-mark { display:grid; place-items:center; width:56px; height:56px; margin:0 auto 16px; border-radius:50%; background:#e4f0e8; color:#2e6b46; font-size:26px; }
.form-message.is-ok { color:#2e6b46; }
.form-message.is-bad { color:#b4503f; }
.settings-form label { display:grid; gap:7px; margin-bottom:14px; color:var(--muted); font-size:12px; }
@media (max-width:640px) { .install-grid, .form-grid { grid-template-columns:1fr; } .inline-grid { grid-template-columns:1fr; } .portal-row { grid-template-columns:1fr 1fr; } .install-steps { grid-template-columns:repeat(5,minmax(0,1fr)); font-size:9px; } .install-steps li { padding:7px 6px; } }