/* ═══════════════════════════════════════════
   Senjakala · Content Workspace
   Hospitality admin tokens + patterns
   ═══════════════════════════════════════════ */

:root {
  --charcoal: #171511;
  --charcoal-soft: #211e19;
  --paper: #f2eadf;
  --paper-light: #faf7f1;
  --warm-white: #fffdf8;
  --accent: #7d6d54;
  --accent-dark: #655842;
  --moss: #47513a;
  --ink: #201d18;
  --muted: #766f65;
  --quiet: #9b9388;
  --line: #d8cec1;
  --line-dark: rgba(255,253,248,0.12);
  --gold: #d4a843;
  --red: #c4a09a;
  --red-text: #7a3d3d;
  --green: #5a8a6a;
  --green-text: #3d6b45;
  --sidebar-w: 224px;
  --font-display: 'Bodoni Moda', Georgia, serif;
  --font-ui: 'DM Sans', system-ui, sans-serif;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none!important}
html{min-width:320px;scroll-behavior:smooth;background:var(--charcoal)}
body{
  margin:0;min-height:100vh;color:var(--ink);
  background:var(--paper-light);
  font-family:var(--font-ui);font-size:14px;
  -webkit-font-smoothing:antialiased;
}
button,input,textarea{font:inherit}
button,a{-webkit-tap-highlight-color:transparent}
a{color:inherit}
img{display:block;max-width:100%}
:focus-visible{outline:3px solid rgba(125,109,84,.42);outline-offset:3px}

/* Skip link */
.skip-link{position:fixed;top:10px;left:10px;z-index:200;padding:10px 14px;color:var(--warm-white);background:var(--charcoal);transform:translateY(-150%)}
.skip-link:focus{transform:translateY(0)}

/* ═══ SHELL ═══ */
.shell{min-height:100vh}

/* ═══ SIDEBAR ═══ */
.sidebar{
  position:fixed;inset:0 auto 0 0;z-index:50;
  width:var(--sidebar-w);display:flex;flex-direction:column;
  padding:25px 17px 18px;color:var(--warm-white);
  background:var(--charcoal);border-right:1px solid var(--line-dark);
}
.brand{display:block;width:145px;padding:2px 10px 14px;text-decoration:none}
.brand img{width:122px;height:auto}
.brand span{display:block;margin-top:2px;color:#918777;font-size:9px;letter-spacing:.12em;text-transform:uppercase}
.nav{margin-top:36px}
.nav-label{margin:0 10px 9px;color:#726a5e;font-size:8px;font-weight:600;letter-spacing:.18em;text-transform:uppercase}
.nav-item{
  min-height:44px;display:grid;grid-template-columns:25px 1fr auto;align-items:center;
  gap:8px;margin:2px 0;padding:0 11px;color:#9e9689;border-radius:5px;
  text-decoration:none;transition:color .15s,background .15s;
}
.nav-item>span:first-child{color:#6c6459;font-family:var(--font-display);font-size:11px}
.nav-item>span:last-child{font-size:12px;font-weight:500}
.nav-item small{font-size:10px;color:#6c6459;background:rgba(255,255,255,.06);padding:2px 7px;border-radius:8px}
.nav-item:hover{color:var(--warm-white);background:rgba(255,253,248,.045)}
.nav-item.is-active{color:var(--warm-white);background:rgba(255,253,248,.075)}
.nav-item.is-active>span:first-child{color:#b7a98f}
.sidebar-footer{display:grid;grid-template-columns:8px 1fr;gap:10px;margin:auto 8px 0;padding:15px 0;border-top:1px solid var(--line-dark)}
.status-dot{width:7px;height:7px;margin-top:5px;background:#afa27e;border-radius:50%;box-shadow:0 0 0 4px rgba(175,162,126,.08)}
.sidebar-footer strong,.sidebar-footer span{display:block}
.sidebar-footer strong{color:#d9d1c4;font-size:10px}
.sidebar-footer span{margin-top:4px;color:#756e63;font-size:9px;line-height:1.4}
.company{margin:4px 8px 0;color:#625b51;font-size:8px;letter-spacing:.06em}
.scrim{display:none}
body.nav-open .scrim{display:block;position:fixed;inset:0;z-index:40;background:rgba(23,21,17,.45)}
body.nav-open{overflow:hidden}

/* ═══ MAIN ═══ */
.main{min-width:0;min-height:100vh;margin-left:var(--sidebar-w)}

/* ═══ TOPBAR ═══ */
.topbar{
  position:sticky;top:0;z-index:30;min-height:68px;
  display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding:0 clamp(22px,3vw,42px);
  color:var(--ink);background:rgba(255,253,248,.92);
  backdrop-filter:blur(12px);border-bottom:1px solid var(--line);
}
.topbar-start,.topbar-end,.breadcrumb{display:flex;align-items:center}
.topbar-start{gap:13px}.topbar-end{gap:11px}
.breadcrumb{gap:9px;color:var(--quiet);font-size:10px}
.breadcrumb strong{color:var(--ink);font-weight:600}
.menu-btn{display:none;padding:0;background:transparent;border:0}
.mobile-brand{display:none;font-family:var(--font-display);font-size:18px;font-weight:500;letter-spacing:-.025em}
.draft-badge,.preview-link{min-height:36px;display:inline-flex;align-items:center;padding:0 12px;border:1px solid var(--line);border-radius:4px;font-size:10px}
.draft-badge{color:var(--muted)}
.draft-badge strong{margin-right:3px;color:var(--ink);font-weight:600}
.preview-link{color:var(--warm-white);background:var(--charcoal);border-color:var(--charcoal);text-decoration:none}

/* ═══ CONTENT ═══ */
.content{width:min(100%,1560px);margin:0 auto;padding:clamp(22px,3.2vw,46px)}

/* ═══ PANELS ═══ */
.panel{scroll-margin-top:80px}
.panel+.panel{margin-top:0}

/* ═══ HERO ═══ */
.hero{min-height:520px;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(340px,.72fr);overflow:hidden;color:var(--warm-white);background:var(--charcoal)}
.hero-copy{align-self:center;max-width:760px;padding:clamp(38px,6vw,88px)}
.hero h1{max-width:760px;margin:19px 0 0;font-family:var(--font-display);font-size:clamp(42px,5vw,67px);font-weight:400;line-height:.98;letter-spacing:-.045em;text-wrap:balance}
.hero h1 em{color:#b9a98f;font-weight:400}
.intro{max-width:570px;margin:25px 0 0;color:#aaa195;font-size:13px;line-height:1.72}
.hero-visual{position:relative;min-height:520px;margin:0;overflow:hidden}
.hero-visual::after{content:"";position:absolute;inset:0;background:rgba(23,21,17,.08);pointer-events:none}
.hero-visual img{width:100%;height:100%;object-fit:cover;object-position:52% 48%}
.hero-visual figcaption{position:absolute;inset:auto 0 0;z-index:2;display:flex;justify-content:space-between;gap:12px;padding:14px 17px;color:var(--warm-white);background:rgba(23,21,17,.78);font-size:8px;letter-spacing:.1em;text-transform:uppercase}

/* ═══ FACTS STRIP ═══ */
.facts{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border-radius:0 0 10px 10px;overflow:hidden}
.facts article{padding:22px 24px;text-align:center;background:var(--warm-white)}
.facts span,.facts strong,.facts small{display:block}
.facts span{color:var(--quiet);font-size:9px;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
.facts strong{margin-top:10px;font-family:var(--font-display);font-size:28px;font-weight:400}
.facts strong.state-preview{color:var(--moss);font-family:var(--font-ui);font-size:18px;font-weight:500}
.facts strong.state-approved{color:var(--green);font-family:var(--font-ui);font-size:22px;font-weight:500}
.facts small{margin-top:6px;color:var(--quiet);font-size:10px}

/* ═══ CARDS ═══ */
.grid-2col{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(290px,.65fr);gap:16px;margin-top:16px}
.grid-3col{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.card{background:var(--warm-white);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.card-header{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;min-height:78px;padding:18px 21px;border-bottom:1px solid var(--line)}
.card-header h2{margin:6px 0 0;font-size:16px;font-weight:500;letter-spacing:-.02em}

/* ═══ KICKERS & BADGES ═══ */
.kicker,.section-num{margin:0;font-size:9px;font-weight:600;letter-spacing:.16em;text-transform:uppercase}
.kicker{color:var(--accent)}
.section-num{color:var(--quiet)}
.badge{padding:5px 7px;color:var(--accent-dark);background:#eee6d8;border-radius:3px;font-size:8px;font-weight:600;letter-spacing:.08em;text-transform:uppercase}

/* ═══ CHECKLIST ═══ */
.checklist{margin:0;padding:0 21px;list-style:none}
.checklist li{min-height:67px;display:grid;grid-template-columns:26px minmax(0,1fr) auto;align-items:center;gap:12px;color:var(--quiet);border-bottom:1px solid #e7dfd4}
.checklist li:last-child{border-bottom:0}
.checklist li>span{font-family:var(--font-display);font-size:13px}
.checklist strong,.checklist small{display:block}
.checklist strong{color:var(--ink);font-size:11px;font-weight:600}
.checklist small{margin-top:4px;font-size:9px;line-height:1.4}
.checklist b{font-size:8px;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
.checklist .done b{color:var(--moss)}
.checklist .current b{color:var(--accent-dark)}

/* ═══ IDENTITY ═══ */
.identity{padding:16px 21px}
.identity div{display:grid;grid-template-columns:110px 1fr;gap:8px;padding:10px 0;border-bottom:1px solid #efe8db;font-size:11px}
.identity div:last-child{border-bottom:0}
.identity dt{color:var(--quiet);font-weight:500}
.identity dd{color:var(--ink);font-weight:500}

/* ═══ PROFILE CARDS ═══ */
.grid-3col .card{padding:28px 30px}
.grid-3col .card blockquote{margin:12px 0 0;color:var(--accent-dark);font-family:var(--font-display);font-size:15px;line-height:1.5}
.grid-3col .card blockquote+p{margin-top:12px;color:var(--muted);font-size:12px;line-height:1.6}
.grid-3col address{margin-top:8px;color:var(--ink);font-size:13px;line-height:1.7;font-style:normal}
.hours{list-style:none;margin-top:8px}
.hours li{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid #efe8db;font-size:12px}
.hours li:last-child{border-bottom:0}
.hours span{color:var(--quiet)}
.hours strong{font-weight:600}
.hours .closed strong{color:var(--red-text)}

/* ═══ SECTION HEADERS ═══ */
.section-hd{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;padding:0 0 30px}
.section-hd h2{font-family:var(--font-display);font-size:clamp(28px,3.5vw,42px);font-weight:400;line-height:1.05;letter-spacing:-.03em;text-wrap:balance}

/* ═══ MENU ═══ */
.grid-menu{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:60px;align-items:start}
.sig-list{list-style:none}
.sig-list li{display:grid;grid-template-columns:26px 1fr;gap:8px 0;align-items:baseline;padding:16px 0;border-bottom:1px solid #efe8db}
.sig-list li:last-child{border-bottom:0}
.sig-list li>span{font-family:var(--font-display);font-size:13px;color:var(--quiet)}
.sig-list strong{font-size:18px;font-weight:500;color:var(--ink);letter-spacing:-.01em}
.sig-list small{grid-column:2;font-size:9px;color:var(--quiet);text-transform:uppercase;letter-spacing:.08em}
.menu-photo img{width:100%;height:460px;object-fit:cover;border-radius:8px}
.menu-photo figcaption{margin-top:8px;font-size:9px;color:var(--quiet);text-align:center}

/* ═══ MEDIA ═══ */
.media-grid{display:grid;grid-template-columns:1fr 1fr;grid-auto-rows:360px;gap:12px}
.media-grid .media-tall{grid-row:span 2}
.media-grid .media-wide{grid-column:span 2}
.media-grid figure{margin:0;position:relative;overflow:hidden;border-radius:8px}
.media-grid img{width:100%;height:100%;object-fit:cover}
.media-grid figcaption{position:absolute;inset:auto 0 0;padding:10px 14px;background:rgba(23,21,17,.72);color:var(--warm-white);font-size:9px;display:flex;justify-content:space-between;gap:8px}
.media-grid figcaption span{font-weight:500}
.media-grid figcaption small{opacity:.65}

/* ═══ CHANNELS ═══ */
.channel-list{display:flex;flex-direction:column;gap:4px}
.channel-list a{display:grid;grid-template-columns:100px 1fr auto;align-items:center;gap:4px 16px;min-height:72px;padding:16px 22px;background:var(--warm-white);border:1px solid var(--line);border-radius:8px;text-decoration:none;transition:border-color .12s}
.channel-list a:hover{border-color:var(--accent)}
.channel-list a>span{font-size:8px;font-weight:600;color:var(--quiet);text-transform:uppercase;letter-spacing:.1em}
.channel-list a strong{font-size:17px;font-weight:500;letter-spacing:-.01em}
.channel-list a small{font-size:9px;color:var(--accent)}

/* ═══ PROJECT: OVERVIEW STATS ═══ */
#project-facts strong{font-size:24px}

/* ═══ DECISION SUMMARY ═══ */
.decision-summary{display:flex;align-items:center;gap:8px;font-size:10px;color:var(--quiet)}
.decision-summary span{font-weight:600;color:var(--ink)}
.decision-summary .dot{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:2px}
.dot.approved{background:var(--green)}
.dot.declined{background:var(--red)}
.dot.pending{background:var(--line)}

/* ═══ MODULES ═══ */
.module{background:var(--warm-white);border:1px solid var(--line);border-radius:12px;margin-bottom:12px;overflow:hidden}
.module-hd{width:100%;margin:0;padding:16px 20px;display:flex;align-items:center;justify-content:space-between;background:transparent;border:0;font-family:var(--font-ui);font-size:13px;font-weight:600;color:var(--ink);cursor:pointer;text-align:left;transition:background .12s}
.module-hd:hover{background:rgba(0,0,0,.01)}
.module-hd h3{font-size:13px;font-weight:600;display:flex;align-items:center;gap:8px}
.module-hd p{font-size:11px;color:var(--muted);font-weight:400;margin:2px 0 0;padding-left:28px}
.module-count{font-size:10px;font-weight:400;color:var(--quiet);margin-left:6px}
.module-arrow{font-size:12px;color:var(--quiet);transition:transform .15s}
.module-hd[aria-expanded="true"] .module-arrow{transform:rotate(90deg)}
.module-body{padding:0 20px 16px}

/* ═══ BLAST MODULE ═══ */
.blast-module{border:2px solid var(--gold)!important;background:#fefcf7!important}
.blast-module .module-hd{cursor:default;flex-direction:column;align-items:flex-start;gap:6px;padding-bottom:12px}
.blast-module .module-hd:hover{background:transparent}
.blast-status{font-size:11px;color:var(--muted)}
.blast-status span{font-weight:600;color:var(--ink)}

/* ═══ IDEA CARDS ═══ */
.idea-card{position:relative;background:var(--paper);border:1px solid var(--line);border-radius:8px;padding:18px 20px;margin-bottom:6px;transition:border-color .12s,background .12s}
.idea-card:hover{border-color:#c5b9a6}
.idea-card.is-approved{border-left:3px solid var(--green);background:#f4f7f2}
.idea-card.is-declined{border-left:3px solid var(--red);background:#faf6f6;opacity:.72}
.idea-badge{position:absolute;top:18px;right:20px;font-size:8px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;padding:3px 9px;border-radius:10px;pointer-events:none}
.badge-approved{background:#e2efe4;color:var(--green-text)}
.badge-declined{background:#f2e2e2;color:var(--red-text)}
.idea-priority{font-size:8px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);margin-bottom:4px}
.idea-card h4{margin:0 0 6px;padding-right:90px;font-family:var(--font-display);font-size:15px;font-weight:500;line-height:1.3}
.idea-desc{margin:0 0 6px;color:var(--muted);font-size:12px;line-height:1.65}
.idea-impact{margin:0 0 10px;color:var(--accent-dark);font-size:11px;font-weight:500}
.idea-actions{display:flex;gap:8px;align-items:center}
.btn-approve,.btn-decline{font-family:var(--font-ui);font-size:10px;font-weight:600;letter-spacing:.03em;padding:6px 16px;border-radius:4px;border:1px solid var(--line);cursor:pointer;background:var(--warm-white);color:var(--ink);transition:all .12s}
.btn-approve:hover{background:#e9f2e8;border-color:var(--green);color:var(--green-text)}
.btn-decline:hover{background:#f4e8e8;border-color:var(--red);color:var(--red-text)}
.btn-reset{font-size:10px;padding:5px 10px;background:transparent;border:1px solid transparent;color:var(--quiet);cursor:pointer;border-radius:3px;margin-left:auto}
.btn-reset:hover{color:var(--ink);border-color:var(--line)}

/* Blast card badges */
.blast-time{display:inline-block;font-size:10px;font-weight:600;color:#8a6d3b;background:#faf3e5;padding:3px 10px;border-radius:4px;margin-bottom:4px}
.blast-platforms{font-size:9px;color:var(--quiet);margin-bottom:2px}

/* ═══ TIMELINE ═══ */
.timeline{position:relative;padding-left:24px}
.timeline::before{content:'';position:absolute;left:6px;top:4px;bottom:4px;width:1px;background:var(--line)}
.tl-phase{margin-bottom:20px;position:relative}
.tl-phase::before{content:'';position:absolute;left:-21px;top:5px;width:8px;height:8px;border-radius:50%;background:var(--accent);border:2px solid var(--warm-white)}
.tl-phase h5{font-family:var(--font-display);font-size:13px;font-weight:500;margin:0 0 6px;color:var(--accent-dark)}
.tl-items{display:flex;flex-direction:column;gap:4px}
.tl-item{display:flex;align-items:center;gap:10px;font-size:11px;color:var(--muted);padding:5px 10px;background:var(--paper);border:1px solid var(--line);border-radius:4px}
.tl-day{font-size:9px;font-weight:600;color:var(--accent);background:#f3ede5;padding:2px 7px;border-radius:5px;min-width:40px;text-align:center}

/* ═══ RESET BAR ═══ */
.reset-bar{display:flex;justify-content:center;padding:24px 0 8px}
.btn-quiet{min-height:36px;padding:0 14px;color:var(--ink);background:transparent;border:1px solid var(--line);border-radius:4px;font-size:11px;cursor:pointer}
.btn-quiet:hover{color:var(--red-text);border-color:var(--red)}

/* ═══ PROTOTYPE NOTE ═══ */
.prototype-note{display:flex;align-items:center;gap:14px;margin:64px 0 0;padding:16px 20px;border:1px dashed var(--line);border-radius:8px}
.note-icon{width:32px;height:32px;display:grid;place-items:center;flex-shrink:0;background:var(--paper);border-radius:50%;font-family:var(--font-display);font-size:16px;color:var(--accent)}
.prototype-note strong{font-size:11px;color:var(--ink)}
.prototype-note p{margin:3px 0 0;font-size:10px;color:var(--muted)}

/* ═══ FOOTER ═══ */
.workspace-footer{display:flex;justify-content:space-between;padding:24px 0 0;color:var(--quiet);font-size:9px}

/* ═══ RESPONSIVE ═══ */
@media(max-width:960px){
  .grid-2col,.grid-3col{grid-template-columns:1fr}
  .grid-menu{grid-template-columns:1fr;gap:32px}
  .menu-photo{max-width:320px}
  .media-grid{grid-template-columns:1fr 1fr}
  .media-tall,.media-wide{grid-row:auto;grid-column:auto}
  .facts{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:820px){
  .sidebar{transform:translateX(-100%);transition:transform .2s}
  body.nav-open .sidebar{transform:translateX(0)}
  .main{margin-left:0}
  .menu-btn{display:block;width:44px;height:44px;position:relative}
  .menu-btn span{position:absolute;left:11px;width:22px;height:2px;background:var(--ink);transition:transform .15s}
  .menu-btn span:first-child{top:16px}
  .menu-btn span:last-child{top:23px}
  body.nav-open .menu-btn span:first-child{transform:rotate(45deg);top:21px}
  body.nav-open .menu-btn span:last-child{transform:rotate(-45deg);top:21px}
  .mobile-brand{display:block}
  .breadcrumb{display:none}
  .hero{grid-template-columns:1fr}
  .hero-visual{min-height:320px}
}
@media(max-width:560px){
  .content{padding:12px}
  .topbar{padding:0 16px}
  .hero-copy{padding:32px 21px 36px}
  .hero h1{font-size:36px}
  .facts article{padding:16px 14px}
  .facts strong{font-size:22px}
  .card-header,.checklist{padding-inline:16px}
  .section-hd{align-items:flex-start;flex-direction:column;gap:12px;padding-bottom:24px}
  .section-hd h2{font-size:28px}
  .grid-3col .card{padding:20px 18px}
  .sig-list strong{font-size:16px}
  .media-grid{grid-template-columns:1fr;grid-auto-rows:280px}
  .media-grid .media-tall,.media-grid .media-wide{grid-row:auto;grid-column:auto}
  .channel-list a{grid-template-columns:1fr auto;min-height:72px}
  .channel-list strong{grid-column:1/3;font-size:16px}
  .idea-card h4{padding-right:0}
  .idea-badge{position:static;display:inline-block;margin-bottom:4px}
  .decision-summary{flex-wrap:wrap;gap:4px}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
}
