
:root{
  --ivory:#E9EEF2; --paper:#FAFBFC; --charcoal:#141211; --ink:#1A1816; --muted:#444A52;
  --line:#D2DAE2; --side:#C6D1DB; --gold:#A8823F; --gold-deep:#6B4E18; --gold-soft:#EEE2C8; --gold-light:#D9BE8A; --rail:#E9E3D6;
  --serif:'Newsreader',Georgia,serif; --sans:'Figtree',system-ui,sans-serif;
}
*{box-sizing:border-box;margin:0}
body{background:var(--ivory);color:var(--ink);font-family:var(--sans);font-weight:500;font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased}
h1,h2{font-family:var(--serif);font-weight:500;color:var(--charcoal)}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer}
:focus-visible{outline:2px solid var(--gold-deep);outline-offset:2px}
svg.lucide{width:18px;height:18px;stroke-width:1.75}

/* sidebar */
.rail{position:fixed;inset:0 auto 0 0;width:268px;background:var(--side);color:var(--charcoal);display:flex;flex-direction:column;z-index:40;transition:transform .2s,width .2s}
.brand{display:flex;gap:12px;align-items:center;padding:20px 16px}
.brand .name{font-family:var(--serif);font-size:21px;color:var(--charcoal);line-height:1.15}
.brand .ws{font-size:12px;color:var(--gold-deep)}
.rail nav{flex:1;overflow-y:auto;padding:0 12px 16px}
.grp{margin-bottom:16px}
.grp p{font-size:12px;color:rgba(20,18,17,.82);padding:0 12px 4px}
.nav{display:flex;align-items:center;gap:12px;width:100%;padding:8px 12px;border:0;background:none;color:rgba(20,18,17,.96);border-radius:6px;font-size:14px;text-align:left}
.nav:hover{background:rgba(36,34,32,.07);color:var(--charcoal)}
.nav.on{background:rgba(36,34,32,.12);color:var(--charcoal)}
.nav.on svg{color:var(--gold-deep)}
.collapse{display:flex;align-items:center;gap:12px;padding:12px 24px;border:0;border-top:1px solid rgba(36,34,32,.15);background:none;color:rgba(20,18,17,.92);font-size:14px}
body.slim .rail{width:72px}
body.slim .brand .t,body.slim .grp p,body.slim .nav span,body.slim .collapse span{display:none}
body.slim .nav{justify-content:center}
.wrap{padding-left:268px;transition:padding .2s}
body.slim .wrap{padding-left:72px}

/* top */
.demo{background:var(--gold-soft);color:var(--gold-deep);text-align:center;font-size:14px;padding:8px 16px}
header{position:sticky;top:0;z-index:20;display:flex;flex-wrap:wrap;gap:12px;align-items:center;padding:12px 24px;background:color-mix(in srgb,var(--ivory) 95%,transparent);backdrop-filter:blur(6px);border-bottom:1px solid var(--line)}
.search{position:relative;flex:1;max-width:560px;min-width:200px}
.search svg{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--muted);width:16px;height:16px}
.field{width:100%;border:1px solid var(--line);background:var(--paper);border-radius:6px;padding:8px 12px 8px 36px;font:inherit;color:var(--ink)}
.field:focus{border-color:var(--gold-deep)}
.tools{display:flex;gap:8px;align-items:center;margin-left:auto}
.btn{display:inline-flex;align-items:center;gap:8px;border-radius:6px;padding:8px 16px;font-size:14px;font-weight:600;border:1px solid transparent}
.primary{background:var(--charcoal);color:var(--paper)}.primary:hover{background:var(--ink)}
.quiet{background:var(--paper);border-color:var(--line);color:var(--ink)}.quiet:hover{background:rgba(238,226,200,.5)}
.icon{border:0;background:none;padding:8px;border-radius:6px;color:var(--ink)}.icon:hover{background:rgba(238,226,200,.6)}
.avatar{width:36px;height:36px;border-radius:50%;background:var(--charcoal);color:var(--paper);border:0;font-size:14px;font-weight:600}
.pop{position:relative}
.panel-pop{display:none;position:absolute;right:0;top:calc(100% + 8px);width:280px;background:var(--paper);border:1px solid var(--line);border-radius:8px;padding:6px;box-shadow:0 12px 32px -8px rgba(36,34,32,.22);z-index:50}
.pop.open .panel-pop{display:block}
.panel-pop a,.panel-pop p{display:block;padding:8px 12px;font-size:14px;border-radius:4px}
.panel-pop a:hover{background:rgba(238,226,200,.6)}
.panel-pop p{color:var(--muted)}
.menu-btn{display:none}.menu-txt{font-size:14px;margin-left:6px}.menu-btn{align-items:center}

main{max-width:1152px;margin:0 auto;padding:40px 24px}
h1{font-size:32px;line-height:1.2}
.sub{color:var(--muted);margin-top:8px}
.card{background:var(--paper);border:1px solid var(--line);border-radius:8px;box-shadow:0 1px 2px rgba(36,34,32,.05)}
.figs{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);overflow:hidden;margin-top:32px}
.fig{background:var(--paper);padding:20px}
.fig:last-child{grid-column:span 2}
.fig dt{font-size:14px;color:var(--muted)}
.fig dd{font-weight:500;font-family:var(--serif);font-size:32px;color:var(--charcoal);margin-top:4px;line-height:1.2}
.fig small{display:block;font-size:12px;color:var(--muted);margin-top:4px}
.cols{display:grid;grid-template-columns:2fr 1fr;gap:24px;margin-top:32px}
.card.pad{padding:24px}
h2{font-size:20px}
.empty{margin-top:24px;border:1px dashed var(--line);border-radius:6px;padding:24px;display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.empty b{color:var(--charcoal);font-weight:600}
.empty p{font-size:14px;color:var(--muted);max-width:420px}
.muted{font-size:14px;color:var(--muted);margin-top:8px}
.stack{display:flex;flex-direction:column;gap:24px}
.badge{display:inline-flex;border-radius:999px;background:var(--gold-soft);color:var(--gold-deep);font-size:12px;font-weight:600;padding:2px 10px}
.ev{display:flex;justify-content:space-between;gap:16px;align-items:center;padding:14px 0;border-top:1px solid var(--line)}
.ev:first-of-type{border-top:0}
.ev b{display:block;color:var(--charcoal);font-weight:600}
.ev span.m{font-size:14px;color:var(--muted)}
.bar{width:96px;height:6px;background:var(--line);border-radius:3px;overflow:hidden}
.bar i{display:block;height:100%;background:var(--gold)}
.sample{display:flex;gap:8px;align-items:center;margin-top:20px;font-size:14px;color:var(--muted)}
.sample button{border:1px solid var(--line);background:var(--paper);border-radius:6px;padding:4px 12px;color:var(--ink)}
.sample button[aria-pressed=true]{background:var(--charcoal);color:var(--paper);border-color:var(--charcoal)}
.swatches{display:flex;gap:10px;align-items:center;margin-top:12px;font-size:14px;color:var(--muted);flex-wrap:wrap}
.sw{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);background:var(--paper);border-radius:999px;padding:4px 12px 4px 6px;color:var(--ink)}
.sw i{width:18px;height:18px;border-radius:50%;border:1px solid rgba(36,34,32,.25);display:block}
.sw[aria-pressed=true]{border-color:var(--charcoal);box-shadow:0 0 0 1px var(--charcoal)}
.tag{margin-left:8px;font-size:12px;color:var(--gold-deep);background:var(--gold-soft);padding:2px 8px;border-radius:999px}
.sec .card{max-width:672px;margin-top:32px;padding:24px}
.sec ul{margin:8px 0 0 20px;font-size:14px}.sec li{margin-top:6px}
.sec .row{display:flex;justify-content:space-between;align-items:center;gap:12px}
.sec .lede{font-size:18px;color:var(--muted);margin-top:12px;max-width:640px}
.sec h1{display:flex;gap:12px;align-items:center}.sec h1 svg{color:var(--gold-deep);width:24px;height:24px}
.hidden{display:none!important}
.scrim{display:none;position:fixed;inset:0;background:rgba(36,34,32,.5);z-index:30}

@media (max-width:1023px){
  .rail{transform:translateX(-100%);width:280px}
  body.drawer .rail{transform:none}
  body.drawer .scrim{display:block}
  .wrap,body.slim .wrap{padding-left:0}
  body.slim .brand .t,body.slim .grp p,body.slim .nav span{display:revert}
  body.slim .rail{width:280px}.collapse{display:none}
  .menu-btn{display:flex}
  .search{order:5;max-width:none;flex-basis:100%}
  .figs{grid-template-columns:repeat(2,1fr)}
  .cols{grid-template-columns:1fr}
}
@media (max-width:560px){.figs{grid-template-columns:1fr}.fig:last-child{grid-column:auto}.hide-s{display:none}main{padding:24px 16px}header{padding:12px 16px}}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* ---- working app additions ---- */
.in{width:100%;border:1px solid var(--line);background:var(--paper);border-radius:6px;padding:8px 12px;font:inherit;color:var(--ink)}
.in:focus{border-color:var(--gold-deep)}
.in[aria-invalid=true]{border-color:#B3402F}
textarea.in{min-height:84px;resize:vertical}
a.nav{text-decoration:none}
.scroll{overflow-x:auto}
.tbl{width:100%;border-collapse:collapse;font-size:14px}
.tbl th{text-align:left;font-weight:600;color:var(--muted);padding:10px 12px;border-bottom:1px solid var(--line);white-space:nowrap}
.tbl td{padding:12px;border-bottom:1px solid var(--line);vertical-align:top}
.tbl tr:last-child td{border-bottom:0}
.tbl .r{text-align:right;white-space:nowrap}
.tbl a.lnk{color:var(--charcoal);font-weight:600}.tbl a.lnk:hover{text-decoration:underline}
.sm{font-size:12px;color:var(--muted)}
.toolbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:24px 0 16px}
.toolbar .in{width:auto;min-width:150px}
.toolbar label.chk{display:flex;gap:6px;align-items:center;font-size:14px;color:var(--muted)}
.toolbar .grow{flex:1}
.page-head{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-start;justify-content:space-between}
.crumbs{font-size:14px;color:var(--muted);margin-bottom:8px}.crumbs a{text-decoration:underline}
.st{display:inline-flex;border-radius:999px;font-size:12px;font-weight:600;padding:2px 10px;white-space:nowrap}
.st-good{background:#DCEBDD;color:#2A5630}.st-warn{background:var(--gold-soft);color:var(--gold-deep)}
.st-bad{background:#F3DAD6;color:#8A2D22}.st-info{background:#D9E4EF;color:#294A6B}.st-mute{background:#E3E5E3;color:#55595A}
.btn.sm2{padding:4px 10px;font-size:13px}
.btn.danger{background:var(--paper);border-color:#D9A9A1;color:#8A2D22}.btn.danger:hover{background:#F3DAD6}
.linkbtn{border:0;background:none;color:var(--gold-deep);text-decoration:underline;padding:2px 6px;font-size:13px}
.acts{display:flex;gap:2px;flex-wrap:wrap;justify-content:flex-end}
.tabs{display:flex;gap:4px;flex-wrap:wrap;border-bottom:1px solid var(--line);margin:24px 0}
.tabs a,.tabs span{padding:10px 14px;font-size:14px;border-bottom:2px solid transparent;color:var(--muted)}
.tabs a.on{color:var(--charcoal);border-color:var(--gold-deep);font-weight:600}
.tabs span{opacity:.6}
.overlay{position:fixed;inset:0;background:rgba(36,34,32,.5);z-index:100;display:flex;align-items:flex-start;justify-content:center;overflow-y:auto;padding:5vh 16px}
.dialog{background:var(--paper);border-radius:10px;width:100%;max-width:720px;padding:24px;box-shadow:0 20px 50px -10px rgba(36,34,32,.4)}
.dialog h2{margin-bottom:16px}
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.fl{display:flex;flex-direction:column;gap:4px}.fl.wide{grid-column:1/-1}
.fl label{font-size:14px;font-weight:600;color:var(--charcoal)}.fl small{color:var(--muted);font-size:12px}
.err{color:#8A2D22;font-size:14px;margin-top:12px;min-height:20px}
.dact{display:flex;justify-content:flex-end;gap:8px;margin-top:8px;flex-wrap:wrap}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:var(--charcoal);color:var(--paper);padding:10px 18px;border-radius:8px;z-index:200;max-width:90vw;font-size:14px}
.board{display:flex;gap:12px;overflow-x:auto;padding-bottom:8px}
.col{min-width:230px;flex:1;background:rgba(255,255,255,.45);border:1px solid var(--line);border-radius:8px;padding:10px}
.col h3{font-family:var(--sans);font-size:14px;font-weight:600;color:var(--charcoal);margin-bottom:8px;display:flex;justify-content:space-between}
.tcard{background:var(--paper);border:1px solid var(--line);border-radius:6px;padding:10px;margin-bottom:8px;font-size:14px}
.tcard b{font-weight:600;color:var(--charcoal);display:block}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));background:var(--paper);overflow:hidden;margin:20px 0}
.kpis div{padding:16px;box-shadow:1px 0 0 var(--line),0 1px 0 var(--line)}.kpis dt{font-size:13px;color:var(--muted)}.kpis dd{font-family:var(--serif);font-size:26px;color:var(--charcoal);margin-top:2px}
.kpis small{display:block;color:var(--muted);font-size:12px}
.neg{color:#8A2D22}.pos{color:#2A5630}
.alert{display:flex;gap:10px;padding:10px 0;border-top:1px solid var(--line);font-size:14px}.alert:first-of-type{border-top:0}
.alert i.dot{width:8px;height:8px;border-radius:50%;margin-top:7px;flex:none}
.dot.bad{background:#B3402F}.dot.warn{background:var(--gold)}.dot.info{background:#4A6F96}
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:8px;overflow:hidden}
.cal .dow{background:var(--ivory);padding:6px;font-size:12px;color:var(--muted);text-align:center}
.cal .day{background:var(--paper);min-height:96px;padding:4px;font-size:12px;overflow:hidden}
.cal .day.out{background:rgba(250,251,252,.55);color:var(--muted)}
.cal .day.today .n{background:var(--charcoal);color:var(--paper);border-radius:50%;display:inline-block;width:20px;text-align:center}
.cal .chip{display:block;border-radius:3px;padding:1px 4px;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:11px}
.chip.e{background:var(--charcoal);color:var(--paper)}.chip.t{background:var(--gold-soft);color:var(--gold-deep)}.chip.p{background:#D9E4EF;color:#294A6B}
.split{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.bar{width:100%;min-width:70px}
.barfill{height:6px;background:var(--line);border-radius:3px;overflow:hidden}.barfill i{display:block;height:100%;background:var(--gold)}.barfill i.over{background:#B3402F}
.dl{display:grid;grid-template-columns:150px 1fr;gap:8px 16px;font-size:14px}.dl dt{color:var(--muted)}
.empty{margin-top:16px}
.note{background:var(--gold-soft);color:var(--gold-deep);border-radius:6px;padding:10px 14px;font-size:14px;margin:16px 0}
.badgecount{position:absolute;top:2px;right:2px;background:#B3402F;color:#fff;border-radius:999px;font-size:11px;min-width:16px;height:16px;line-height:16px;text-align:center;padding:0 4px}
.pop{position:relative}
.panel-pop .sec-t{font-size:12px;color:var(--muted);padding:6px 12px 2px}
.panel-pop button.mi{display:block;width:100%;text-align:left;border:0;background:none;padding:8px 12px;border-radius:4px;font-size:14px}.panel-pop button.mi:hover{background:rgba(238,226,200,.6)}
@media (max-width:760px){.fgrid,.split{grid-template-columns:1fr}.dl{grid-template-columns:1fr}.cal .day{min-height:64px}.cal .chip{font-size:10px}}
.cols>*,.split>*,.stack>*{min-width:0}
.kpis.k4{grid-template-columns:repeat(4,1fr)}
.kpis.k4>div:last-child{grid-column:span 2}
@media (max-width:1100px){.kpis.k4{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.kpis.k4{grid-template-columns:1fr}.kpis.k4>div:last-child{grid-column:auto}}

.kpis dd,.fig dd{font-weight:500}
.tbl td{color:var(--ink)}
.in{color:var(--ink);font-weight:500}
.tbl td.neg,.kpis dd.neg,.sm.neg{color:#8A2D22}
.tbl td.pos{color:#2A5630}

/* guests, seating, run of show */
.tcards{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px}
.tcard h3{font-size:20px}
.bar{height:8px;background:var(--line);border-radius:4px;overflow:hidden;margin:10px 0 6px}
.bar i{display:block;height:100%;background:var(--gold)}.bar i.full{background:#2A5630}.bar i.over{background:#B3402F}
.seated{list-style:none;padding:0;margin:6px 0 0}
.seated li{display:flex;justify-content:space-between;gap:8px;align-items:center;padding:5px 0;border-top:1px solid var(--line);font-size:14px}
.runlist{list-style:none;padding:0;margin:0}
.runlist li{display:grid;grid-template-columns:96px 1fr auto;gap:16px;padding:14px 8px;border-top:1px solid var(--line);align-items:start}
.runlist li:first-child{border-top:0}
.runlist .tm b{display:block;font-family:var(--serif);font-size:22px;font-weight:500;color:var(--charcoal)}
.runlist .bd label.chk{display:inline-flex;gap:10px;align-items:center;cursor:pointer;font-size:16px;color:var(--charcoal)}
.runlist .bd .rn{font-size:14px;margin-top:4px;color:var(--ink)}
.runlist li.done .bd b{text-decoration:line-through;color:var(--muted)}
.runlist li.now{background:var(--gold-soft);border-radius:6px}
@media (max-width:560px){.runlist li{grid-template-columns:1fr;gap:6px}.runlist .tm b{display:inline}.runlist .acts{justify-content:flex-start}}
@media print{
  .rail,aside,.sidebar,header,#scrim,.np,.toolbar,.tabs,.crumbs,.acts,.btn,#modal{display:none!important}
  body{background:#fff}main{padding:0!important;margin:0!important}
  .card{box-shadow:none}.runlist li.now{background:none}
}
@media (max-width:560px){.tbl th:first-child,.tbl td:first-child{min-width:140px}}
.fl[hidden]{display:none}
.tbl tr.canc td{color:var(--muted);text-decoration:line-through}
.tbl tr.canc td:last-child,.tbl tr.canc td:nth-last-child(2){text-decoration:none}
.tbl tfoot td{font-weight:500;border-top:1px solid var(--line);padding-top:10px;padding-bottom:10px}
.tbl tfoot tr.grand td{font-family:var(--serif);font-size:18px;color:var(--charcoal);border-top:2px solid var(--charcoal)}

.ready{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.ready li{display:flex;gap:10px;align-items:flex-start}
.ready .dot{margin-top:7px;flex:none;width:8px;height:8px;border-radius:50%;display:inline-block}.dot.ok{background:#2f7d4f}
.bgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}
.swatches{display:flex;gap:6px;margin-top:12px;flex-wrap:wrap}.sw{width:56px;height:56px;border-radius:10px;border:1px solid rgba(0,0,0,.12);position:relative;overflow:hidden}
.sw em{position:absolute;bottom:0;left:0;right:0;font:600 9px/1.4 system-ui;text-align:center;background:rgba(255,255,255,.85);color:#222;font-style:normal}
.ideas{margin:10px 0 0;padding-left:18px}.ideas li{margin:2px 0}
.bcard.canc{opacity:.6}
@media print{.bgrid{display:block}}

.room{container-type:inline-size;position:relative;width:100%;aspect-ratio:16/10;background:#FBF9F4;border:2px solid var(--line);border-radius:12px;overflow:hidden;touch-action:none;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:10% 10%}
.ft{position:absolute;transform:translate(-50%,-50%);border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;cursor:grab;user-select:none;border:2px solid #1F3A5F;background:#fff;color:var(--charcoal);font-size:12px;line-height:1.2;padding:4px;overflow:hidden}
.ft b{font-size:clamp(9px,1.4cqw,13px);font-weight:700;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ft span{font-size:11px}
.ft.p-part{background:#EBD9AE}.ft.p-full{background:#CFE5D5;border-color:#2f7d4f}.ft.p-over{background:#F3CFC8;border-color:#B3402F}
.ff{position:absolute;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;text-align:center;font-size:12px;font-weight:600;color:#fff;background:#6F8FB5;border-radius:8px;cursor:grab;user-select:none;padding:2px;opacity:.92}
.ft.sel,.ff.sel,.ft:focus-visible,.ff:focus-visible{outline:3px solid var(--gold-deep,#B8995A);outline-offset:2px;z-index:3}.ft.drag,.ff.drag{cursor:grabbing;z-index:4;box-shadow:0 6px 18px rgba(0,0,0,.25)}
.lgi{display:inline-block;width:14px;height:14px;border-radius:50%;border:2px solid #1F3A5F;background:#fff;vertical-align:-2px;margin-right:4px}.lgi.p-part{background:#EBD9AE}.lgi.p-full{background:#CFE5D5;border-color:#2f7d4f}.lgi.p-over{background:#F3CFC8;border-color:#B3402F}
.blegend{display:flex;gap:16px;flex-wrap:wrap;font-size:13px}.blegend .lg{display:flex;align-items:center;gap:4px}
@media print{.room{-webkit-print-color-adjust:exact;print-color-adjust:exact}}

.bstack{position:relative;display:flex;height:28px;background:var(--line);border-radius:6px;margin-top:28px}
.bstack i{display:block;height:100%}.bstack i:first-child{border-radius:6px 0 0 6px}
.bstack .paid,.blegend .paid{background:#1F3A5F}.bstack .owed,.blegend .owed{background:#6F8FB5}.bstack .est,.blegend .est{background:repeating-linear-gradient(45deg,#D9BE8A 0 6px,#EBD9AE 6px 12px)}
.bstack.over{box-shadow:inset 0 0 0 2px #B3402F}.bstack.under,.bstack.on{box-shadow:inset 0 0 0 2px #2f7d4f}
.bmark{position:absolute;top:-8px;bottom:-8px;border-left:2px dashed var(--charcoal)}.bmark span{position:absolute;top:-22px;left:50%;transform:translateX(-50%);white-space:nowrap;font-size:12px;font-weight:600;color:var(--charcoal)}
ul.blegend{list-style:none;margin:12px 0 0;padding:0}.blegend li{display:flex;gap:6px;align-items:center}.blegend li i,.blegend i.lgb{display:inline-block;width:12px;height:12px;border-radius:3px}
.blegend i.bud{background:#C9CED6}.blegend i.under{background:#2f7d4f}.blegend i.over{background:#B3402F}
.cchart{display:flex;flex-direction:column;gap:10px;margin-top:12px}.crow{display:grid;grid-template-columns:150px 1fr 110px;gap:12px;align-items:center}
.cname{font-weight:600;color:var(--charcoal);font-size:14px}.cbars{display:flex;flex-direction:column;gap:3px}.cb{height:10px;border-radius:3px;min-width:2px}
.cb.bud{background:#C9CED6}.cb.prj{background:#1F3A5F}.cb.prj.under{background:#2f7d4f}.cb.prj.over{background:#B3402F}.cval{font-size:13px;text-align:right}
@media(max-width:600px){.crow{grid-template-columns:1fr 90px}.cname{grid-column:1/3}.cbars{grid-column:1}.bmark span{font-size:11px}}
@media print{.bstack,.cb,.blegend i{-webkit-print-color-adjust:exact;print-color-adjust:exact}}

.demo.ok{background:#E3EFE7;color:#1F4D33}.demo.warn{background:#F5E1DB;color:#7A2E22}.demo .linkbtn{color:inherit;font-weight:600;text-decoration:underline}

/* Home photos */
.phgrid{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:150px;gap:10px}
.ph{position:relative;margin:0;border-radius:12px;overflow:hidden;background:var(--mist,#E9EEF2);border:1px solid rgba(36,34,32,.14)}
.ph.t0{grid-column:span 2;grid-row:span 2}
.ph img{width:100%;height:100%;object-fit:cover;display:block}
.ph.add{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;border-style:dashed;color:#242220;font-weight:600;font-size:.85rem;cursor:pointer}
.ph.add:hover{background:#dde5ec}
.ph-in{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden}
.ph:focus-within{outline:2px solid #7F5F25;outline-offset:2px}
.ph figcaption{position:absolute;left:0;right:0;bottom:0;display:flex;gap:6px;padding:8px;background:linear-gradient(transparent,rgba(0,0,0,.55));opacity:0;transition:opacity .15s}
.ph:hover figcaption,.ph:focus-within figcaption{opacity:1}
.ph-btn{position:relative;background:#fff;color:#242220;border:0;border-radius:8px;padding:5px 10px;font:inherit;font-size:.78rem;font-weight:600;cursor:pointer}
@media(hover:none){.ph figcaption{opacity:1}}
@media(max-width:760px){.phgrid{grid-template-columns:repeat(2,1fr);grid-auto-rows:120px}.ph.t0{grid-column:span 2;grid-row:span 1}}
.ph.t5,.ph.t6{grid-column:span 2}
