@font-face{font-family:"IBM Plex Sans Arabic";font-style:normal;font-weight:400;font-display:swap;src:url(/assets/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}
@font-face{font-family:"IBM Plex Sans Arabic";font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/plex-arabic-600.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}
@font-face{font-family:"IBM Plex Sans Arabic";font-style:normal;font-weight:700;font-display:swap;src:url(/assets/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}
:root{--bg:#050505;--panel:#0d0d0d;--panel2:#141414;--gold:#d4af37;--bright:#f5c85b;--muted:#a7a49b;--border:#29251a;--white:#f6f4ee;--ok:#5fd28a;--info:#7fb4e6;--warn:#e8b45a}
*{box-sizing:border-box}
html{color-scheme:dark}
body{margin:0;min-height:100vh;background:var(--bg) url(/assets/gold-earth-city.png) center top/cover fixed;color:var(--white);font:15px/1.55 "IBM Plex Sans Arabic",Inter,"Segoe UI",Arial,sans-serif}
body::before{content:"";position:fixed;inset:0;background:rgba(5,5,5,.86);z-index:-1}
/* Arabic: IBM Plex Sans Arabic (SIL Open Font License), self-hosted. Letter-spacing breaks joined letters, so it is off. */
html[dir=rtl] body{font-family:"IBM Plex Sans Arabic","Segoe UI",Tahoma,Arial,sans-serif;line-height:1.75}
html[dir=rtl] *{letter-spacing:0!important}
button,textarea,input{font:inherit;color:inherit}
h1,h2,h3,p{margin:0}
[hidden]{display:none!important}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
:focus-visible{outline:2px solid var(--bright);outline-offset:2px}

.bar{display:flex;align-items:center;gap:16px;padding:12px 20px;border-bottom:1px solid var(--border);background:rgba(8,8,8,.8)}
.brand{display:flex;align-items:center;gap:10px;color:var(--white);text-decoration:none;font-weight:700;font-size:18px}
.brand img{border-radius:50%}
.tagline{color:var(--muted);font-size:13px;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bar-actions{display:flex;gap:8px;margin-inline-start:auto}
.primary,.ghost{border-radius:10px;padding:9px 16px;cursor:pointer;border:1px solid var(--gold);white-space:nowrap}
.primary{background:linear-gradient(180deg,var(--bright),#c99a2e);color:#191204;font-weight:700}
.primary:hover{filter:brightness(1.08)}
.ghost{background:transparent;color:var(--white);border-color:var(--border)}
.ghost:hover{border-color:var(--gold)}
button:disabled{opacity:.5;cursor:not-allowed}
.wide{width:100%}
.ai{font-size:10px;font-weight:700;letter-spacing:.08em;color:var(--bright);border:1px solid var(--gold);border-radius:4px;padding:1px 5px;vertical-align:middle}
.fine{color:var(--muted);font-size:12px}

.lobby{max-width:760px;margin:0 auto;padding:8vh 20px 40px}
.eyebrow{color:var(--bright);font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.lobby h1{font-size:clamp(30px,5vw,48px);line-height:1.12;margin:12px 0 16px}
.lead{color:var(--muted);font-size:17px;max-width:60ch}
.greeter{display:flex;gap:18px;align-items:flex-start;margin:34px 0 18px;padding:20px;border:1px solid var(--gold);border-radius:16px;background:var(--panel)}
.greeter img{border-radius:50%;border:2px solid var(--gold);flex:none}
.greeter .who{margin-bottom:6px}
.greeter .primary{margin-top:14px}

.room{display:grid;grid-template-columns:300px minmax(0,1fr) 320px;gap:14px;padding:14px;height:calc(100vh - 61px)}
.panel{background:rgba(13,13,13,.94);border:1px solid var(--border);border-radius:14px;min-height:0;overflow:auto}
.panel>summary{list-style:none;display:flex;justify-content:space-between;align-items:baseline;gap:8px;padding:12px 14px;font-weight:700;color:var(--bright);font-size:12px;letter-spacing:.1em;text-transform:uppercase;position:sticky;top:0;background:var(--panel);border-bottom:1px solid var(--border);z-index:1}
.panel>summary::-webkit-details-marker{display:none}
.panel>summary small{color:var(--muted);font-weight:400;letter-spacing:0;text-transform:none}

#deck{padding:10px}
.dept{margin-bottom:12px}
.dept h3{font-size:11px;color:var(--muted);font-weight:600;letter-spacing:.06em;text-transform:uppercase;margin-bottom:6px}
.dept h3 b{color:var(--gold);margin-inline-end:6px}
.people{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.person{position:relative;text-align:center;padding:8px 4px 6px;border:1px solid var(--border);border-radius:10px;background:var(--panel2);opacity:.5}
.person img{width:46px;height:46px;border-radius:50%;display:block;margin:0 auto 4px;border:1px solid var(--border)}
.person strong{display:block;font-size:12px}
.person span{display:block;font-size:10px;color:var(--muted);line-height:1.25}
.person em{display:block;font-style:normal;font-size:9px;margin-top:3px;color:var(--muted)}
.person.invited{opacity:.85;border-color:#4a3f1c}
.person.met{opacity:1}
.person.met em{color:var(--ok)}
.person.active{opacity:1;border-color:var(--bright);box-shadow:0 0 0 1px var(--bright),0 0 18px rgba(245,200,91,.35)}
.person.active img{border-color:var(--bright)}
.person.active em{color:var(--bright)}
.person.pulse{animation:pulse .9s ease-out}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(245,200,91,.7)}100%{box-shadow:0 0 0 14px rgba(245,200,91,0)}}

.stage{display:flex;flex-direction:column;overflow:hidden}
.status{padding:10px 16px;border-bottom:1px solid var(--border);background:#12100a;color:var(--bright);font-weight:600}
.status a{color:var(--info)}
.speaker{display:flex;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid var(--border);min-height:74px}
.speaker img{width:50px;height:50px;border-radius:50%;border:2px solid var(--bright)}
.speaker strong{font-size:16px}
.speaker span{display:block;color:var(--muted);font-size:12px}
.talk{list-style:none;margin:0;padding:16px;flex:1;overflow:auto;display:flex;flex-direction:column;gap:10px}
.talk li{max-width:82%;display:flex;gap:10px;align-items:flex-start}
.talk li img{width:30px;height:30px;border-radius:50%;flex:none;margin-top:2px}
.talk .bubble{background:var(--panel2);border:1px solid var(--border);border-radius:12px;padding:9px 13px;white-space:pre-line;overflow-wrap:anywhere}
.talk .bubble b{display:block;font-size:11px;color:var(--bright);margin-bottom:2px}
.talk li.client{align-self:flex-end}
.talk li.client .bubble{background:#1d1808;border-color:#4a3f1c}
.talk li.system{align-self:center;max-width:100%;color:var(--muted);font-size:12px;gap:6px}
.talk li.system::before,.talk li.system::after{content:"";width:28px;height:1px;background:var(--border);align-self:center}
.working{padding:0 16px 8px;color:var(--muted);font-size:13px}
.composer{border-top:1px solid var(--border);padding:12px 16px;background:var(--panel)}
.options{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:10px}
.options:empty{display:none}
.option{background:var(--panel2);border:1px solid #4a3f1c;border-radius:999px;padding:7px 14px;cursor:pointer}
.option:hover,.option[aria-pressed=true]{border-color:var(--bright);background:#1d1808}
.entry{display:flex;gap:8px;align-items:flex-end}
.entry textarea{flex:1;resize:none;max-height:140px;background:#070707;border:1px solid var(--border);border-radius:10px;padding:10px 12px}
.attach{padding:9px 11px}
.options .designs{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px;width:100%}
.design{border:1px solid #4a3f1c;border-radius:12px;background:var(--panel2);overflow:hidden;display:flex;flex-direction:column}
.design img{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;display:block;border-bottom:1px solid var(--border)}
.design strong{padding:8px 10px 0}
.design p{padding:2px 10px 0;color:var(--muted);font-size:12px}
.design-actions{display:flex;gap:6px;padding:10px;margin-top:auto}
.design-actions a,.design-actions button{flex:1;text-align:center;text-decoration:none;padding:7px 8px;font-size:13px}
.design{position:relative}
.design .pick{position:absolute;top:8px;inset-inline-start:8px;background:var(--gold);color:#111;font-size:11px;font-weight:700;border-radius:6px;padding:2px 8px}
.options .browse{border-color:var(--gold);color:var(--bright)}
.gallery-dialog{width:min(1100px,100% - 24px);max-width:none;max-height:min(90vh,900px);padding:0;border:1px solid var(--border);border-radius:16px;background:var(--panel);color:var(--white);overflow:auto}
.gallery-dialog::backdrop{background:rgba(0,0,0,.7);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.gallery-head{position:sticky;top:0;z-index:2;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px 20px;background:var(--panel);border-bottom:1px solid var(--border)}
.gallery-head h2{margin:0;font-size:18px}
.gallery-help{margin:14px 20px 0;color:var(--muted);font-size:13px}
.gallery-chips{display:flex;flex-wrap:wrap;gap:8px;padding:14px 20px 0}
.gallery-chips .option[aria-pressed=true]{border-color:var(--gold);color:var(--bright)}
.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px;padding:16px 20px 20px}
.gallery-dialog .option{color:var(--white)}
.gallery-link{color:var(--bright)}
.note.file dt::before{content:"\1F4CE  "}
.hint{color:var(--warn);font-size:12px;min-height:18px;margin-top:6px}

.brief .empty{padding:14px;color:var(--muted)}
.brief>.fine{padding:0 14px 14px}
#brief{padding:10px}
.notes{border:1px solid var(--border);border-radius:10px;margin-bottom:10px;background:var(--panel2)}
.notes.active{border-color:var(--bright)}
.notes header{display:flex;align-items:center;gap:8px;padding:8px 10px;border-bottom:1px solid var(--border)}
.notes header img{width:24px;height:24px;border-radius:50%}
.notes header strong{font-size:12px}
.notes header span{font-size:11px;color:var(--muted)}
.note{padding:7px 10px;border-bottom:1px solid #1c1a13}
.note:last-child{border-bottom:0}
.note dt{font-size:11px;color:var(--muted)}
.note dd{margin:0;display:flex;gap:6px;align-items:flex-start;overflow-wrap:anywhere}
.note dd span{flex:1;min-width:0}
.note.assumed dd span::after{content:" *";color:var(--warn)}
.note.fresh{animation:fresh 1.2s ease-out}
@keyframes fresh{0%{background:rgba(245,200,91,.28)}100%{background:transparent}}
.note button{background:none;border:0;color:var(--muted);cursor:pointer;padding:0 4px;font-size:12px}
.note button:hover{color:var(--bright)}
.note input{flex:1;min-width:0;background:#070707;border:1px solid var(--gold);border-radius:6px;padding:3px 6px}
dl{margin:0}

.trail{position:fixed;width:12px;height:12px;border-radius:50%;background:var(--bright);box-shadow:0 0 14px 4px rgba(245,200,91,.7);pointer-events:none;z-index:20}

dialog{background:var(--panel);color:var(--white);border:1px solid var(--gold);border-radius:14px;max-width:440px;width:calc(100% - 32px);padding:20px}
dialog::backdrop{background:rgba(0,0,0,.7)}
dialog h2{font-size:18px;margin-bottom:6px}
dialog p{color:var(--muted);margin-bottom:12px}
dialog textarea{width:100%;background:#070707;border:1px solid var(--border);border-radius:10px;padding:10px}
.dialog-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:12px}

@media (max-width:1100px){
  .room{grid-template-columns:240px minmax(0,1fr)}
  .brief{grid-column:1/-1;max-height:40vh}
  .people{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:760px){
  .tagline{display:none}
  .bar{padding:10px 12px;gap:8px}
  .bar-actions .ghost{padding:7px 10px;font-size:13px}
  .room{display:flex;flex-direction:column;height:auto;padding:10px}
  .stage{order:1;height:calc(100vh - 150px);min-height:420px}
  .deck{order:2}
  .brief{order:3;max-height:none}
  .people{grid-template-columns:repeat(4,1fr)}
  .panel>summary{cursor:pointer}
  .panel>summary span::after{content:" ▾"}
  .panel[open]>summary span::after{content:" ▴"}
  .talk li{max-width:94%}
  .greeter{flex-direction:column}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}

/* Founder inbox */
.link{text-decoration:none;display:inline-block}
.inbox{display:grid;grid-template-columns:340px minmax(0,1fr);gap:14px;padding:14px;min-height:calc(100vh - 61px)}
.inbox>.empty{grid-column:1/-1;padding:40px;text-align:center;color:var(--muted)}
.inbox a{color:var(--info)}
.head{display:flex;justify-content:space-between;padding:12px 14px;font-weight:700;color:var(--bright);font-size:12px;letter-spacing:.1em;text-transform:uppercase;border-bottom:1px solid var(--border)}
.head small{color:var(--muted);font-weight:400;letter-spacing:0;text-transform:none}
.meetings{list-style:none;margin:0;padding:8px}
.meetings button{width:100%;text-align:start;background:var(--panel2);border:1px solid var(--border);border-radius:10px;padding:10px 12px;margin-bottom:8px;cursor:pointer}
.meetings button[aria-current=true]{border-color:var(--bright)}
.meetings strong{display:block}
.meetings span{display:block;color:var(--muted);font-size:12px}
.tag{display:inline-block;font-size:10px;font-weight:700;letter-spacing:.06em;border:1px solid var(--border);border-radius:4px;padding:1px 6px;margin-inline-end:6px;color:var(--muted)}
.tag.SENT,.tag.NEEDS_INFO{color:var(--bright);border-color:var(--gold)}
.tag.APPROVED,.tag.IN_PROGRESS,.tag.DELIVERED{color:var(--ok);border-color:var(--ok)}
.tag.DECLINED,.tag.alert{color:#e88;border-color:#e88}
.detail{padding:18px}
.detail h2{font-size:20px;margin-bottom:4px}
.detail h3{font-size:12px;color:var(--bright);letter-spacing:.1em;text-transform:uppercase;margin:22px 0 8px}
.detail table{width:100%;border-collapse:collapse}
.detail th,.detail td{text-align:start;vertical-align:top;padding:6px 8px;border-bottom:1px solid #1c1a13}
.detail th{color:var(--muted);font-weight:400;width:32%}
.detail td small{color:var(--warn)}
.actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px}
.actions form{border:1px solid var(--border);border-radius:10px;padding:12px;background:var(--panel2);display:flex;flex-direction:column;gap:8px}
.actions label{font-size:12px;color:var(--muted)}
.actions input,.actions textarea,.actions select{width:100%;background:#070707;border:1px solid var(--border);border-radius:8px;padding:8px;color:var(--white);font:inherit}
.transcript{max-height:420px;overflow:auto;border:1px solid var(--border);border-radius:10px;padding:10px;background:#090909}
.transcript p{margin-bottom:8px;white-space:pre-line;overflow-wrap:anywhere}
.transcript b{color:var(--bright)}
.transcript .c b{color:var(--info)}
.transcript .s{color:var(--muted);font-size:12px}
@media (max-width:860px){.inbox{grid-template-columns:1fr}}

.design-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;width:100%}
.design-head .gallery-chips{padding:0}
.options .design-row{display:flex;grid-template-columns:none;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px;width:100%;scrollbar-width:thin}
.design-row .design{flex:0 0 230px;scroll-snap-align:start}
.office{border:1px solid var(--border);border-radius:12px;background:var(--panel2);padding:12px 14px;margin:8px 0;display:grid;gap:6px}
.office p{margin:0}
.points{margin:0;padding-inline-start:18px;color:var(--muted)}
.composer.after{border-top:1px solid var(--border)}
.after-kinds{margin-bottom:6px}
.after-kinds .option[aria-pressed=true]{border-color:var(--gold);color:var(--bright)}
