/* Calfurn Product Development — v5 "quiet" theme */
:root{--bg:#fbf9f5;--paper:#fff;--ink:#26231e;--ink2:#5d574d;--muted:#958d80;--line:#e9e3d8;--line2:#f1ece3;--acc:#576c30;--acc-d:#435423;--acc-l:#eef1e6;--brand:#576c30;--bronze:#9a7448;--r:6px;
--serif:"Source Sans 3","Source Sans Pro",-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;--sans:"Source Sans 3","Source Sans Pro",-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:400 13.5px/1.6 var(--sans);-webkit-font-smoothing:antialiased;letter-spacing:-.005em}
a{color:var(--ink);text-decoration-color:var(--line);text-underline-offset:3px}a:hover{color:var(--acc-d)}
h1{font:500 2.136rem/1.1 var(--serif);letter-spacing:-.01em;margin:.1em 0 .35em}h1 small{font:400 .712rem var(--sans);color:var(--muted);letter-spacing:.08em;margin-left:.5em;vertical-align:middle}
h2{font:500 1.38rem/1.2 var(--serif);margin:0 0 .9em}
.wrap{max-width:1200px;margin:0 auto;padding:0 28px}
/* header */
.top{background:rgba(251,249,245,.92);backdrop-filter:saturate(1.2) blur(8px);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:10}
.bar{display:flex;align-items:center;gap:18px;min-height:72px}
/* logo: approved green horizontal lockup on light bg (Brand Guide p.3, p.6); never stretched/recoloured/effected (p.7) */
.brand{display:flex;align-items:center;gap:18px;text-decoration:none;color:var(--ink);padding:12px 0;margin-right:auto}
.brand img{display:block;height:26px;min-height:24px;width:auto}
.bt{font:500 .62rem var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--muted);padding-left:18px;border-left:1px solid var(--line);line-height:26px}
.hb{width:40px;height:40px;margin-left:-8px;border:0;background:transparent;border-radius:50%;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;cursor:pointer}
.hb span{display:block;width:20px;height:1.5px;background:var(--ink);border-radius:2px;transition:transform .3s}.hb:hover{background:var(--acc-l)}
.av{width:34px;height:34px;border-radius:50%;background:var(--brand);color:#fff;display:inline-flex;align-items:center;justify-content:center;font:600 .756rem var(--sans);text-decoration:none;flex:none}.av:hover{color:#fff;background:var(--acc-d)}
.scrim{position:fixed;inset:0;background:rgba(30,28,22,.32);backdrop-filter:blur(2px);z-index:40;opacity:0;transition:opacity .3s ease}
.drawer{position:fixed;top:0;left:0;bottom:0;width:min(320px,86vw);background:var(--paper);z-index:50;transform:translateX(-102%);transition:transform .32s cubic-bezier(.2,.7,.2,1);box-shadow:8px 0 40px rgba(30,28,22,.12);display:flex;flex-direction:column;padding:22px 26px;outline:0;visibility:hidden}
body.dopen .scrim{opacity:1}body.dopen .drawer{transform:none;visibility:visible}body.dopen{overflow:hidden}
.drawer{transition:transform .32s cubic-bezier(.2,.7,.2,1),visibility 0s .32s}body.dopen .drawer{transition:transform .32s cubic-bezier(.2,.7,.2,1)}
.dh{display:flex;align-items:center;justify-content:space-between;padding:6px 0 26px;border-bottom:1px solid var(--line)}.dh img{height:22px;width:auto;display:block}
.dx{border:0;background:transparent;width:36px;height:36px;border-radius:50%;cursor:pointer;margin-right:-8px}.dx:hover{background:var(--acc-l)}.dx svg{width:18px;height:18px;stroke:var(--ink);stroke-width:1.6;fill:none}
.dn{display:flex;flex-direction:column;padding:18px 0}.dn a{font:500 1.202rem var(--serif);text-decoration:none;color:var(--ink);padding:10px 0}.dn a:hover{color:var(--brand)}
.du{margin-top:auto;display:flex;gap:12px;align-items:flex-start;padding:18px 0;border-top:1px solid var(--line)}.du b{display:block;font-weight:600;font-size:.819rem}.du small{display:block;color:var(--muted);font-size:.712rem;word-break:break-all}.du .tagc{margin:6px 0 0;display:inline-block}
.dso{font-size:.765rem;color:var(--ink2);padding:6px 0}
.tagc{font:500 .62rem var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--bronze);border:1px solid #e3d5c2;border-radius:20px;padding:2px 8px;margin-left:6px;font-style:normal;vertical-align:middle}
main{padding:44px 28px 64px}.foot{color:var(--muted);font-size:.659rem;letter-spacing:.04em;padding:28px;border-top:1px solid var(--line)}
/* sections: hairlines, not boxes */
.card{background:transparent;border:0;border-top:1px solid var(--line);border-radius:0;padding:32px 0 8px;margin:0 0 20px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--ink);color:#fff;border:1px solid var(--ink);border-radius:var(--r);padding:10px 20px;font:500 .765rem var(--sans);letter-spacing:.02em;text-decoration:none;cursor:pointer;transition:background .15s,border-color .15s}
.btn:hover{background:var(--acc-d);border-color:var(--acc-d);color:#fff}.btn.ghost{background:transparent;color:var(--ink);border-color:var(--line)}.btn.ghost:hover{border-color:var(--ink);background:transparent;color:var(--ink)}
.btn.big{padding:13px 28px}.btn:disabled{opacity:.55}
.link{background:none;border:0;color:var(--muted);cursor:pointer;padding:0;font:inherit;font-size:.712rem;text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:3px}.link:hover{color:#9b3b1d}
input,select,textarea{font:inherit;font-size:.819rem;padding:11px 12px;border:1px solid var(--line);border-radius:var(--r);background:var(--paper);width:100%;color:var(--ink);transition:border-color .15s}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--acc);box-shadow:0 0 0 3px var(--acc-l)}::placeholder{color:#b5ad9f}
.head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:8px}
/* filters */
.filters{display:grid;grid-template-columns:2.2fr 1fr 1fr 1fr auto;gap:10px;margin:18px 0 36px;padding-bottom:28px;border-bottom:1px solid var(--line)}
.filters select,.filters input{background:transparent}
/* product grid */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:44px 28px}
.tile{text-decoration:none;color:inherit;display:block}
.ph{aspect-ratio:4/5;background:#f2ede4;border-radius:4px;overflow:hidden;display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:.641rem;letter-spacing:.14em;text-transform:uppercase}
.ph img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}.tile:hover .ph img{transform:scale(1.03)}
.tb{padding:16px 2px 0}.code{font:500 .62rem var(--sans);letter-spacing:.16em;color:var(--bronze);text-transform:uppercase}
.nm{font:500 1.264rem/1.2 var(--serif);margin:3px 0 2px}.meta{color:var(--muted);font-size:.712rem;min-height:1.3em}
.tl{display:flex;align-items:center;gap:10px;margin-top:12px;font-size:.676rem;color:var(--ink2)}.tl .pill{margin-left:auto}
.pill{display:inline-block;font:500 .62rem var(--sans);letter-spacing:.1em;text-transform:uppercase;padding:3px 9px;border-radius:20px;background:var(--acc-l);color:var(--acc-d);font-style:normal}
.st-approved{background:#eaf0e0;color:#41592a}.st-onhold{background:#f6ecdc;color:#8a6224}.st-dropped{background:#f0eeea;color:#9a958d}.st-sampling{background:#f3ebe1;color:#86603a}.st-concept{background:#f2f0ec;color:#6c665c}
/* stage dots */
.sbar{display:flex;align-items:center;gap:0}.sbar i{width:7px;height:7px;border-radius:50%;border:1px solid #cfc6b6;background:var(--paper);position:relative}
.sbar i+i{margin-left:9px}.sbar i+i::before{content:"";position:absolute;right:8px;top:2px;width:9px;height:1px;background:var(--line)}
.sbar i.done{background:var(--acc);border-color:var(--acc)}.sbar i.done+i::before{background:var(--acc)}.sbar i.now{background:var(--paper);border:2px solid var(--acc);width:9px;height:9px}
/* forms */
.form{display:grid;grid-template-columns:1fr 1fr;gap:22px 28px;border-top:1px solid var(--line);padding-top:32px}.form label{font-size:.641rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);display:flex;flex-direction:column;gap:8px}
.form label input,.form label select,.form label textarea{text-transform:none;letter-spacing:normal;font-size:.845rem}.form .full{grid-column:1/-1}.actions{display:flex;gap:20px;align-items:center}
/* product page */
.back{display:inline-block;margin-bottom:18px;font-size:.694rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);text-decoration:none}.back::before{content:"\2190  "}.back:hover{color:var(--ink)}
.details{display:grid;grid-template-columns:repeat(4,1fr);gap:24px 32px;padding-top:28px}
.details b{display:block;font:500 .62rem var(--sans);color:var(--muted);text-transform:uppercase;letter-spacing:.14em;margin-bottom:4px}.details .full{grid-column:1/-1}
.stages{display:flex;gap:0;overflow-x:auto;margin:10px 0 0;border-bottom:1px solid var(--line);scrollbar-width:none}.stages::-webkit-scrollbar{display:none}
.stages a{white-space:nowrap;padding:14px 18px 13px;color:var(--muted);text-decoration:none;font-size:.765rem;border-bottom:1.5px solid transparent;margin-bottom:-1px;position:relative}
.stages a:hover{color:var(--ink)}.stages a.act{color:var(--ink);border-bottom-color:var(--ink)}.stages a.cur::after{content:"";position:absolute;top:10px;right:7px;width:5px;height:5px;border-radius:50%;background:var(--acc)}
.stages small{color:var(--muted);font-size:.641rem;margin-left:3px}
.stages+.card{border-top:0}
/* upload */
.upl{display:flex;gap:12px;flex-wrap:wrap;align-items:center}.upl input[name=caption]{flex:1;min-width:180px}
.pick{display:grid;grid-template-columns:1fr 1fr;gap:12px;width:100%}
.bigbtn{display:flex;align-items:center;justify-content:center;gap:10px;min-height:58px;border-radius:var(--r);font:500 .819rem var(--sans);cursor:pointer;padding:12px;transition:background .15s,border-color .15s}
.bigbtn input{display:none}.ic{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linejoin:round;stroke-linecap:round}
.bigbtn.cam{background:var(--ink);color:#fff}.bigbtn.cam:hover{background:var(--acc-d)}.bigbtn.gal{background:var(--paper);color:var(--ink);border:1px solid var(--line)}.bigbtn.gal:hover{border-color:var(--ink)}
.queue{width:100%;border:1px solid var(--line);border-radius:var(--r);padding:14px;background:var(--paper)}.qhead{display:flex;justify-content:space-between;margin-bottom:12px;font-size:.748rem;color:var(--ink2)}.qhead b{font-weight:500}
.qgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:8px}.qi{position:relative}.qi img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:4px}
.qi button{position:absolute;top:5px;right:5px;width:26px;height:26px;border-radius:50%;border:0;background:rgba(255,255,255,.92);box-shadow:0 1px 4px rgba(0,0,0,.15);cursor:pointer;padding:6px;display:flex}
.qi button svg{width:14px;height:14px;stroke:var(--ink);stroke-width:1.6;fill:none}
.btn.up{min-height:48px;padding:0 30px}
.photos{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:32px 22px;margin-top:28px}.photos figure{margin:0}
.photos img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:4px;background:#f2ede4}
figcaption{font-size:.765rem;padding-top:10px;line-height:1.45}.pa{display:flex;gap:16px;font-size:.694rem;margin-top:6px}.pa a{color:var(--muted)}.pa form{display:inline}
/* notes */
.note{display:flex;flex-direction:column;gap:12px;align-items:flex-start;margin-bottom:18px}.nt{border-top:1px solid var(--line2);padding:16px 0}.nt>div:first-child{margin-bottom:4px}.inl{display:inline;margin-left:10px}
.costing h2 .tagc{font-size:.58rem}table{width:100%;border-collapse:collapse;margin-top:18px;font-size:.783rem}td{padding:12px 6px 12px 0;border-top:1px solid var(--line2)}
.acts{list-style:none;padding:0;margin:0}.acts li{padding:13px 0;border-top:1px solid var(--line2);font-size:.783rem;color:var(--ink2)}.acts li:first-child{border-top:0}.acts b{font-weight:500;color:var(--ink)}
.muted{color:var(--muted)}.small{font-size:.676rem}
.flash{background:var(--paper);border:1px solid var(--line);border-left:2px solid var(--acc);padding:12px 16px;border-radius:var(--r);margin-bottom:28px;font-size:.783rem;box-shadow:0 2px 10px rgba(60,50,30,.04)}
.err{color:#8e3a1f;background:#fbf1ec;padding:10px 14px;border-radius:var(--r);font-size:.783rem}
.login{max-width:420px;margin:9vh auto;text-align:center;padding:48px 36px;border:1px solid var(--line);border-radius:10px;background:var(--paper);box-shadow:0 10px 40px rgba(60,50,30,.06)}.login .lgw{padding:8px 0 30px}.login .lg{display:block;margin:0 auto;height:40px;width:auto}.login h1{font-size:1.869rem}
@media (max-width:760px){
 body{font-size:14px}
 .wrap,main{padding-left:18px;padding-right:18px}main{padding-top:26px}h1{font-size:1.736rem}
 .bar{min-height:60px;gap:12px}.brand{padding:10px 0}.brand img{height:24px}.bt{display:none}.login{padding:40px 24px}.login .lg{height:34px}
 .filters{grid-template-columns:1fr 1fr;margin-bottom:26px}.filters input{grid-column:1/-1}.filters .btn{grid-column:1/-1}
 .grid{grid-template-columns:1fr 1fr;gap:28px 14px}.nm{font-size:1.023rem}.tl{flex-wrap:wrap;gap:6px}.tl .pill{margin-left:0}.tl .stg{display:none}
 .details{grid-template-columns:1fr 1fr;gap:18px}.form{grid-template-columns:1fr}.photos{grid-template-columns:1fr 1fr;gap:18px 12px}
 .upl .btn.up,.upl input[name=caption]{width:100%;flex:auto}.bigbtn{min-height:64px;flex-direction:column;gap:6px;font-size:.765rem}
}

.nphotos{border-top:1px solid var(--line);padding-top:22px;margin-top:6px}.nphotos h2{margin-bottom:.6em}.nphotos .pst{max-width:280px;margin-bottom:14px}.nphotos .pick{margin-bottom:12px}
