/* Test edition T-1: IBM Plex Sans Arabic (SIL OFL 1.1, see /fonts/OFL-LICENSE.txt) served from this site so every device shows the same type. */
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-display:swap;font-weight:400;src:url(fonts/plex-arabic-400.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC,U+102E0-102FB,U+10E60-10E7E,U+10EC2-10EC4,U+10EFC-10EFF,U+1EE00-1EE03,U+1EE05-1EE1F,U+1EE21-1EE22,U+1EE24,U+1EE27,U+1EE29-1EE32,U+1EE34-1EE37,U+1EE39,U+1EE3B,U+1EE42,U+1EE47,U+1EE49,U+1EE4B,U+1EE4D-1EE4F,U+1EE51-1EE52,U+1EE54,U+1EE57,U+1EE59,U+1EE5B,U+1EE5D,U+1EE5F,U+1EE61-1EE62,U+1EE64,U+1EE67-1EE6A,U+1EE6C-1EE72,U+1EE74-1EE77,U+1EE79-1EE7C,U+1EE7E,U+1EE80-1EE89,U+1EE8B-1EE9B,U+1EEA1-1EEA3,U+1EEA5-1EEA9,U+1EEAB-1EEBB,U+1EEF0-1EEF1}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-display:swap;font-weight:400;src:url(fonts/plex-latin-400.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-display:swap;font-weight:500;src:url(fonts/plex-arabic-500.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC,U+102E0-102FB,U+10E60-10E7E,U+10EC2-10EC4,U+10EFC-10EFF,U+1EE00-1EE03,U+1EE05-1EE1F,U+1EE21-1EE22,U+1EE24,U+1EE27,U+1EE29-1EE32,U+1EE34-1EE37,U+1EE39,U+1EE3B,U+1EE42,U+1EE47,U+1EE49,U+1EE4B,U+1EE4D-1EE4F,U+1EE51-1EE52,U+1EE54,U+1EE57,U+1EE59,U+1EE5B,U+1EE5D,U+1EE5F,U+1EE61-1EE62,U+1EE64,U+1EE67-1EE6A,U+1EE6C-1EE72,U+1EE74-1EE77,U+1EE79-1EE7C,U+1EE7E,U+1EE80-1EE89,U+1EE8B-1EE9B,U+1EEA1-1EEA3,U+1EEA5-1EEA9,U+1EEAB-1EEBB,U+1EEF0-1EEF1}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-display:swap;font-weight:500;src:url(fonts/plex-latin-500.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-display:swap;font-weight:700;src:url(fonts/plex-arabic-700.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC,U+102E0-102FB,U+10E60-10E7E,U+10EC2-10EC4,U+10EFC-10EFF,U+1EE00-1EE03,U+1EE05-1EE1F,U+1EE21-1EE22,U+1EE24,U+1EE27,U+1EE29-1EE32,U+1EE34-1EE37,U+1EE39,U+1EE3B,U+1EE42,U+1EE47,U+1EE49,U+1EE4B,U+1EE4D-1EE4F,U+1EE51-1EE52,U+1EE54,U+1EE57,U+1EE59,U+1EE5B,U+1EE5D,U+1EE5F,U+1EE61-1EE62,U+1EE64,U+1EE67-1EE6A,U+1EE6C-1EE72,U+1EE74-1EE77,U+1EE79-1EE7C,U+1EE7E,U+1EE80-1EE89,U+1EE8B-1EE9B,U+1EEA1-1EEA3,U+1EEA5-1EEA9,U+1EEAB-1EEBB,U+1EEF0-1EEF1}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-display:swap;font-weight:700;src:url(fonts/plex-latin-700.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
/* D-109: blue sampled from public Peoplense logo; near-white magazine paper. Local assets only. */
:root{color-scheme:light;--paper:#faf9f6;--surface:#fff;--navy:#17365c;--ink:#202b38;--muted:#536171;--brand:#1d6ee3;--accent:#175fc7;--divider:#d9dfe6;--control:#67778b;--soft:#edf3fd;--warm:#f0eee8;--radius:14px;--max:1184px;--reading:704px;--font:"IBM Plex Sans Arabic","Dubai","Segoe UI",Tahoma,Arial,sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:24px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font);font-size:18px;line-height:1.85}
html[lang=en]{--font:"IBM Plex Sans Arabic","Segoe UI",Arial,sans-serif}
button,input,select{font:inherit}
button,a,input,select{-webkit-tap-highlight-color:transparent}
button{cursor:pointer}
button:disabled{cursor:not-allowed}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:.25em}
a:hover{color:var(--accent)}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid var(--accent);outline-offset:4px}
h1,h2,h3,h4,p{margin-block-start:0}
h1,h2,h3,h4{font-weight:700;line-height:1.5;color:var(--navy)}
h1{font-size:clamp(2rem,3.5vw,3rem);letter-spacing:0;margin-block-end:24px}
h2{font-size:clamp(1.55rem,2.6vw,1.9rem);margin-block-end:18px}
h3{font-size:1.35rem;margin-block-end:12px}
p{margin-block-end:20px}
h1:focus,h2:focus,main:focus{outline:none}
svg{max-width:100%;display:block}
img{max-width:100%;height:auto}
[hidden]{display:none!important}
.shell{width:min(calc(100% - 80px),var(--max));margin-inline:auto}
.reading{width:min(100%,var(--reading));margin-inline:auto}
.section{padding-block:64px}
.subtle,.meta{color:var(--muted)}
.meta{font-size:14px;display:flex;align-items:center;flex-wrap:wrap;gap:10px 18px}
.eyebrow{font-size:13px;font-weight:700;color:var(--accent);display:block;margin-block-end:18px}
.skip-link{position:fixed;top:8px;inset-inline-start:12px;z-index:100;transform:translateY(-150%);padding:12px 24px;background:var(--navy);color:#fff;border-radius:8px}
.skip-link:focus{transform:translateY(0)}
.demo-ribbon{background:#eff3f8;color:#3d536d;font-size:12px;line-height:1.7;padding:9px 20px;display:flex;justify-content:center;align-items:center;gap:10px;text-align:center;flex-wrap:wrap}
.ribbon-dot{width:6px;height:6px;border-radius:50%;background:var(--navy);flex-shrink:0}
.ribbon-divider{color:#67778b;padding-inline:8px}
.site-header{min-height:108px;border-bottom:1px solid var(--divider);display:flex;align-items:center;gap:30px;justify-content:space-between}
.site-header.shell{padding-block:20px}
.brand{text-decoration:none;color:var(--brand);font-size:29px;font-weight:700;line-height:1.2;display:flex;flex-direction:column;align-items:flex-start;gap:5px;flex-shrink:0}
.brand small,.brand span[lang=en]{font-family:"Segoe UI",Arial,sans-serif;font-size:10px;letter-spacing:3px;font-weight:500}
.nav{display:flex;flex-wrap:wrap;align-items:center;gap:6px 20px;font-size:14px;min-width:0}
.nav-link{padding:10px 0;text-decoration:none;border-bottom:2px solid transparent}
.nav-link[aria-current=page]{color:var(--navy);border-color:var(--accent);font-weight:700}
.header-actions{display:flex;align-items:center;gap:12px;font-size:13px;flex-wrap:wrap}
.header-actions a{text-decoration:none;white-space:nowrap}
.count{display:inline-flex;border:1px solid var(--divider);border-radius:50%;min-width:25px;height:25px;align-items:center;justify-content:center;font-size:12px;margin-inline-start:5px}
.hero{display:grid;grid-template-columns:1.18fr 1fr;align-items:center;gap:72px;padding-block:66px 76px}
.hero-copy{min-width:0}
.hero-copy h1{max-width:660px}
.hero-copy>p:not(.eyebrow){font-size:18px;line-height:1.95;max-width:540px;color:var(--muted);margin-block-end:28px}
.hero-copy .button{margin-block:0 10px;margin-inline-end:8px}
.hero-art{min-height:330px;position:relative;display:flex;align-items:center;justify-content:center;background:var(--soft);border-radius:50% 50% 6px 6px;overflow:hidden;aspect-ratio:1.1}
.hero-art svg{width:100%;height:100%;min-height:310px;color:var(--navy)}
.hero-art text{font-family:Georgia,serif}
.button,button.primary,button.secondary{border:1px solid transparent;border-radius:7px;min-height:46px;display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:11px 23px;font-size:14px;line-height:1.6;text-decoration:none;font-weight:700;transition:background-color .15s,color .15s,border-color .15s;max-width:100%;text-align:center}
.button.primary,button.primary{background:var(--brand);color:#fff}
.button.primary:hover,button.primary:hover{background:#1759b8;color:#fff}
.button.secondary,button.secondary{border-color:var(--control);background:transparent;color:var(--navy)}
.button.secondary:hover{background:var(--soft)}
.button.text{padding-inline:8px;text-decoration:underline;background:transparent;color:var(--navy)}
.button:disabled{background:#e5e9ef;color:#526277;border-color:#67778b;opacity:1}
.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-block-end:28px}
.section-head h2{margin-block-end:8px}
.section-head p{max-width:620px;margin-block-end:0;color:var(--muted)}
.section-head a{flex-shrink:0;font-size:14px}
.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.card{background:var(--surface);border:1px solid var(--divider);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;min-width:0;position:relative}
.card-art{height:190px;display:flex;align-items:center;justify-content:center;background:var(--soft);overflow:hidden;color:var(--navy)}
.card:nth-child(2) .card-art{background:var(--warm)}
.card:nth-child(3) .card-art{background:#e5edf9}
.card-art svg{width:100%;height:100%}
.card-body{padding:26px;display:flex;flex-direction:column;align-items:flex-start;flex:1;gap:13px}
.card h3{font-size:21px;line-height:1.65;margin:0}
.card h3 a{text-decoration:none}
.card h3 a:hover{text-decoration:underline}
.card p{font-size:15px;line-height:1.9;color:var(--muted);margin:0}
.card .meta{margin-top:auto;padding-top:12px;width:100%;justify-content:space-between}
.badge{display:inline-flex;align-items:center;gap:7px;font-size:12px;padding:3px 10px;border-radius:5px;background:var(--soft);color:var(--navy);font-weight:700;max-width:100%;line-height:1.8}
.badge.story{background:#eef1f6;color:#3b536d}
.badge.article{background:#edf3fd;color:#244d80}
.save-button{background:transparent;border:1px solid var(--divider);border-radius:7px;color:var(--navy);padding:7px 12px;min-height:44px;font-size:13px;line-height:1.5}
.save-button:hover,.save-button[aria-pressed=true]{background:var(--soft);border-color:var(--control)}
.toolbar{display:flex;gap:22px;align-items:center;justify-content:space-between;margin-block:30px;flex-wrap:wrap}
.filters{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.filter{border:1px solid var(--divider);border-radius:30px;background:transparent;padding:8px 18px;min-height:44px;color:var(--navy);font-size:14px;line-height:1.7}
.filter:hover{border-color:var(--control)}
.filter[aria-pressed=true],.filter.active{background:var(--brand);border-color:var(--brand);color:white}
.search-field{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:13px;max-width:100%}
.search-field label{color:var(--muted)}
.search-field input,input[type=search]{background:var(--surface);border:1px solid var(--control);border-radius:7px;min-height:46px;padding:10px 14px;color:var(--ink);width:270px;max-width:100%;font-size:14px}
input::placeholder{color:var(--muted);opacity:1}
.catalog-summary{font-size:13px;color:var(--muted);margin-block-end:20px}
.empty-state{padding:48px 24px;text-align:center;border:1px dashed var(--control);border-radius:var(--radius);background:var(--surface);grid-column:1/-1}
.empty-state p{max-width:540px;margin-inline:auto;color:var(--muted)}
.saved-strip{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;background:var(--soft);border-radius:10px;padding:18px 24px;margin-block:24px}
.notice{padding:22px 26px;border-radius:10px;border:1px solid var(--divider);line-height:1.9;font-size:15px;margin-block:24px;background:var(--surface)}
.notice p:last-child{margin-bottom:0}
.notice.soft{background:var(--soft);border-color:transparent;color:var(--navy)}
.notice.warning{background:#fff7df;color:#6b4e10;border-color:#e4cc86}
.panel{padding:32px;background:var(--surface);border:1px solid var(--divider);border-radius:var(--radius);min-width:0}
.panel .eyebrow{margin-bottom:12px}
.panel h2{font-size:25px}
.panel .count{width:auto;height:auto;border:none;font-size:48px;font-family:Georgia,serif;margin-inline:0}
.table-wrap{max-width:100%;overflow-x:auto;margin-block:28px;border-radius:10px;border:1px solid var(--divider)}
.reference-table{border-collapse:collapse;width:100%;font-size:14px;text-align:start;background:var(--surface)}
.reference-table th,.reference-table td{padding:12px 15px;text-align:start;border-bottom:1px solid var(--divider);overflow-wrap:normal}
.reference-table th{font-weight:700;background:var(--soft);color:var(--navy)}
.reference-table tr:last-child td{border-bottom:0}
.reference-table caption{padding:16px;font-weight:700;text-align:start;background:var(--surface)}
.reference-table th:first-child,.reference-table td:first-child{width:52%}
.prose{font-size:18px;line-height:1.95;overflow-wrap:anywhere}
.prose h2{font-size:26px;margin-block:42px 18px;line-height:1.6}
.prose h3{font-size:23px;margin-top:30px}
.prose p{margin-bottom:24px}
.prose ul{padding-inline-start:25px;margin-block:20px 28px}
.prose li{padding-inline-start:5px;margin-block:10px}
.prose a{text-decoration:underline}
.article-header{max-width:880px;padding-block:48px 36px}
.article-header h1{margin-top:20px;line-height:1.6;max-width:860px}
.article-header>p:not(.eyebrow){font-size:20px;line-height:1.9;color:var(--muted);max-width:790px}
.article-layout{display:grid;grid-template-columns:minmax(0,var(--reading)) 240px;justify-content:space-between;gap:54px;align-items:start;padding-bottom:64px}
.reading-aside{font-size:14px;border-block-start:2px solid var(--navy);padding-block-start:20px}
.reading-aside h2{font-size:18px}
.reading-aside p{color:var(--muted)}
.reading-aside .notice{padding:18px;font-size:13px}
.source-note{font-size:14px;color:var(--muted);background:var(--soft);padding:22px;border-radius:10px;line-height:1.9;margin-block:30px}
.breadcrumb{display:flex;gap:9px;flex-wrap:wrap;font-size:13px;color:var(--muted);padding-top:28px}
.breadcrumb a{text-decoration:none}
.stepper{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-block:24px 32px}
.step{padding:14px 18px;border-block-start:2px solid var(--divider);font-size:14px;color:var(--muted)}
.step[aria-current=step],.step.active{border-color:var(--accent);color:var(--navy);font-weight:700}
.choice{display:block;width:100%;text-align:start;background:var(--surface);border:1px solid var(--control);border-radius:10px;padding:15px 18px;min-height:48px;margin-block:12px;color:var(--navy);font-size:15px}
.choice:hover,.choice[aria-pressed=true]{border-color:var(--navy);background:var(--soft)}
.choice[aria-pressed=true]{box-shadow:inset 4px 0 0 var(--navy)}
.site-footer{background:var(--navy);color:#faf9f6;margin-top:48px;padding-block:48px 24px}
.site-footer a{color:inherit}
.site-footer h2,.site-footer h3{color:inherit}
.site-footer .subtle,.site-footer .meta,.site-footer p{color:#dfe9f8}
.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:48px;padding-bottom:30px}
.footer-brand{font-size:27px;font-weight:700;margin-bottom:12px}
.site-footer p{font-size:14px;max-width:400px;line-height:1.9}
.site-footer ul{list-style:none;padding:0;margin:0}
.site-footer li{margin-bottom:12px;font-size:14px}
.site-footer .shell> .subtle{border-top:1px solid #657f9f;padding-top:20px;font-size:12px;margin:0}
.toast{position:fixed;inset-inline-start:50%;bottom:24px;transform:translateX(50%) translateY(30px);padding:14px 24px;border-radius:10px;background:var(--navy);color:white;max-width:min(90vw,580px);box-shadow:0 8px 26px #17365c29;font-size:14px;z-index:50;pointer-events:none;opacity:0;transition:opacity .15s,transform .15s;text-align:center}
.toast.visible,.toast.show,.toast:not(:empty){opacity:1;transform:translateX(50%) translateY(0)}
html[dir=ltr] .toast{transform:translateX(-50%) translateY(0)}
.hero-art .ink{fill:var(--navy)}
.hero-art .paper{fill:var(--paper)}
.hero-art .warm{fill:#86afe9}
button svg,a svg{width:20px;height:20px;flex-shrink:0}
.hero-art svg{width:100%;height:auto}
.card-art svg{width:100%;height:100%}
hr{border:0;border-top:1px solid var(--divider);margin-block:40px}
details{padding:16px 0;border-block-end:1px solid var(--divider)}
summary{cursor:pointer;font-weight:700;color:var(--navy)}
details p{margin-top:15px}
@media(min-width:1440px){.hero{gap:90px}}
@media(max-width:1023px){.shell{width:calc(100% - 48px)}.site-header{gap:20px;flex-wrap:wrap}.nav{order:3;flex-basis:100%;justify-content:center}.hero{gap:35px;padding-block:50px}.hero-art{min-height:270px}.hero-art svg{min-height:240px}.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.grid .card:last-child:nth-child(odd){grid-column:1/-1;max-width:none}.article-layout{grid-template-columns:minmax(0,1fr);gap:24px}.reading-aside{max-width:704px}.article-layout .prose{max-width:704px}.panel{padding:24px}.footer-grid{gap:28px}}
@media(max-width:767px){.shell{width:calc(100% - 32px)}.demo-ribbon{font-size:10px;padding:8px 12px;gap:6px}.ribbon-divider{padding:0}.site-header{min-height:auto;padding-block:22px!important;gap:18px}.brand{font-size:25px}.header-actions{gap:10px;font-size:12px}.nav{gap:4px 16px;justify-content:flex-start;font-size:13px;padding-top:6px}.nav-link{padding-block:6px}.hero{grid-template-columns:minmax(0,1fr);gap:28px;padding-block:40px 48px}.hero-copy>p:not(.eyebrow){font-size:17px}.hero-art{min-height:240px;aspect-ratio:1.7;max-height:290px;border-radius:120px 120px 6px 6px}.hero-art svg{min-height:230px}.hero-copy .button{padding-inline:17px}.section{padding-block:40px}.section-head{align-items:flex-start;flex-direction:column;gap:15px}.section-head h2{font-size:25px}.grid{grid-template-columns:minmax(0,1fr);gap:20px}.card-art{height:170px}.card-body{padding:24px}.card h3{font-size:21px}.toolbar{gap:18px;align-items:stretch}.search-field{width:100%;align-items:stretch}.search-field label{display:block;flex-basis:100%}.search-field input,input[type=search]{width:100%;flex:1;min-width:0}.filters{gap:6px}.filter{padding:7px 14px;font-size:13px}.panel{padding:22px 18px}.article-header{padding-block:30px 22px}.article-header h1{font-size:30px;line-height:1.65}.article-header>p:not(.eyebrow){font-size:18px}.article-layout{gap:32px;padding-bottom:32px}.prose{font-size:18px;line-height:1.95}.prose h2{font-size:24px}.notice{padding:18px;font-size:14px}.stepper{gap:6px}.step{font-size:12px;padding:12px 6px}.footer-grid{grid-template-columns:minmax(0,1fr);gap:20px;padding-bottom:20px}.site-footer{margin-top:32px;padding-top:36px}.site-footer .footer-grid{grid-template-columns:1fr 1fr}.site-footer .footer-grid> :first-child{grid-column:1/-1}.reference-table{font-size:12px}.reference-table th,.reference-table td{padding:10px 9px}.eyebrow{font-size:12px}.saved-strip{padding:16px}.toast{bottom:16px;padding:12px 18px}}
@media(max-width:359px){.shell{width:calc(100% - 24px)}.header-actions{gap:7px}.nav{gap:5px 11px}.hero-copy h1{font-size:30px}.button{padding-inline:15px}.section-head{gap:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

/* Integration layout: the header shell is nested; article art is an inline SVG. */
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:28px;padding-block:22px}
.hero>svg.hero-art{width:100%;height:auto;min-height:0;max-height:390px;border-radius:180px 180px 6px 6px}
.hero-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.issue-topic{font-size:14px!important;border-inline-start:2px solid var(--accent);padding-inline-start:16px;margin-block:20px 28px!important;color:var(--navy)!important}
.card-actions{display:flex;justify-content:space-between;align-items:center;gap:8px;width:100%;flex-wrap:wrap;margin-top:auto;padding-top:5px}
.card-actions .button.text{padding-inline:0;font-size:13px}
.card-actions .save-button{padding-inline:10px;font-size:12px;text-decoration:none}
.invitation{margin-block:48px;padding:38px 42px;background:#f0eee8;border:none}
.invitation h2{max-width:700px}
.invitation p{color:var(--muted);max-width:700px}
.types-grid{margin-bottom:24px}
.types-grid .panel h3{margin-top:16px}
.section.reading{width:min(calc(100% - 48px),var(--reading))}
.aside-item{padding-block:20px;border-bottom:1px solid var(--divider)}
.aside-item h3{font-size:16px;line-height:1.9;margin-top:12px}
.aside-item h3 a{text-decoration:none}
.aside-item h3 a:hover{text-decoration:underline}
.reading-aside{margin-top:60px}
.choice strong,.choice span{display:block}
.choice span{font-size:13px;line-height:1.9;margin-top:8px;color:var(--muted)}
.stepper{list-style:none;padding-inline:0}
.stepper span{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border:1px solid currentColor;border-radius:50%;font-size:12px;margin-inline-end:4px}
.footer-grid>.subtle{grid-column:1/-1;border-top:1px solid #657f9f;padding-top:20px;margin:0;font-size:12px}
.footer-grid>div>a{display:inline-block;margin-block:4px;font-size:14px}
.search-clear{border:0;background:none;color:var(--navy);text-decoration:underline;font-size:13px;min-height:44px;padding:6px}
@media(max-width:1023px){.header-inner{flex-wrap:wrap;gap:15px}.header-inner .nav{order:3;flex-basis:100%;justify-content:flex-start}.reading-aside{margin-top:0}}
@media(max-width:767px){.header-inner{padding-block:20px;gap:14px}.site-header{padding-block:0!important}.header-actions{margin-inline-start:auto}.hero>svg.hero-art{max-height:300px;width:min(100%,370px);margin-inline:auto}.section.reading{width:calc(100% - 32px)}.invitation{padding:28px 22px}.header-actions .nav-link{font-size:11px}.card-actions{gap:8px}.aside-item{padding-block:15px}}

/* D-106 typography refinement. Installed system fonts only; no font files redistributed. */
/* English text uses the same bundled family as Arabic (its Latin subset), so the design
   looks the same on every device. The wordmark keeps its own face below. */
:lang(en){font-family:var(--font)}

h1{font-size:clamp(2.25rem,3.8vw,3.375rem)}
h2{font-size:clamp(1.7rem,2.7vw,2.1rem)}
.brand{font-size:34px}
.hero-copy>p:not(.eyebrow){font-size:20px;line-height:1.85}
.nav{font-size:16px;font-weight:500}
.header-actions{font-size:14px}
.demo-ribbon{font-size:13px}
.eyebrow{font-size:14px;font-weight:500}
.button,button.primary,button.secondary{font-size:16px;font-weight:500}
.card h3{font-size:24px;line-height:1.5}
.card p{font-size:17px;line-height:1.85}
.badge{font-size:14px;font-weight:500}
.meta,.catalog-summary,.breadcrumb,.search-field,.search-clear{font-size:14px}
.filter,.search-field input,input[type=search]{font-size:16px}
.filter{font-weight:500}
.card-actions .button.text,.card-actions .save-button,.save-button{font-size:14px}
.notice{font-size:17px}
.prose{font-size:20px;line-height:1.95}
.prose h2{font-size:29px;line-height:1.5}
.article-header h1{line-height:1.5}
.article-header>p:not(.eyebrow){font-size:22px;line-height:1.8}
.reference-table,.reading-aside,.source-note,.step{font-size:16px}
.reading-aside .notice,.choice span{font-size:15px}
.choice{font-size:17px}
.site-footer p,.footer-grid>div>a{font-size:16px}
.footer-grid>.subtle{font-size:14px}
@media(max-width:767px){
 .brand{font-size:30px}
 .nav{font-size:15px}
 .header-actions,.header-actions .nav-link{font-size:13px}
 .demo-ribbon{font-size:12px}
 .hero-copy>p:not(.eyebrow){font-size:19px}
 .card h3{font-size:24px}
 .filter{font-size:15px}
 .article-header h1{font-size:34px;line-height:1.5}
 .article-header>p:not(.eyebrow){font-size:20px}
 .prose{font-size:19px;line-height:1.95}
.prose h2{font-size:26px}
.notice{font-size:16px}
.reference-table,.step{font-size:14px}
.eyebrow{font-size:14px}
}

/* D-108: a content-first magazine. Palette roles, not psychological guarantees. */
.magazine-intro{display:flex;align-items:center;justify-content:space-between;gap:40px;padding-block:38px 34px;border-bottom:1px solid var(--divider)}
.magazine-intro>div:first-child{min-width:0}
.magazine-intro .eyebrow{margin-bottom:8px}
.magazine-intro h1{font-size:clamp(1.9rem,3vw,2.65rem);line-height:1.5;margin-bottom:10px}
.magazine-intro p:last-child{font-size:18px;color:var(--muted);margin-bottom:0}
.mobile-break{display:none}
.issue-label{flex:0 0 265px;padding-inline-start:26px;border-inline-start:1px solid var(--divider);display:flex;flex-direction:column;gap:6px}
.issue-label>span,.issue-label small{font-size:14px;color:var(--muted)}
.issue-label a{font-size:22px;font-weight:500;color:var(--navy);text-decoration:none}
.issue-label a:hover{text-decoration:underline}
.issue-label a span{display:inline-block;margin-inline-start:10px;color:var(--accent)}
.magazine-reading{padding-block:32px 0}
.magazine-reading .section-head{margin-bottom:12px;align-items:center}
.magazine-reading .section-head .eyebrow{display:none}
.magazine-reading .section-head h2{font-size:24px;margin:0}
.catalog-context{font-size:14px;color:var(--muted);margin:0}
.magazine-reading .toolbar{margin-block:18px 12px;gap:16px}
.magazine-reading .search-field{gap:12px}
.magazine-reading .search-field input{width:245px;background:#fffefc}
.magazine-reading .catalog-summary{margin-bottom:16px;font-size:13px}
.magazine-reading .filter{border-radius:7px;background:#fffefc;border-color:var(--control)}
.magazine-reading .filter[aria-pressed=true]{background:var(--brand)}
.magazine-reading .save-button{border-color:var(--control)}
.editorial-grid{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:24px;align-items:stretch}
.editorial-grid .card.featured-card{grid-column:1;grid-row:1 / span 2;background:#fffefc;border-color:#c8d5e8}
.featured-card .card-art{height:185px;background:#edf3fd;order:2;border-top:1px solid var(--divider)}
.featured-card .card-art svg{height:100%;width:100%}
.featured-card .card-body{padding:26px 30px;gap:13px}
.feature-kicker{font-size:14px;color:var(--accent);font-weight:500}
.featured-card h3{font-size:clamp(1.65rem,2.55vw,2.1rem);line-height:1.5}
.featured-card p{font-size:18px;line-height:1.85;max-width:530px}
.featured-card .meta{padding-top:2px}
.featured-card .card-actions{border-top:1px solid var(--divider);padding-top:16px;margin-top:2px}
.featured-card .card-actions>.button.primary{font-size:16px;padding-inline:20px}
.editorial-grid .card.compact-card{grid-column:2;grid-row:auto;border-width:0 0 1px;border-radius:0;background:transparent;display:grid;grid-template-columns:minmax(0,1fr) 114px;column-gap:18px;align-content:center;padding:22px 0}
.compact-card .card-art{grid-column:2;grid-row:1;align-self:start;height:112px;margin-top:8px;border-radius:12px;background:var(--warm)}
.editorial-grid .card.compact-card:last-child:nth-child(odd){grid-column:2}
.compact-card .card-art svg{width:100%;max-width:100%;flex-shrink:0;height:112px}
.compact-card .card-body{grid-column:1;grid-row:1;padding:0;gap:12px}
.compact-card h3{font-size:23px;line-height:1.55}
.compact-card p{font-size:16px}
.compact-card .badge{font-size:13px;padding-inline:8px}
.compact-card .meta{font-size:13px;gap:6px;padding-top:0}
.compact-card .meta span:last-child{display:none}
.compact-card .card-actions{padding-top:0;gap:6px}
.compact-card .card-actions .button{font-size:14px}
.compact-card .card-actions .save-button{font-size:13px}
.magazine-principles{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;border-block:1px solid var(--divider);padding-block:22px;margin-block:36px}
.magazine-principles p{margin:0;font-size:14px;color:var(--muted);display:grid;grid-template-columns:28px auto;column-gap:9px}
.magazine-principles p>span{grid-row:1 / span 2;align-self:center;width:27px;height:27px;display:flex;align-items:center;justify-content:center;border:1px solid var(--divider);border-radius:50%;color:var(--navy);font-size:13px}
.magazine-principles strong{display:block;font-size:16px;font-weight:500;color:var(--navy)}
.magazine-principles>a{font-size:14px;min-height:44px;display:flex;align-items:center}
.magazine-home .invitation{display:flex;justify-content:space-between;align-items:center;gap:30px;margin-block:32px 48px;background:var(--warm);padding:32px 36px}
.magazine-home .invitation h2{font-size:29px;margin-bottom:10px}
.magazine-home .invitation p{font-size:17px;margin-bottom:0}
.magazine-home .invitation .eyebrow{margin-bottom:8px}
.magazine-home .invitation>.button{flex-shrink:0}
@media(max-width:1100px){
 .magazine-intro{gap:24px}.issue-label{flex-basis:235px;padding-inline-start:22px}
 .editorial-grid{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:22px}
 .editorial-grid .card.compact-card{grid-template-columns:minmax(0,1fr)}
 .compact-card .card-art{display:none}.compact-card .card-body{grid-column:1}
 .featured-card .card-body{padding:24px}.featured-card .card-art{height:185px}
 .magazine-home .invitation{flex-direction:column;align-items:flex-start}
}
@media(max-width:767px){
 .magazine-intro{display:block;padding-block:28px 24px}
 .magazine-intro h1{font-size:32px;line-height:1.5;margin-bottom:12px}
 .magazine-intro p:last-child{font-size:17px}
 .mobile-break{display:block}
 .issue-label{margin-top:22px;border:0;border-top:1px solid var(--divider);padding:16px 0 0;gap:2px}
 .issue-label a{font-size:21px}.issue-label small{display:none}
 .magazine-reading{padding-top:24px}
 .magazine-reading .section-head{align-items:flex-start;gap:6px}
 .magazine-reading .section-head h2{font-size:23px}
 .catalog-context{font-size:13px}
 .magazine-reading .toolbar{margin-block:18px 12px}
 .magazine-reading .search-field input{width:100%}
 .editorial-grid{grid-template-columns:minmax(0,1fr);gap:0}
 .editorial-grid .card.featured-card{grid-column:1;grid-row:auto;margin-bottom:8px}
 .featured-card .card-art{height:170px}
 .featured-card .card-body{padding:22px}
 .featured-card h3{font-size:28px}.featured-card p{font-size:17px}
 .editorial-grid .card.compact-card{grid-column:1;grid-row:auto;padding-block:25px;grid-template-columns:minmax(0,1fr) 90px;gap:14px}
 .compact-card .card-art{display:flex;height:90px;margin-top:5px}
 .editorial-grid .card.compact-card:last-child:nth-child(odd){grid-column:1}
 .compact-card .card-art svg{height:90px;width:100%}
 .compact-card h3{font-size:22px}.compact-card p{font-size:16px}
 .compact-card .card-actions{grid-column:1 / -1}
 .magazine-principles{margin-block:28px;gap:20px;padding-block:22px}
 .magazine-principles p{flex-basis:100%}
 .magazine-home .invitation{padding:26px 22px}
 .magazine-home .invitation h2{font-size:25px}
 .magazine-home .invitation{margin-block:26px 36px;gap:18px}
}
@media(max-width:359px){
 .editorial-grid .card.compact-card{grid-template-columns:minmax(0,1fr)}
 .compact-card .card-art{display:none}.featured-card .card-body{padding:20px}
 .magazine-intro h1{font-size:29px}
}

/* D-110: topic-led editorial voice; varied rhythm without fabricated authorship. */
.magazine-intro{align-items:flex-end;padding-block:40px 34px}
.magazine-intro h1{font-size:clamp(2.05rem,3.45vw,2.95rem);line-height:1.5;margin-block:12px 18px;max-width:780px}
.magazine-intro>div:first-child>p:last-child{max-width:660px;font-size:19px;line-height:1.85}
.issue-label{padding-block:8px;margin-bottom:9px}
.issue-label small{line-height:1.8}
.magazine-reading .section-head h2{font-size:25px}
.editorial-grid{column-gap:40px}
.editorial-grid .card.featured-card{background:transparent;border:0;border-radius:0;border-top:3px solid var(--navy);overflow:visible}
.featured-card .card-body{padding:22px 0 24px;gap:14px}
.featured-card .feature-kicker{font-size:14px}
.featured-card h3{font-size:clamp(1.85rem,2.7vw,2.2rem);line-height:1.55}
.featured-card .badge{background:transparent;padding:0}
.featured-card .meta{padding-block:8px 0}
.featured-card .card-actions{padding-top:16px}
.featured-card .card-art{height:220px;border:0;border-radius:3px;overflow:hidden;background:var(--warm)}
.editorial-grid .card.compact-card{display:flex;padding-block:24px;align-content:initial;border-top:1px solid var(--divider)}
.editorial-grid .card.compact-card:first-of-type{border-top:0}
.compact-card .card-body{padding:0;gap:13px}
.compact-card h3{font-size:25px;line-height:1.55}
.compact-card .badge{background:transparent;padding:0;color:var(--accent)}
.compact-card p{font-size:18px;line-height:1.85}
.compact-card .meta{padding-top:10px}
.compact-card .card-actions{margin-top:0;padding-top:5px}
.story-question{border-inline-start:2px solid var(--brand);padding-inline-start:18px;margin-block:4px}
.story-question>span{display:block;font-size:13px;color:var(--muted);margin-bottom:8px}
.story-question>p{color:var(--navy);font-size:19px;line-height:1.8}
.issue-excerpt{padding:36px 0 30px;margin-top:24px;border-bottom:1px solid var(--divider);text-align:center}
.issue-excerpt .eyebrow{margin-bottom:14px}
.issue-excerpt blockquote{margin:0 auto 16px;max-width:820px}
.issue-excerpt blockquote p{font-size:clamp(1.45rem,2.15vw,1.85rem);line-height:1.85;color:var(--navy);margin:0;font-weight:500}
.excerpt-source{font-size:14px;color:var(--muted);margin:0;line-height:1.85}
.magazine-principles{border-top:0;margin-top:12px}
.magazine-home .invitation{background:transparent;border:0;border-inline-start:3px solid var(--brand);border-radius:0;padding:12px 26px;margin-block:36px 48px}
@media(max-width:1023px){.editorial-grid{column-gap:28px}.featured-card .card-body{padding-inline:0}.featured-card .card-art{height:190px}.compact-card h3{font-size:23px}}
@media(max-width:767px){
 .magazine-intro{padding-block:28px 24px}
 .magazine-intro h1{font-size:34px;line-height:1.5;margin-block:10px 16px}
 .magazine-intro>div:first-child>p:last-child{font-size:18px}
 .issue-label{margin-bottom:0;padding-top:16px}
 .featured-card .card-body{padding:20px 0 24px}
 .featured-card h3{font-size:29px}
 .featured-card .card-art{height:180px}
 .editorial-grid .card.compact-card{padding-block:26px;border-top:0}
 .compact-card h3{font-size:25px}
 .compact-card p{font-size:18px}
 .issue-excerpt{padding-block:28px}
 .issue-excerpt blockquote p{font-size:24px}
 .excerpt-source{font-size:13px}
 
 .magazine-home .invitation{padding:10px 20px}
}
@media(max-width:359px){.magazine-intro h1{font-size:30px}.featured-card h3{font-size:27px}}

/* D-111: preserve editorial layout while separating real-story plans from content. */
.editorial-grid .story-placeholder{grid-column:2;grid-row:2;display:flex;padding-block:24px;border-top:1px solid var(--divider);border-bottom:1px solid var(--divider)}
.story-placeholder .card-body{display:flex;flex-direction:column;gap:13px}
.story-placeholder .subtle{font-size:14px;color:var(--muted)}
.story-placeholder .button{align-self:flex-start}
.badge.worksheet{background:var(--soft);color:var(--accent)}
.compact-card .badge.worksheet{background:transparent}
.source-list{padding-inline-start:22px}
.source-list li{margin-block:16px}
.source-list p{font-size:15px;line-height:1.85}
.source-link{overflow-wrap:anywhere;word-break:normal;line-height:1.8}
.worksheet-page .prose h2{padding-top:22px;border-top:1px solid var(--divider)}
.worksheet-page .prose h2+p{padding-bottom:18px}
.future-story-note{border-top:1px solid var(--divider);padding-top:28px}
.prototype-lab{border-block:1px solid var(--divider);padding-block:16px;margin-block:28px}
.prototype-lab summary{cursor:pointer;min-height:44px;color:var(--navy)}
@media(max-width:767px){.editorial-grid .story-placeholder{grid-column:1;grid-row:auto;padding-block:26px}.magazine-reading .filters{gap:8px}.magazine-reading .filter{padding-inline:12px}}

/* D-113: local-only guided contribution. No network or persistent drafts. */
.contribution-shell{padding-block:42px 72px}
.story-journey{max-width:820px;margin-inline:auto}
.story-journey h1{font-size:clamp(1.9rem,3.4vw,2.65rem);margin-bottom:16px}
.story-entry .hero-description{max-width:650px;font-size:21px}
.story-entry>.hero-actions{margin-block:28px 18px}
.story-entry .button.primary{font-size:18px;padding:15px 28px}
.story-local-note{border-inline-start:3px solid var(--accent);padding:12px 18px;background:var(--soft);font-size:15px;line-height:1.8;color:var(--navy);margin-block:24px}
.story-how{border-top:1px solid var(--divider);margin-top:34px;padding-top:26px}
.story-how ol{display:grid;grid-template-columns:1fr 1fr;gap:12px 34px;padding-inline-start:24px}
.story-progress{display:flex;gap:12px;list-style:none;padding:0;margin:26px 0 30px}
.story-progress li{display:flex;align-items:center;gap:7px;flex:1;color:var(--muted);border-bottom:2px solid var(--divider);padding-bottom:12px;font-size:15px}
.story-progress li[aria-current=step]{color:var(--accent);font-weight:700;border-color:var(--accent)}
.story-progress span{display:inline-grid;place-items:center;min-width:27px;height:27px;border:1px solid currentColor;border-radius:50%;font-size:14px}
.story-question{margin-block:24px}
.story-question>label{display:block;font-size:24px;line-height:1.6;color:var(--navy);font-weight:700;margin-bottom:10px}
.story-question textarea,.story-question input{display:block;width:100%;max-width:100%;font:inherit;line-height:1.85;color:var(--ink);background:var(--surface);border:1px solid var(--control);border-radius:7px;padding:16px 18px;resize:vertical}
.story-question textarea{min-height:170px}
.story-question input{min-height:54px}
.story-question textarea:focus-visible,.story-consent input:focus-visible{outline:3px solid var(--accent);outline-offset:4px}
.story-question textarea[aria-invalid=true]{border-color:#a42424}
.story-question textarea::placeholder,.story-question input::placeholder{color:var(--muted);opacity:1}
.story-field-foot{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:8px;color:var(--muted);font-size:14px}
.story-error{color:#9a2525;font-size:16px;margin:12px 0;min-height:1.5em}
.story-error:empty{min-height:0;margin:0}
.story-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-block:24px}
.story-actions .button{font-size:16px}
.story-answer-block{border-bottom:1px solid var(--divider);padding-block:20px}
.story-answer-heading{display:flex;align-items:start;justify-content:space-between;gap:16px}
.story-answer-heading h2{font-size:22px}
.story-answer-heading .button{flex-shrink:0;padding:8px 12px}
.story-verbatim{white-space:pre-wrap;overflow-wrap:anywhere}
.story-consent{display:flex;gap:12px;align-items:flex-start;padding:18px;background:var(--soft);margin-top:28px;cursor:pointer}
.studio-terms{border:1px solid var(--divider);padding:16px 18px;margin-top:18px;background:var(--paper)}
.studio-terms summary{cursor:pointer;font-weight:600}
.studio-terms h3{font-size:16px;margin-block:18px 6px}
.studio-terms ul{padding-inline-start:22px;margin:0}
.studio-terms li{margin-block:6px;font-size:14px;line-height:1.75;color:var(--muted)}
.studio-caution{margin-block:0 22px}
.charter-list li{margin-block:14px}
.list-translate{margin-block:0 18px}
.issue-card h2{font-size:22px;margin-block:10px 8px}
.issue-card .badge{align-self:flex-start}
.story-consent input{width:22px;height:22px;flex:0 0 22px;margin-top:6px;accent-color:var(--accent)}
.story-clear-confirm{padding:18px;border:1px solid var(--control);border-radius:7px;margin-top:22px}
.story-clear-confirm .button{margin-inline-end:12px}
.story-status{display:inline-block;background:var(--soft);color:var(--navy);padding:10px 18px;border-radius:6px;font-weight:700;margin-top:16px}
.story-review-guide{padding:22px;background:var(--surface);border:1px solid var(--divider);margin-top:28px}
#demo-review-panel>h2{overflow-wrap:anywhere;margin-top:16px}
@media(max-width:600px){
 .contribution-shell{padding-block:26px 46px}
 .story-entry .hero-description{font-size:19px}
 .story-progress{gap:6px}
 .story-progress li{font-size:13px;flex-direction:column;align-items:start;gap:6px}
 .story-question>label{font-size:22px}
 .story-question textarea,.story-question input{padding:12px}
 .story-answer-heading{display:block}
 .story-answer-heading .button{padding-inline:0}
 .story-how ol{grid-template-columns:1fr;gap:7px}
 .story-actions .button.primary{width:100%}
}

/* Archived D-114 styles; no file controls are rendered or served by D-115. */
.draft-file-tools{border-top:1px solid var(--divider);margin-top:30px;padding-top:24px}
.draft-file-tools h2,.story-feedback h2{font-size:22px;line-height:1.65}
.draft-file-tools p{overflow-wrap:anywhere}
.draft-file-picker{padding:18px;background:var(--surface);border:1px solid var(--divider);border-radius:7px}
.draft-file-picker>label{display:block;font-weight:700;color:var(--navy);margin-bottom:10px}
.draft-file-picker input{display:block;max-width:100%;width:100%;min-width:0;font:inherit;color:var(--ink);padding:8px 0}
.draft-file-picker input::file-selector-button{font:inherit;color:var(--navy);background:var(--soft);border:1px solid var(--control);border-radius:6px;padding:9px 12px;margin-inline-end:10px;cursor:pointer}
.draft-file-picker input:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.story-feedback{margin-top:24px;padding:20px;border-inline-start:3px solid var(--accent);background:var(--soft)}
#draft-file-status:empty{display:none}
@media(max-width:600px){.draft-file-tools .story-actions .button{width:100%;white-space:normal}.draft-file-picker{padding:12px}.story-feedback{padding:16px}}

/* D-115 base, extended by D-116 local registration and optional photo below. */
.catalog-type-guide{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 36px;margin:18px 0 26px;padding:20px 0;border-block:1px solid var(--divider)}
.catalog-type-guide>div{min-width:0}
.catalog-type-guide dt{font-weight:700;color:var(--navy);margin-bottom:5px}
.catalog-type-guide dd{margin:0;color:var(--muted);font-size:16px;line-height:1.85;overflow-wrap:anywhere}
@media(max-width:600px){.catalog-type-guide{grid-template-columns:minmax(0,1fr);gap:16px}}
.studio-shell{max-width:1180px;padding-block:26px 64px}
.studio-topline{display:flex;justify-content:space-between;gap:18px;font-size:15px;margin-bottom:22px}
.studio-stages{display:flex;list-style:none;gap:20px;padding:0;border-bottom:1px solid var(--divider);margin:0 0 44px}
.studio-stages li{display:flex;gap:9px;align-items:center;color:var(--muted);padding:12px 0 16px;flex:1;border-bottom:2px solid transparent}
.studio-stages li[aria-current=step]{color:var(--accent);border-color:var(--accent);font-weight:700}
.studio-stages span{font-size:14px;border:1px solid var(--control);width:27px;height:27px;border-radius:50%;display:grid;place-items:center;flex-shrink:0}
.studio-shell h1{font-size:clamp(30px,3.5vw,46px);line-height:1.5;max-width:850px;margin-bottom:18px}
.studio-shell h2{font-size:25px;line-height:1.65}
.studio-shell h3{font-size:19px}
.studio-shell p{overflow-wrap:anywhere}
.studio-intro>.hero-description{max-width:740px}
.studio-choices{display:grid;grid-template-columns:1fr 1fr;gap:36px;margin-block:35px}
.studio-choices article{border-block:1px solid var(--divider);padding:28px 0;display:flex;align-items:start;flex-direction:column}
.studio-choices article p{flex:1;max-width:400px;margin-block:12px 24px}
.studio-choice-mark{font-size:30px;color:var(--accent);line-height:1;margin-bottom:15px}
.studio-entry-note{color:var(--muted)}
.studio-local{font-size:14px;color:var(--muted);border-top:1px solid var(--divider);padding-top:18px;margin-top:38px;max-width:960px}
.studio-workspace,.studio-preview-layout{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:52px;align-items:start;margin-top:26px}
.studio-conversation{background:var(--surface);border:1px solid var(--divider);padding:28px;border-radius:8px;min-width:0}
.studio-speaker{font-size:15px;font-weight:700;color:var(--accent);display:flex;align-items:center;gap:10px;margin-bottom:20px}
.studio-speaker span{font-size:12px;font-weight:400;border:1px solid var(--divider);padding:2px 9px;border-radius:20px}
.studio-input-label{display:block;font-weight:700;color:var(--navy);margin-block:23px 10px}
.studio-shell textarea,.studio-field input{font:inherit;font-size:18px;line-height:1.85;width:100%;min-width:0;border:1px solid var(--control);border-radius:6px;padding:12px 15px;color:var(--ink);background:var(--surface)}
.studio-shell textarea{resize:vertical;min-height:140px}
.studio-shell input:focus-visible,.studio-shell textarea:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.studio-shell input::placeholder,.studio-shell textarea::placeholder{color:var(--muted);opacity:1;font-size:15px}
.studio-answer-foot{display:flex;justify-content:space-between;align-items:center;gap:14px;font-size:14px;color:var(--muted);margin-top:8px}
.studio-answer-foot .button{padding:8px 0;font-size:15px}
.studio-outline{border-inline-start:1px solid var(--divider);padding-inline-start:24px}
.studio-outline ol{list-style:none;padding:0;margin:12px 0 26px}
.studio-outline li{padding-block:13px;border-bottom:1px solid var(--divider)}
.studio-outline li strong,.studio-outline li span{display:block}
.studio-outline li span,.studio-outline>p{font-size:14px;color:var(--muted)}
.studio-outline li[aria-current=step] strong{color:var(--accent)}
.studio-coaching{background:var(--soft);padding:20px;margin-block:16px;border-inline-start:3px solid var(--accent)}
.studio-coaching ul{padding-inline-start:20px;margin-block:10px}
.studio-coaching li{margin-block:9px;font-size:16px}
.studio-coaching p{font-size:14px;color:var(--muted)}
.studio-field{margin-block:22px}
.studio-field label{display:block;font-weight:700;color:var(--navy);margin-bottom:9px}
.studio-field input{min-height:52px}
.studio-reset{margin-top:28px;padding-top:15px;border-top:1px solid var(--divider)}
.studio-reset .button{margin-inline-end:12px}
.studio-status-message{color:var(--navy);font-size:15px}
.studio-status-message:empty{display:none}
.studio-profile-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,370px);gap:52px;margin-top:32px;align-items:start}
.studio-profile-editor{padding-bottom:28px;border-bottom:1px solid var(--divider)}
.studio-two-fields{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.studio-account{margin-top:30px}
.studio-account-status{font-size:15px;background:var(--soft);padding:12px 16px;border-inline-start:3px solid var(--accent)}
.studio-demo-inbox{padding:24px;border:1px dashed var(--control);background:var(--surface);margin-top:24px}
.studio-demo-inbox h3{margin-block:15px}
.studio-demo-inbox .badge{white-space:normal}
.studio-demo-inbox .button{white-space:normal}
.studio-profile-card{background:var(--surface);border:1px solid var(--divider);border-top:4px solid var(--brand);padding:28px;overflow-wrap:anywhere}
.studio-avatar{width:66px;height:66px;border-radius:50%;display:grid;place-items:center;font-size:29px;color:var(--navy);background:var(--soft);margin-block:24px 16px}
.studio-profile-card h2{font-size:27px}
.studio-profile-field{color:var(--accent)}
.studio-self-declared{border-block:1px solid var(--divider);padding-block:15px;margin-block:20px}
.studio-self-declared span{display:block;font-size:13px;color:var(--muted);margin-top:6px}
.studio-linkedin{display:block;overflow-wrap:anywhere;margin-block:16px}
.studio-public-status{display:flex;flex-direction:column;gap:5px;font-size:13px;color:var(--muted);padding-top:16px}
.studio-public-stories{margin-top:25px;padding-top:20px;border-top:1px solid var(--divider)}
.studio-public-stories p,.studio-profile-caution{font-size:14px;color:var(--muted)}
.studio-profile-caution{padding:18px 5px}
.studio-private-draft{border-top:1px solid var(--divider);padding-top:20px;margin-top:24px}
.studio-private-draft p:last-child{font-size:14px;color:var(--muted)}
.studio-topline>div{display:flex;flex-wrap:wrap;gap:12px 22px}
.studio-example{border-inline-start:3px solid var(--brand);background:var(--soft);padding:16px 20px;margin-block:22px}
.studio-example p{margin-block:8px;font-size:17px}
.studio-example span{font-size:13px;color:var(--muted)}
.studio-gate{background:var(--soft);border:1px solid var(--divider);padding:24px;margin-block:28px}
.studio-gate h2{font-size:23px}
.studio-gate .button{margin-block:6px;margin-inline-end:10px;white-space:normal}
.studio-guidelines{border-block:1px solid var(--divider);padding-block:22px;margin-top:25px}
.studio-guidelines ul{padding-inline-start:22px;font-size:16px}
.studio-guidelines li{margin-block:8px}
.studio-registration-layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:50px;align-items:start}
.studio-registration-layout .studio-account{margin-top:0;max-width:680px}
.studio-photo-editor{padding-block:20px;border-block:1px solid var(--divider);margin-block:25px}
.studio-photo-picker{position:relative;display:inline-block;max-width:100%;margin-top:12px}
.studio-photo-picker>label{display:block;padding:12px 20px;background:var(--surface);border:1px solid var(--control);border-radius:6px;font-weight:700;color:var(--navy)}
.studio-photo-picker>input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.studio-photo-picker:focus-within{outline:3px solid var(--accent);outline-offset:3px}
.studio-photo-picker.is-disabled>label{color:var(--muted);background:var(--soft)}
.studio-photo-picker.is-disabled>input{cursor:not-allowed}
#profile-photo-status{font-size:15px;color:var(--navy);margin-top:12px}
#profile-photo-rules{padding-inline-start:20px;font-size:14px}
.studio-avatar{overflow:hidden;width:96px;height:96px}
.studio-avatar img{width:100%;height:100%;object-fit:cover;display:block}
@media(max-width:700px){.studio-registration-layout{grid-template-columns:minmax(0,1fr);gap:22px}.studio-topline{flex-wrap:wrap}.studio-gate{padding:18px}.studio-gate .button{margin-inline-end:0}.studio-stages li{min-width:0;overflow-wrap:anywhere}}
.studio-result{max-width:780px;margin:auto}
.studio-result>.badge{margin-bottom:22px}
.studio-receipt{display:grid;grid-template-columns:160px minmax(0,1fr);gap:14px;background:var(--surface);border-block:1px solid var(--divider);padding:24px;margin-top:26px}
.studio-receipt span{color:var(--muted)}
.studio-receipt strong{overflow-wrap:anywhere}
@media(max-width:900px){.studio-workspace,.studio-preview-layout{grid-template-columns:minmax(0,1fr) 220px;gap:25px}.studio-profile-layout{gap:28px;grid-template-columns:minmax(0,1fr) 290px}}
@media(max-width:700px){.studio-shell{padding-top:20px}.studio-stages{gap:8px;margin-bottom:30px}.studio-stages li{font-size:12px;display:block}.studio-stages span{margin-bottom:7px}.studio-choices,.studio-workspace,.studio-preview-layout,.studio-profile-layout,.studio-two-fields{grid-template-columns:minmax(0,1fr);gap:22px}.studio-choices article{padding-block:24px}.studio-conversation{padding:19px}.studio-outline{padding:20px 0 0;border-inline-start:0;border-top:1px solid var(--divider)}.studio-outline ol{display:grid;grid-template-columns:1fr 1fr;gap:12px}.studio-profile-card{padding:22px}.studio-two-fields{gap:0}.studio-two-fields .studio-field{margin-block:14px}.studio-receipt{grid-template-columns:1fr;gap:7px;padding:20px}.studio-receipt strong{margin-bottom:13px}.studio-shell .hero-description{font-size:20px}.studio-shell .story-actions .button{white-space:normal}.studio-answer-foot{align-items:start;flex-wrap:wrap}}
/* T-1 bilingual: the language control in the header, and one item's translation state. */
.lang-control{display:flex;flex-direction:column;align-items:flex-start;gap:4px}
.lang-switch{display:flex;align-items:center;gap:8px}
.lang-option{background:none;border:0;padding:2px 0;min-height:auto;color:var(--muted);font:inherit;font-size:13px;font-weight:700;cursor:pointer;border-bottom:2px solid transparent}
.lang-option:hover{color:var(--navy)}
.lang-option.is-current{color:var(--brand);border-bottom-color:var(--brand)}
.lang-divider{color:var(--divider)}
.translation-bar{margin-block:14px 22px}
.translation-line{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px;margin:0;font-size:14px;line-height:1.7;color:var(--muted)}
.translation-link{background:none;border:0;padding:0;min-height:auto;font:inherit;font-weight:700;color:var(--brand);cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.translation-link:hover{color:var(--accent)}
.translation-link.quiet{font-weight:400;color:var(--muted);text-decoration-color:var(--control)}
.translation-status,.translation-badge{color:var(--muted)}
.translation-line.is-translated .translation-badge{padding-inline-end:2px}
.translation-report{margin-top:10px;max-width:var(--reading);font-size:14px}
.translation-report textarea{width:100%;margin-top:6px}
@media(max-width:767px){.lang-control{align-items:flex-end}}
/* T-1: the first screen says where to start, and every card here goes somewhere. */
.start-here{padding-block:34px 6px;display:grid;gap:20px}
.start-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.start-card{background:var(--surface);border:1px solid var(--divider);border-radius:var(--radius);padding:20px 22px;display:grid;gap:8px;align-content:start}
.start-card h3{margin:0;font-size:20px;line-height:1.5}
.start-card h3 a{color:var(--navy);text-decoration:none}
.start-card h3 a:hover{color:var(--brand);text-decoration:underline}
.start-card p{margin:0;font-size:15px;color:var(--muted);line-height:1.7}
.start-write{margin:0;color:var(--muted);font-size:15px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
@media(max-width:767px){.start-cards{grid-template-columns:minmax(0,1fr)}.start-here{padding-block:26px 0}}
/* T-1: Latin text needs tighter leading than Arabic; the same numbers that read
   comfortably in Arabic look loose and uneven in English. Arabic is untouched. */
html[lang=en] body{line-height:1.65}
html[lang=en] .prose{line-height:1.75;overflow-wrap:normal;hyphens:auto}
html[lang=en] .prose p{margin-block:0 18px}
html[lang=en] .prose h2{line-height:1.3;margin-block:38px 12px}
html[lang=en] h1{line-height:1.2}
html[lang=en] .article-header h1{line-height:1.2;letter-spacing:-.01em}
html[lang=en] .hero-description,html[lang=en] .article-header>p:not(.eyebrow){line-height:1.6}
html[lang=en] .card h3,html[lang=en] .start-card h3,html[lang=en] .panel h3{line-height:1.3}
html[lang=en] .nav{gap:6px 18px}
html[lang=en] .eyebrow{letter-spacing:.04em}
html[lang=en] .notice,html[lang=en] .studio-conversation p,html[lang=en] .studio-outline{line-height:1.65}
html[lang=en] .translation-line{line-height:1.6}
@media(max-width:767px){html[lang=en] .article-header h1{font-size:28px}html[lang=en] .prose{font-size:17px;line-height:1.7}}
/* T-1: the invitation to write sits at the end of a piece, where the reader who finished is. */
.write-invite{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px;margin-top:38px}
.write-invite h2{margin:4px 0 6px;font-size:23px}
.write-invite p:not(.eyebrow){margin:0;color:var(--muted);font-size:16px;max-width:52ch}
@media(max-width:767px){.write-invite{display:grid}.write-invite .button{width:100%}}
.next-piece{border-top:1px solid var(--divider);padding-top:26px}
.next-piece h2{margin-block:6px 8px}
.next-piece p:not(.eyebrow){color:var(--muted);margin-block:0 10px}

/* 30 Sep 2026 — readers' first screen (feedback deck #1, #3, #8, #11). On a phone the header took two
   rows of links and the question pushed every piece below the screen. One scrollable row of links,
   the issue box folded away (the header already links the issue), the pieces straight after it. */
.lang-option[data-ui-lang=en]:not(.is-current),.lang-option[data-ui-lang=ar]:not(.is-current){border:1px solid var(--divider);border-radius:999px;padding:4px 12px}
@media(max-width:767px){
 .header-inner .nav{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;gap:0 18px;padding-top:0;margin-inline:-16px;padding-inline:16px;mask-image:linear-gradient(to left,#000 88%,transparent)}
 [dir=ltr] .header-inner .nav{mask-image:linear-gradient(to right,#000 88%,transparent)}
 .header-inner .nav::-webkit-scrollbar{display:none}
 .header-inner .nav .nav-link{white-space:nowrap}
 .header-inner{padding-block:14px;gap:10px}
 .magazine-intro{padding-block:20px 16px}
 .magazine-intro h1{font-size:28px;margin-block:6px 10px}
 .magazine-intro>div:first-child>p:last-child{font-size:16px;line-height:1.8}
 .magazine-intro .issue-label{display:none}
 .magazine-reading .catalog-context{display:none}
 .magazine-reading .section-head{gap:4px;padding-top:14px}
 .magazine-reading .toolbar{margin-block:10px 8px}
 .catalog-type-guide{grid-template-columns:minmax(0,1fr);gap:12px}
}
@media(max-width:767px){
 .magazine-reading .search-field label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
 .magazine-reading .search-field input{padding-block:10px}
 .magazine-reading .issue-scope{margin-block:4px}
 .magazine-reading .section-head h2{margin-bottom:0}
 .magazine-reading .catalog-summary{margin-block:6px 10px}
}
@media(max-width:767px){
 .lang-divider{display:none}
 .lang-switch{gap:4px}
 .lang-option{padding:3px 9px}
 .header-actions{gap:8px}
 [dir=ltr] .header-actions .nav-link{font-size:12px}
}
@media(max-width:767px){
 .magazine-reading .filters{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}
 .magazine-reading .filters::-webkit-scrollbar{display:none}
 .magazine-reading .filter{white-space:nowrap;flex:0 0 auto}
 .magazine-reading .section-head h2{font-size:22px;line-height:1.45}
 [lang=en] .magazine-intro h1{font-size:25px;line-height:1.3}
 [lang=en] .magazine-intro>div:first-child>p:last-child{font-size:15px;line-height:1.6}
 [lang=en] .magazine-reading .section-head h2{font-size:20px;line-height:1.3}
}
@media(max-width:767px){.magazine-reading .section-head{padding-top:6px}.magazine-intro{padding-block:16px 12px}}
/* 30 Sep 2026 — the email-language choice: two small options on one line, not two panels. The general
   .studio-field input rule (full width, padding) was styling the radio buttons as text boxes. */
.mail-lang{border:0;padding:0;margin:14px 0 0;display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px}
.mail-lang legend{padding:0;margin-bottom:6px;font-weight:600;width:100%;float:inline-start}
.mail-lang .story-consent{display:inline-flex;align-items:center;gap:8px;margin:0;padding:8px 14px;border-radius:999px;border:1px solid var(--divider)}
.mail-lang .story-consent input,.mail-lang input[type=radio]{width:18px;height:18px;flex:0 0 18px;margin:0;padding:0;border:0;min-height:0;box-shadow:none}
.mail-lang .story-consent:has(input:checked){border-color:var(--accent);background:var(--soft)}
/* 1 Oct 2026 — the data-request choice ("what are you asking for"): the same fault as the email
   language on 30 Sep. The .studio-field input rule made each radio a 52px box centred apart from its
   label. Four compact rows, the button beside its label. */
.request-kinds{border:0;padding:0;margin:22px 0 0;display:grid;gap:8px}
.request-kinds legend{padding:0;margin-bottom:8px;font-weight:600}
.request-kinds .story-consent{display:flex;align-items:center;gap:10px;margin:0;padding:10px 14px;border-radius:8px;border:1px solid var(--divider)}
.request-kinds .story-consent input,.request-kinds input[type=radio]{width:18px;height:18px;flex:0 0 18px;margin:0;padding:0;border:0;min-height:0;box-shadow:none}
.request-kinds .story-consent:has(input:checked){border-color:var(--accent);background:var(--soft)}

/* 9 Oct 2026 (founder): the publication's name with its tagline (brand.mjs) — in the header, in the
   entry page's introduction and in the footer. Arabic text never drops below 13px here. */
.brand span.brand-name[lang]{font-family:inherit;font-size:inherit;letter-spacing:0;font-weight:700}
.brand small.brand-tagline[lang]{font-family:var(--font);font-size:13px;letter-spacing:0;font-weight:500;color:var(--muted)}
.brand-lockup{display:flex;flex-direction:column;gap:2px;margin-block-end:18px}
.brand-lockup-name{font-size:42px;font-weight:700;color:var(--brand);line-height:1.25}
.brand-lockup-tagline{font-size:21px;font-weight:500;color:var(--navy);line-height:1.6}
.footer-brand strong{display:block}
.site-footer .footer-brand .footer-tagline{font-size:17px;font-weight:500;margin:4px 0 0}
@media(max-width:767px){.brand-lockup-name{font-size:36px}.brand-lockup-tagline{font-size:19px}}

/* 9 Oct 2026: a writer's name under their piece, readers' reports, the writer's approval page. */
.byline{margin:10px 0 14px;font-size:16px;color:var(--navy)}
.byline bdi:first-of-type{font-weight:700}
.byline-bio{font-size:15px;color:var(--muted);margin-top:10px}
.report-box{margin-block:20px 8px}
.report-box.panel{padding:22px 24px}
.report-box h2{font-size:21px;margin-bottom:10px}
.report-reasons{border:0;padding:0;margin:0 0 14px;display:grid;gap:8px}
.report-reasons .story-consent{display:flex;align-items:center;gap:10px;margin:0;padding:8px 12px;border-radius:8px;border:1px solid var(--divider);background:var(--surface)}
.report-reasons input[type=radio]{width:18px;height:18px;flex:0 0 18px;margin:0}
.report-reasons .story-consent:has(input:checked){border-color:var(--accent);background:var(--soft)}
.approval-page .approval-preview{border:1px solid var(--divider);border-radius:var(--radius);background:var(--surface);padding:24px 28px;margin-block:22px}
.approval-preview .approval-title{font-size:30px;line-height:1.5;margin:6px 0}
.approval-preview .prose h3{font-size:20px;margin-top:22px}
.approval-decision{margin-top:8px}
.approval-decision .story-consent{display:flex;gap:10px;align-items:flex-start;margin-bottom:14px}
@media(max-width:767px){.approval-page .approval-preview{padding:18px 16px}.approval-preview .approval-title{font-size:25px}}
/* Members, likes and comments (10 Oct 2026). Same tokens as the rest; Arabic text stays at 15px or more. */
.member-message{color:#1e6b3a;font-size:16px;margin:12px 0 0}
.member-details{margin-top:8px}
.member-details summary{cursor:pointer;color:var(--accent);font-size:16px}
.member-chip{display:inline-block;border-radius:999px;padding:1px 12px;font-size:15px;background:var(--soft);color:var(--navy)}
.member-chip.act{background:#fde8c8;color:#6b4300}
.member-chip.live{background:#dff3e4;color:#1e5b33}
.member-chip.off{background:#efefef;color:#4a4a4a}
.social-box{border-top:1px solid var(--divider);margin-top:32px;padding-top:22px}
.social-box h2{font-size:23px;margin:18px 0 10px}
.social-bar{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.like-button{display:inline-flex;align-items:center;gap:8px;font:inherit;font-size:16px;cursor:pointer;border:1px solid var(--navy);border-radius:999px;padding:6px 18px;background:var(--surface);color:var(--navy)}
.like-button .like-mark::before{content:"\2661";font-size:19px;line-height:1}
.like-button[aria-pressed="true"]{background:var(--navy);color:#fff}
.like-button[aria-pressed="true"] .like-mark::before{content:"\2665"}
.like-button:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.like-count{color:var(--muted);font-size:16px}
.comment{padding:14px 0;border-top:1px solid var(--divider)}
.comment-head{margin:0 0 4px;font-size:15px;color:var(--muted)}
.comment-text{margin:0;font-size:17px;line-height:1.9;white-space:pre-wrap;overflow-wrap:anywhere}
.comment-form{margin-top:16px}
.comment-form textarea{font:inherit;font-size:17px;line-height:1.85;width:100%;min-height:110px;border:1px solid var(--control);border-radius:6px;padding:12px 15px;background:var(--surface);color:var(--ink)}
.social-signin{font-size:16px;margin-top:14px}
.member-people{list-style:none;margin:8px 0 0;padding:0}
.comment-list{list-style:none;margin:0;padding:0}
.member-people li{display:flex;flex-wrap:wrap;align-items:center;gap:4px;padding:6px 0;font-size:16px}
/* The profile pages, laid out like a LinkedIn / X profile (founder, 11 Oct 2026). */
.icon{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;vertical-align:-3px}
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.profile-page{padding-block:28px 72px}
.profile-hero{position:relative;background:var(--surface);border:1px solid var(--divider);border-radius:18px;overflow:hidden;box-shadow:0 1px 2px rgba(23,54,92,.04),0 8px 24px rgba(23,54,92,.06)}
.profile-cover{height:168px;background:radial-gradient(circle at 16% 28%,rgba(255,255,255,.16) 0 58px,transparent 59px),radial-gradient(circle at 84% 78%,rgba(255,255,255,.1) 0 96px,transparent 97px),linear-gradient(120deg,var(--navy) 0%,#1f4f8c 55%,var(--brand) 100%)}
.profile-top{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:14px;padding:0 28px;margin-top:-64px}
.profile-avatar{width:132px;height:132px;flex:none;border-radius:50%;display:grid;place-items:center;font-size:54px;font-weight:700;line-height:1;color:var(--navy);background:linear-gradient(145deg,#fff 0%,var(--soft) 100%);border:5px solid var(--surface);box-shadow:0 4px 14px rgba(23,54,92,.18)}
.profile-actions{display:flex;flex-wrap:wrap;gap:10px;padding-bottom:6px}
.profile-button{display:inline-flex;align-items:center;gap:8px;font:inherit;font-size:15px;font-weight:600;cursor:pointer;border:1px solid var(--control);border-radius:999px;padding:8px 18px;background:var(--surface);color:var(--navy);text-decoration:none;line-height:1.5}
.profile-button:hover{background:var(--soft)}
.profile-button.is-primary{background:var(--navy);border-color:var(--navy);color:#fff}
.profile-button.is-primary:hover{background:var(--accent);border-color:var(--accent)}
.profile-button:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.profile-info{padding:14px 28px 24px}
.profile-info h1{font-size:clamp(28px,3vw,36px);line-height:1.4;margin:0}
.profile-headline{font-size:18px;color:var(--ink);margin:4px 0 0}
.profile-dot{padding-inline:8px;color:var(--muted)}
.profile-bio{font-size:17px;line-height:1.9;color:var(--ink);max-width:68ch;margin:12px 0 0;white-space:pre-wrap;overflow-wrap:anywhere}
.profile-meta{list-style:none;display:flex;flex-wrap:wrap;gap:6px 22px;margin:14px 0 0;padding:0;color:var(--muted);font-size:15px}
.profile-meta li{display:inline-flex;align-items:center;gap:6px}
.profile-meta a{color:var(--accent);font-weight:600}
.profile-stats{list-style:none;display:flex;flex-wrap:wrap;gap:10px;margin:18px 0 0;padding:0}
.profile-stats li{display:flex;flex-direction:column;min-width:112px;padding:10px 16px;border:1px solid var(--divider);border-radius:12px;background:var(--paper)}
.profile-stats b{font-size:22px;line-height:1.3;color:var(--navy)}
.profile-stats span{font-size:15px;color:var(--muted)}
.profile-note{font-size:15px;margin:12px 0 0}
.profile-message{margin:16px 4px 0}
.profile-edit{margin-top:18px;background:var(--surface);border:1px solid var(--divider);border-radius:16px;padding:24px 28px}
.profile-edit h2{font-size:22px;margin:0 0 12px}
.profile-edit-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 20px}
.profile-edit-grid .is-wide{grid-column:1/-1}
.profile-edit textarea,.profile-edit input{font:inherit;font-size:17px;line-height:1.8;width:100%;border:1px solid var(--control);border-radius:8px;padding:10px 14px;background:var(--surface);color:var(--ink)}
.profile-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,320px);gap:24px;align-items:start;margin-top:22px}
.profile-main{background:var(--surface);border:1px solid var(--divider);border-radius:16px;overflow:hidden;min-width:0}
.profile-tabs{display:flex;border-bottom:1px solid var(--divider);overflow-x:auto}
.profile-tabs button{flex:1 0 auto;display:inline-flex;align-items:center;justify-content:center;gap:8px;font:inherit;font-size:16px;color:var(--muted);background:transparent;border:0;border-bottom:3px solid transparent;padding:14px 18px;cursor:pointer;white-space:nowrap}
.profile-tabs button:hover{background:var(--paper);color:var(--navy)}
.profile-tabs button[aria-selected="true"]{color:var(--navy);font-weight:700;border-bottom-color:var(--brand)}
.profile-tabs button:focus-visible{outline:3px solid var(--accent);outline-offset:-3px}
.tab-count{min-width:24px;padding:0 7px;border-radius:999px;background:var(--soft);color:var(--navy);font-size:15px;font-weight:600;line-height:1.6}
.profile-panel{padding:6px 24px 20px}
.feed{list-style:none;margin:0;padding:0}
.feed-summary{margin:14px 0 4px}
.feed-item{display:flex;gap:14px;padding:16px 0;border-top:1px solid var(--divider)}
.feed-item:first-child{border-top:0}
.feed-item.is-new .feed-line{font-weight:600}
.feed-avatar{width:44px;height:44px;flex:none;border-radius:50%;display:inline-grid;place-items:center;font-size:19px;font-weight:700;color:var(--navy);background:var(--soft)}
.feed-avatar.is-small{width:30px;height:30px;font-size:15px;margin-inline-end:6px}
/* 11 Oct 2026: a member's optional photo fills the round avatar; without one the initial stays. */
.profile-avatar,.feed-avatar{overflow:hidden}
.avatar-img{width:100%;height:100%;object-fit:cover;display:block}
.comment-head .feed-avatar,.byline .feed-avatar{vertical-align:middle}
.profile-photo-edit{padding-bottom:18px;margin-bottom:14px;border-bottom:1px solid var(--divider)}
.profile-photo-edit h3{font-size:18px;margin:0 0 10px}
.profile-photo-row{display:flex;gap:16px;align-items:center}
.profile-photo-row p{margin:0}
.feed-avatar.profile-photo-preview{width:72px;height:72px;font-size:30px}
.profile-photo-edit .story-consent{margin-top:14px}
.profile-photo-edit .story-consent input{width:22px;height:22px;flex:0 0 22px;margin-top:6px;padding:0;border:0;min-height:0}
.profile-photo-edit .studio-photo-picker{margin-top:0}
.profile-photo-edit #member-photo-status:empty{display:none}
/* The square editor (11 Oct 2026): the photo in the circle as it will show; drag, pinch or keys. */
.photo-crop{display:grid;gap:12px;justify-items:start;margin-top:14px}
.photo-crop canvas{width:220px;height:220px;max-width:100%;border-radius:50%;background:var(--soft);box-shadow:0 0 0 1px var(--divider),0 0 0 6px var(--surface),0 0 0 7px var(--divider);cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none}
.photo-crop canvas:active{cursor:grabbing}
.photo-crop canvas:focus-visible{outline:3px solid var(--accent);outline-offset:10px}
.photo-crop p{margin:0}
.photo-zoom{display:flex;align-items:center;gap:12px;font-weight:700;color:var(--navy)}
.profile-photo-edit .photo-zoom input{width:200px;max-width:60vw;padding:0;border:0;min-height:0;background:none;accent-color:var(--accent)}
.photo-crop .story-actions{margin-top:0}
.feed-body{min-width:0;flex:1}
.feed-line{margin:0;font-size:16px;line-height:1.8}
.feed-quote{margin:8px 0 0;padding:10px 14px;border-inline-start:3px solid var(--brand);background:var(--paper);border-radius:8px;font-size:16px;line-height:1.8;white-space:pre-wrap;overflow-wrap:anywhere}
.feed-meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:6px 0 0;color:var(--muted);font-size:15px}
.feed-kind{display:inline-grid;place-items:center;width:28px;height:28px;flex:none;border-radius:50%;background:var(--soft);color:var(--brand)}
.feed-kind.like{background:#fde8ee;color:#b0244f}
.feed-kind .icon{width:16px;height:16px;vertical-align:0}
.piece-card{padding:18px 0;border-top:1px solid var(--divider)}
.piece-card:first-child{border-top:0}
.piece-card h3{font-size:20px;line-height:1.6;margin:8px 0 2px}
.piece-card-top{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.piece-metrics{list-style:none;display:flex;flex-wrap:wrap;gap:6px 26px;margin:12px 0 4px;padding:0;color:var(--muted)}
.piece-metrics li{display:inline-flex;align-items:center;gap:6px}
.piece-metrics b{font-size:16px;color:var(--ink);font-weight:600}
.liked-list{list-style:none;margin:0;padding:0}
.liked-list li{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:14px 0;border-top:1px solid var(--divider);font-size:16px}
.liked-list li:first-child{border-top:0}
.profile-empty{padding:34px 8px;text-align:center;color:var(--muted);font-size:16px}
.profile-empty p{margin:0 0 14px}
.profile-side{display:grid;gap:16px;position:sticky;top:20px}
.side-card{background:var(--surface);border:1px solid var(--divider);border-radius:16px;padding:20px}
.side-card h2{font-size:19px;margin:0 0 8px}
.side-list{margin:0 0 14px;padding-inline-start:20px;font-size:15px;color:var(--ink);line-height:1.9}
.side-actions{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0}
.profile-section{margin-top:28px}
.profile-section h2{font-size:23px;margin:0 0 14px}
@media(max-width:900px){.profile-layout{grid-template-columns:minmax(0,1fr)}.profile-side{position:static}}
@media(max-width:600px){.profile-page{padding-block:16px 48px}.profile-cover{height:112px}.profile-top{padding:0 16px;margin-top:-48px}.profile-avatar{width:96px;height:96px;font-size:40px;border-width:4px}.profile-actions{padding-bottom:0}.profile-info{padding:10px 16px 20px}.profile-stats li{min-width:0;flex:1 1 calc(50% - 10px)}.profile-panel{padding:4px 16px 16px}.profile-edit{padding:18px 16px}.profile-edit-grid{grid-template-columns:minmax(0,1fr)}.profile-tabs button{padding:12px 14px}}
/* ===== Design D (Sadu), founder 11 Oct 2026: "simple but strong and has arabic culture"; logo version 1 (the Peoplense P, ink frame, Sadu-red inner line).
   Local preview, branch sawalif-design-d. Two fonts: Noto Kufi Arabic (headings, interface) + Noto Naskh Arabic (reading), self-hosted (fonts/NOTO-NOTICE.txt).
   Ink, white, sand and ONE accent; the woven band (sadu-band.svg) is the only ornament; Arabic text never under 15px. Overrides the layers above. ===== */
@font-face{font-family:'Noto Kufi Arabic';font-style:normal;font-display:swap;font-weight:100 900;src:url(fonts/noto-kufi-arabic.woff2) format('woff2');unicode-range:u+06??,u+0750-077f,u+0870-088e,u+0890-0891,u+0897-08e1,u+08e3-08ff,u+200c-200e,u+2010-2011,u+204f,u+2e41,u+fb50-fdff,u+fe70-fe74,u+fe76-fefc,u+102e0-102fb,u+10e60-10e7e,u+10ec2-10ec4,u+10efc-10eff,u+1ee00-1ee03,u+1ee05-1ee1f,u+1ee21-1ee22,u+1ee24,u+1ee27,u+1ee29-1ee32,u+1ee34-1ee37,u+1ee39,u+1ee3b,u+1ee42,u+1ee47,u+1ee49,u+1ee4b,u+1ee4d-1ee4f,u+1ee51-1ee52,u+1ee54,u+1ee57,u+1ee59,u+1ee5b,u+1ee5d,u+1ee5f,u+1ee61-1ee62,u+1ee64,u+1ee67-1ee6a,u+1ee6c-1ee72,u+1ee74-1ee77,u+1ee79-1ee7c,u+1ee7e,u+1ee80-1ee89,u+1ee8b-1ee9b,u+1eea1-1eea3,u+1eea5-1eea9,u+1eeab-1eebb,u+1eef0-1eef1}
@font-face{font-family:'Noto Kufi Arabic';font-style:normal;font-display:swap;font-weight:100 900;src:url(fonts/noto-kufi-latin.woff2) format('woff2');unicode-range:u+00??,u+0131,u+0152-0153,u+02bb-02bc,u+02c6,u+02da,u+02dc,u+0304,u+0308,u+0329,u+2000-206f,u+20ac,u+2122,u+2191,u+2193,u+2212,u+2215,u+feff,u+fffd}
@font-face{font-family:'Noto Naskh Arabic';font-style:normal;font-display:swap;font-weight:400 700;src:url(fonts/noto-naskh-arabic.woff2) format('woff2');unicode-range:u+06??,u+0750-077f,u+0870-088e,u+0890-0891,u+0897-08e1,u+08e3-08ff,u+200c-200e,u+2010-2011,u+204f,u+2e41,u+fb50-fdff,u+fe70-fe74,u+fe76-fefc,u+102e0-102fb,u+10e60-10e7e,u+10ec2-10ec4,u+10efc-10eff,u+1ee00-1ee03,u+1ee05-1ee1f,u+1ee21-1ee22,u+1ee24,u+1ee27,u+1ee29-1ee32,u+1ee34-1ee37,u+1ee39,u+1ee3b,u+1ee42,u+1ee47,u+1ee49,u+1ee4b,u+1ee4d-1ee4f,u+1ee51-1ee52,u+1ee54,u+1ee57,u+1ee59,u+1ee5b,u+1ee5d,u+1ee5f,u+1ee61-1ee62,u+1ee64,u+1ee67-1ee6a,u+1ee6c-1ee72,u+1ee74-1ee77,u+1ee79-1ee7c,u+1ee7e,u+1ee80-1ee89,u+1ee8b-1ee9b,u+1eea1-1eea3,u+1eea5-1eea9,u+1eeab-1eebb,u+1eef0-1eef1}
@font-face{font-family:'Noto Naskh Arabic';font-style:normal;font-display:swap;font-weight:400 700;src:url(fonts/noto-naskh-latin.woff2) format('woff2');unicode-range:u+00??,u+0131,u+0152-0153,u+02bb-02bc,u+02c6,u+02da,u+02dc,u+0304,u+0308,u+0329,u+2000-206f,u+20ac,u+2122,u+2191,u+2193,u+2212,u+2215,u+feff,u+fffd}
:root{--paper:#fff;--surface:#fff;--navy:#171512;--ink:#171512;--muted:#5e5850;--brand:#171512;--accent:#a3271c;--divider:#e8e4dd;--control:#7a7268;--soft:#f6f3ee;--warm:#f6f3ee;--radius:10px;--body-ink:#4a443d;--font:"Noto Kufi Arabic","IBM Plex Sans Arabic","Segoe UI",Tahoma,Arial,sans-serif;--reading-font:"Noto Naskh Arabic","Noto Kufi Arabic",serif}
html[lang=en]{--font:"Noto Kufi Arabic","IBM Plex Sans Arabic","Segoe UI",Arial,sans-serif}
body{background:#fff;font-size:17px}
h1,h2,h3,h4{color:var(--ink)}
h1{font-weight:800;line-height:1.4}
.eyebrow{font-size:15px;font-weight:700;color:var(--accent)}
.meta,.breadcrumb,.badge,.nav,.header-actions,.lang-option,.notice,.source-note,.reading-aside{font-size:15px}
.badge,.badge.story,.badge.article{background:transparent;padding:0;color:var(--accent)}
.count{font-size:15px;min-width:26px;height:26px}
.section-head a{font-size:15px}
.sadu-band{height:14px;background:#171512 url(sadu-band.svg) repeat-x 0 0/20px 14px}
.sadu-band-footer{margin-top:56px}
main:has(> .home-invite:last-child) + .sadu-band-footer{margin-top:0}
.site-header{min-height:0;background:#fff;border-bottom-color:var(--divider)}
.brand{flex-direction:row;align-items:center;gap:12px;color:var(--ink);font-weight:800}
.brand-mark{width:auto;height:40px;flex:none}
.brand .brand-name{font-family:var(--font);font-size:30px;line-height:1;letter-spacing:0;font-weight:800}
.brand small.brand-tagline,.brand small.brand-tagline[lang]{font-family:var(--font);font-size:15px;letter-spacing:0;font-weight:500;color:var(--muted);padding-inline-start:12px;border-inline-start:1px solid #d9d3ca;line-height:1.4}
.save-button,.card-actions .save-button,.compact-card .card-actions .save-button{font-size:15px;border-radius:999px}
.site-footer .shell> .subtle,.footer-grid>.subtle{font-size:15px}
.nav-link{color:var(--ink)}
.nav-link[aria-current=page]{color:var(--ink);border-color:var(--accent)}
.nav .nav-cta{display:inline-flex;align-items:center;min-height:44px;padding:8px 18px;border:0;border-radius:999px;background:#171512;color:#fff;font-weight:600}
.nav .nav-cta:hover{background:var(--accent);color:#fff}
.nav .nav-cta[aria-current=page]{background:var(--accent);color:#fff}
.lang-option.is-current{color:var(--ink);border-bottom-color:var(--accent)}
.button,button.primary,button.secondary{border-radius:999px;font-weight:600}
.button.primary,button.primary{background:#171512;color:#fff}
.button.primary:hover,button.primary:hover{background:var(--accent);color:#fff}
.button.secondary,button.secondary{border-color:#171512;color:#171512}
.button.text{color:var(--ink);text-underline-offset:.45em}
.translation-link{color:var(--ink)}
.notice.soft{background:var(--soft);color:var(--body-ink)}
.hero-d{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);align-items:center;gap:64px;padding-block:72px 64px}
.hero-d .eyebrow{margin-block-end:14px}
.hero-d h1{font-size:clamp(2.5rem,5.4vw,4.4rem);line-height:1.32;max-width:none;margin-block-end:22px}
.hero-d .hero-copy>p.hero-description{font-family:var(--reading-font);font-size:21px;line-height:1.8;color:var(--body-ink);max-width:560px}
.feature-person{border:1px solid #e3ded6;border-radius:10px;padding:28px;background:#fff;box-shadow:0 1px 2px rgba(23,21,18,.06);display:flex;flex-direction:column;align-items:flex-start;gap:12px;min-width:0}
.feature-column{font-size:15px;font-weight:700;color:var(--accent);margin:0;display:flex;align-items:center;gap:8px}
.feature-column::before{content:"";width:9px;height:9px;flex:none;border-radius:50%;background:var(--accent)}
.feature-person h2{font-size:26px;line-height:1.55;margin:0}
.feature-person h2 a,.issue-list h3 a{text-decoration:none}
.feature-person h2 a:hover,.issue-list h3 a:hover{text-decoration:underline}
.feature-person>p:not(.feature-column):not(.byline){font-family:var(--reading-font);font-size:18px;line-height:1.85;color:var(--body-ink);margin:0}
.feature-person .byline{margin:4px 0 0;padding-top:14px;border-top:1px solid #ece8e1;width:100%}
.feature-person .button.text{padding-inline:0}
.issue-section{border-top:2px solid #171512;padding-top:40px}
.issue-section .section-head h2{font-size:clamp(1.75rem,3.2vw,2.5rem);font-weight:800}
.issue-section .section-head p.issue-question{font-family:var(--reading-font);font-size:21px;color:var(--body-ink)}
.issue-list{list-style:none;margin:8px 0 28px;padding:0;border-bottom:1px solid var(--divider)}
.issue-list li{display:grid;grid-template-columns:160px minmax(0,1fr);gap:8px 40px;padding-block:28px;border-top:1px solid var(--divider)}
.issue-list-type{font-size:15px;font-weight:700;color:var(--accent);padding-top:6px}
.issue-list h3{font-size:23px;line-height:1.6;margin:0 0 8px}
.issue-list-body>p:not(.meta){font-family:var(--reading-font);font-size:18px;line-height:1.85;color:var(--body-ink);margin:0 0 10px}
.issue-list .meta{margin:0;gap:8px 20px}
.issue-list .meta a{font-weight:600;color:var(--ink)}
.earlier-issue{margin:0 0 12px}
.earlier-issue a{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px;padding:20px 24px;border-radius:10px;background:var(--soft);text-decoration:none}
.earlier-issue-number{font-size:15px;font-weight:600;color:var(--muted)}
.earlier-issue strong{font-size:19px}
.earlier-issue-question{font-family:var(--reading-font);font-size:18px;color:var(--body-ink);margin-inline-start:auto}
.home-invite{background:var(--soft);padding:72px 24px;margin-top:24px}
.home-invite-inner{max-width:640px;margin-inline:auto;display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px}
.home-invite-mark{width:auto;height:64px;margin-bottom:6px}
.home-invite .eyebrow{margin:0}
.home-invite h2{font-size:clamp(1.9rem,3.6vw,2.75rem);font-weight:800;margin:0}
.home-invite p:not(.eyebrow){font-family:var(--reading-font);font-size:19px;line-height:1.85;color:var(--body-ink);margin:0 0 10px}
.article-header h1{font-size:clamp(2rem,4.4vw,2.9rem);line-height:1.45}
.article-header>p.hero-description{font-family:var(--reading-font);font-size:21px;line-height:1.8;color:var(--body-ink)}
.article-header>p.disclosure{font-family:var(--font);font-size:15px;line-height:1.9;color:var(--body-ink);background:var(--soft);border:0;padding:16px 18px;border-radius:10px;max-width:none;margin-block:18px}
.prose{font-family:var(--reading-font);font-size:20px;line-height:2}
.prose h2{font-family:var(--font);font-size:22px;font-weight:700;display:flex;align-items:center;gap:10px;margin-block:40px 14px}
.prose h2::before{content:"";width:9px;height:9px;flex:none;border-radius:50%;background:var(--accent)}
.reading-aside{border-block-start-color:#171512}
.write-invite,.invitation{background:var(--soft);border:0}
.card{border-color:#e3ded6}
.card-art,.card:nth-child(2) .card-art,.card:nth-child(3) .card-art{background:var(--soft)}
.site-footer{margin-top:0;background:#171512}
.site-footer .subtle,.site-footer .meta,.site-footer p{color:#e9e4dc}
.site-footer .shell> .subtle{border-top-color:#4a443d}
.profile-cover{background:#171512 url(sadu-band.svg) repeat-x 0 100%/20px 14px}
@media(max-width:1023px){.hero-d{grid-template-columns:minmax(0,1fr);gap:36px}}
@media(max-width:767px){.hero-d{padding-block:36px 40px;gap:28px}.hero-d h1{font-size:2.3rem}.hero-d .hero-copy>p.hero-description{font-size:19px}.feature-person{padding:22px}.feature-person h2{font-size:23px}.issue-list li{grid-template-columns:minmax(0,1fr);gap:6px;padding-block:22px}.issue-list-type{padding-top:0}.issue-list h3{font-size:21px}.earlier-issue a{padding:18px}.earlier-issue-question{margin-inline-start:0;flex-basis:100%}.brand-mark{height:34px}.brand .brand-name{font-size:26px}.brand small.brand-tagline{display:none}.home-invite{padding:52px 20px}.prose{font-size:19px}.eyebrow,.meta,.nav,.header-actions,.header-actions .nav-link,.breadcrumb,.badge,.lang-option,.notice,.source-note{font-size:15px}.sadu-band-footer{margin-top:40px}}
/* Design D, part 2 (11 Oct 2026, founder: "make sure the design as per what you shared fully"): the writer
   line on the founder's stories, the like / comment pills on the home card, the pull quote, the list credit. */
.byline{display:flex;align-items:center;flex-wrap:wrap;gap:6px 10px;font-size:16px}
.byline-mark{width:auto;height:40px;flex:none;padding:6px;border-radius:50%;background:var(--soft);box-sizing:content-box}
.byline-founder bdi{font-weight:700}
.feature-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;padding-top:4px;width:100%}
.feature-actions .button.text{margin-inline-start:auto}
.pill{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:8px 16px;border:1px solid #e3ded6;border-radius:999px;background:#fff;color:var(--ink);font-size:15px;font-weight:600;text-decoration:none}
.pill svg{width:16px;height:16px;flex:none}
.pill:hover{border-color:var(--ink);color:var(--ink)}
.pull-quote{margin:36px 0;padding:28px 0;border-top:2px solid #171512;border-bottom:1px solid var(--divider);display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center}
.pull-quote-mark{width:auto;height:34px}
.pull-quote blockquote{margin:0}
.pull-quote blockquote p{margin:0;font-family:var(--font);font-size:clamp(22px,3vw,28px);font-weight:700;line-height:1.7;color:var(--ink)}
.issue-list .meta>span:first-child:not(:only-child){font-weight:600;color:var(--ink)}
@media(max-width:767px){.feature-actions .button.text{margin-inline-start:0;flex-basis:100%;justify-content:flex-start}.pull-quote{margin:28px 0;padding:22px 0}}
/* The notice before collection (12 Oct 2026, wording item 8): above the writing tool's send step and on the sign-in / join page. */
.collection-notice{border-inline-start:3px solid var(--accent)}
.collection-notice strong{color:var(--ink)}
/* Fit to the screen (founder, 12 Oct 2026: "improve the window fits to the screen" → computers and phones).
   Computers: the page uses more of a wide screen (1184px → 1360px; reading columns keep their own narrower
   widths) and the header stays on ONE line from 1366px (12 Oct, later: at 1280px «الميثاق» touched «قائمتي»); between 1024px and 1365px the links take a second row
   of their own instead of breaking mid-way. Phones: the links wrap onto two clean rows instead of one sideways
   row cut at the edge (the 30 Sep single row hid «اكتب تجربتك» half off-screen). Text stays ≥ 15px. */
:root{--max:1360px}
@media(min-width:1366px){
 .header-inner{flex-wrap:nowrap}
 .header-inner .nav{flex-wrap:nowrap;gap:0 22px}
 .header-inner .nav .nav-link,.header-actions .nav-link{white-space:nowrap}
 .header-actions{flex-wrap:nowrap}
}
@media(min-width:1024px) and (max-width:1365px){
 .header-inner{flex-wrap:wrap;row-gap:8px}
 .header-inner .nav{order:3;flex-basis:100%;flex-wrap:nowrap;justify-content:flex-start;gap:0 22px}
 .header-inner .nav .nav-link,.header-actions .nav-link{white-space:nowrap}
 .header-actions{flex-wrap:nowrap}
}
@media(max-width:767px){
 .header-inner .nav,[dir=ltr] .header-inner .nav{flex-wrap:wrap;overflow:visible;mask-image:none;-webkit-mask-image:none;margin-inline:0;padding-inline:0;gap:2px 18px}
 .header-inner .nav .nav-cta{min-height:40px;padding:6px 16px}
}
/* The sign-in page (founder, 12 Oct 2026): two tabs on top; the notice before collection is small plain text
   under the button, no box (here and in the writing tool). Same approved words; still shown before anything is sent. */
.member-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-block:4px 22px}
.member-tab{min-height:44px;padding:8px 20px;border:1px solid var(--divider);border-radius:999px;background:#fff;color:var(--ink);font:inherit;font-size:15px;font-weight:700;cursor:pointer}
.member-tab:hover{border-color:var(--ink)}
.member-tab[aria-pressed=true]{background:#171512;border-color:#171512;color:#fff}
.notice.collection-notice,.collection-notice{background:none;border:0;border-radius:0;box-shadow:none;padding:0;margin-block:14px 0;max-width:72ch}
.collection-notice p{margin:0;font-size:15px;line-height:1.85;color:var(--muted)}
.collection-notice strong{color:var(--ink);font-weight:700}
/* Password sign-in (12 Oct 2026): the two quiet options under the button read as links, not buttons. */
.member-alt{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin:14px 0 0}
.link-button{background:none;border:0;padding:0;min-height:auto;font:inherit;font-size:15px;font-weight:600;color:var(--ink);text-decoration:underline;text-underline-offset:4px;cursor:pointer}
.link-button:hover{color:var(--accent)}
.member-alt span{color:var(--muted)}