:root{
  /* Quintessence brand six */
  --aub:#28212B; --cream:#F8F5EC; --dlilac:#55456E; --lilac:#D2C3E3; --yellow:#FBDD8E; --sage:#C9D39A;
  --warn:#A84A2E;   /* terracotta: over allowance, overdue. Cream text on it passes AA. */
  --paper:#FFFFFF; --line:rgba(40,33,43,.13); --muted:rgba(40,33,43,.62);
  --serif:"Libre Caslon Text","Big Caslon","Adobe Caslon Pro",Georgia,serif;
  --sans:"Avenir Next","Avenir","Nunito Sans","Helvetica Neue",Arial,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--cream);color:var(--aub);font-family:var(--sans);font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:var(--serif);font-weight:400;margin:0;line-height:1.15}
a{color:var(--dlilac)}
button{font-family:var(--sans);font-size:14px;cursor:pointer}
input,select,textarea{font-family:var(--sans);font-size:14px;color:var(--aub)}
mark,.hl{background:linear-gradient(transparent 52%,var(--yellow) 52%,var(--yellow) 92%,transparent 92%);color:inherit;padding:0 .08em}
.hl-sage{background:linear-gradient(transparent 52%,var(--sage) 52%,var(--sage) 92%,transparent 92%)}
.hl-lilac{background:linear-gradient(transparent 52%,var(--lilac) 52%,var(--lilac) 92%,transparent 92%)}
.eyebrow{font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--dlilac);font-weight:600}

/* App chrome */
header.app{background:var(--aub);color:var(--cream);padding:18px 28px 0}
.brandrow{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap}
.wordmark{font-family:var(--serif);font-size:26px;font-weight:700;letter-spacing:-.02em;line-height:1}
.brandrow .eyebrow{color:var(--lilac);margin-top:6px}
.projtitle{font-family:var(--serif);font-style:italic;font-size:20px;color:var(--cream)}
.actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.btn{border:1px solid transparent;border-radius:999px;padding:7px 16px;background:var(--sage);color:var(--aub);font-weight:600}
.btn:hover{filter:brightness(.95)}
.btn.ghost{background:transparent;border-color:rgba(248,245,236,.4);color:var(--cream)}
.btn.lil{background:var(--lilac)}
.btn.yel{background:var(--yellow)}
.btn.line{background:transparent;border-color:var(--line);color:var(--aub)}
.btn.small{padding:4px 12px;font-size:13px}
.savestate{font-size:12px;color:var(--lilac);min-width:60px;text-align:right}
.backup-due{color:var(--yellow);font-weight:600}
nav.tabs{display:flex;gap:2px;margin-top:16px;overflow-x:auto}
nav.tabs button{background:transparent;border:0;color:var(--lilac);padding:10px 16px;border-radius:10px 10px 0 0;font-weight:600;white-space:nowrap}
nav.tabs button.on{background:var(--cream);color:var(--aub)}
main{padding:28px;max-width:1320px;margin:0 auto}
.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin:0 0 14px;flex-wrap:wrap}
.section-head h2{font-size:30px}
.section-head h2 em{font-style:italic}
.panel{background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:20px 22px;margin-bottom:22px}
.panel h3{font-size:20px;margin-bottom:10px}
.grid{display:grid;gap:18px}
.g4{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
.g2{grid-template-columns:repeat(auto-fit,minmax(380px,1fr))}
.kpi{background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:16px 18px}
.kpi .n{font-family:var(--serif);font-size:34px;line-height:1.1}
.kpi .l{font-size:13px;color:var(--muted)}
.kpi.y{background:var(--yellow);border-color:transparent}
.kpi.lil{background:var(--lilac);border-color:transparent}
.kpi.s{background:var(--sage);border-color:transparent}
.muted{color:var(--muted)}
.small{font-size:13px}
ul.clean{list-style:none;padding:0;margin:0}
ul.clean li{padding:8px 0;border-bottom:1px solid var(--line);display:flex;gap:10px;align-items:baseline}
ul.clean li:last-child{border-bottom:0}
.date{font-variant-numeric:tabular-nums;font-size:13px;color:var(--dlilac);font-weight:600;white-space:nowrap;min-width:84px}
.tag{display:inline-block;font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;padding:2px 8px;border-radius:999px;background:var(--cream);color:var(--dlilac);white-space:nowrap}
.tag.y{background:var(--yellow);color:var(--aub)}
.tag.l{background:var(--lilac);color:var(--aub)}
.tag.s{background:var(--sage);color:var(--aub)}
.tag.d{background:var(--aub);color:var(--cream)}

/* Editable tables */
.filters{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:14px}
.filters select,.filters label{font-size:13px}
.tbl{width:100%;border-collapse:collapse}
.tbl th{text-align:left;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--dlilac);font-weight:600;padding:6px 6px 8px;border-bottom:1px solid var(--line)}
.tbl td{padding:5px 6px;border-bottom:1px solid var(--line);vertical-align:top}
.tbl tr:last-child td{border-bottom:0}
.tbl tfoot td{font-weight:700;border-top:2px solid var(--aub);border-bottom:0}
.tbl input[type=text],.tbl input[type=number],.tbl input[type=date],.tbl input[type=email],.tbl select,.tbl textarea{width:100%;border:1px solid transparent;background:transparent;border-radius:8px;padding:5px 7px}
.tbl input:hover,.tbl select:hover,.tbl textarea:hover{border-color:var(--line)}
.tbl input:focus,.tbl select:focus,.tbl textarea:focus{outline:none;border-color:var(--dlilac);background:var(--paper)}
.tbl textarea{resize:vertical;min-height:32px;font-size:13px}
.tbl .num{text-align:right;font-variant-numeric:tabular-nums}
.tbl input.num{text-align:right}
.del{border:0;background:transparent;color:var(--muted);font-size:18px;line-height:1;padding:4px 6px;border-radius:6px}
.del:hover{background:var(--lilac);color:var(--aub)}
.addrow{margin-top:10px}
.phase-h{font-family:var(--serif);font-size:22px;margin:22px 0 6px;display:flex;align-items:baseline;gap:12px}
.phase-h .muted{font-family:var(--sans);font-size:13px}

.task{display:grid;grid-template-columns:28px minmax(220px,2.4fr) 140px 120px 155px 1.4fr 30px;gap:8px;align-items:start;padding:8px 6px;border-bottom:1px solid var(--line)}
.task.head{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--dlilac);font-weight:600;padding-bottom:6px}
.task.done .title{text-decoration:line-through;color:var(--muted)}
.task.overdue{background:linear-gradient(90deg,rgba(251,221,142,.55),transparent 70%)}
.task input[type=text],.task input[type=date],.task select,.task textarea{width:100%;border:1px solid transparent;background:transparent;border-radius:8px;padding:5px 7px}
.task input:hover,.task select:hover,.task textarea:hover{border-color:var(--line)}
.task input:focus,.task select:focus,.task textarea:focus{outline:none;border-color:var(--dlilac);background:var(--paper)}
.task .title{font-weight:600}
.task .lisatext{font-size:12.5px;color:var(--dlilac)}
.task textarea{font-size:13px;min-height:32px;resize:vertical}
.flags{display:flex;gap:6px;flex-wrap:wrap;padding:2px 7px}
.flag{font-size:11px;font-weight:600;border:1px solid var(--line);border-radius:999px;padding:2px 8px;background:transparent;color:var(--muted);letter-spacing:.03em}
.flag.on.share{background:var(--sage);border-color:var(--sage);color:var(--aub)}
.flag.on.need{background:var(--lilac);border-color:var(--lilac);color:var(--aub)}
.flag.on.mile{background:var(--yellow);border-color:var(--yellow);color:var(--aub)}
input[type=checkbox]{accent-color:var(--dlilac);width:17px;height:17px;margin-top:8px}

/* Lisa update */
.upd-wrap{display:grid;grid-template-columns:300px minmax(0,1fr);gap:24px;align-items:start}
.upd-settings label{display:block;font-size:12px;font-weight:600;color:var(--dlilac);letter-spacing:.06em;text-transform:uppercase;margin:12px 0 4px}
.upd-settings input[type=text],.upd-settings input[type=date],.upd-settings textarea{width:100%;border:1px solid var(--line);border-radius:10px;padding:8px 10px;background:var(--cream)}
.upd-settings textarea{min-height:120px;resize:vertical;line-height:1.45}
.upd-settings .row{display:flex;gap:8px;align-items:center;margin-top:10px;font-size:14px}
.upd-settings .row input{margin:0}
.upd-settings .btns{display:flex;flex-direction:column;gap:8px;margin-top:16px}

#lisaCard{width:100%;max-width:1080px;background:var(--cream);border-radius:28px;overflow:hidden;box-shadow:0 1px 0 var(--line),0 18px 50px rgba(40,33,43,.12);margin:0 auto}
.lc-top{background:var(--aub);color:var(--cream);padding:22px 44px;display:flex;justify-content:space-between;align-items:center}
.lc-top .wordmark{font-size:28px}
.lc-top .eyebrow{color:var(--lilac);margin-top:6px;font-size:10.5px}
.lc-top .when{text-align:right;font-size:13px;color:var(--lilac);letter-spacing:.12em;text-transform:uppercase;font-weight:600}
.lc-top .when b{display:block;font-family:var(--serif);font-size:20px;letter-spacing:0;text-transform:none;color:var(--cream);font-weight:400;margin-top:2px}
.lc-hero{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:40px;padding:40px 44px 10px;align-items:end}
.lc-hero h1{font-size:46px;margin:10px 0 18px;letter-spacing:-.01em}
.lc-hero h1 em{font-style:italic}
.lc-hero p{font-size:16.5px;line-height:1.6;margin:0 0 12px;white-space:pre-line}
.arch{width:300px;height:380px;border-radius:150px 150px 0 0;overflow:hidden;background:var(--lilac);position:relative}
.arch img{width:100%;height:100%;object-fit:cover;display:block}
.arch .cap{position:absolute;left:0;right:0;bottom:0;background:linear-gradient(transparent,rgba(40,33,43,.7));color:var(--cream);font-size:12px;padding:30px 16px 10px;letter-spacing:.06em}
.stepper{display:flex;gap:0;padding:28px 44px 6px}
.step{flex:1;position:relative;padding:26px 12px 0 0;font-size:13px;line-height:1.3}
.step::before{content:"";position:absolute;top:8px;left:0;right:0;height:3px;background:var(--lilac)}
.step .dot{position:absolute;top:0;left:0;width:19px;height:19px;border-radius:50%;background:var(--cream);border:3px solid var(--lilac);z-index:1}
.step.done::before{background:var(--dlilac)}
.step.done .dot{background:var(--dlilac);border-color:var(--dlilac)}
.step.done .dot::after{content:"";position:absolute;left:4px;top:1px;width:4px;height:8px;border:solid var(--cream);border-width:0 2px 2px 0;transform:rotate(45deg)}
.step.now .dot{background:var(--yellow);border-color:var(--aub)}
.step.now b{background:linear-gradient(transparent 52%,var(--yellow) 52%,var(--yellow) 92%,transparent 92%)}
.step b{display:inline;font-weight:600}
.step span{display:block;color:var(--muted);font-size:12px;margin-top:2px}
.lc-progress{padding:10px 44px 0;display:flex;align-items:center;gap:16px;font-size:13px;color:var(--dlilac);font-weight:600}
.bar{flex:1;height:8px;background:rgba(210,195,227,.6);border-radius:99px;overflow:hidden}
.bar i{display:block;height:100%;background:var(--dlilac);border-radius:99px}
.lc-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;padding:26px 44px}
.lc-col{background:var(--paper);border-radius:20px;padding:20px 22px}
.lc-col h3{font-size:21px;margin-bottom:12px}
.lc-col h3 em{font-style:italic}
.lc-col ul{list-style:none;margin:0;padding:0}
.lc-col li{padding:7px 0 7px 18px;position:relative;font-size:14.5px;line-height:1.4;border-bottom:1px solid var(--line)}
.lc-col li:last-child{border-bottom:0}
.lc-col li::before{content:"";position:absolute;left:0;top:13px;width:8px;height:8px;border-radius:50%}
.lc-col.done li::before{background:var(--sage)}
.lc-col.next li::before{background:var(--yellow)}
.lc-col.need li::before{background:var(--lilac)}
.lc-col.need{background:var(--lilac)}
.lc-col.need li{border-color:rgba(40,33,43,.12)}
.lc-col.need li::before{background:var(--dlilac)}
.lc-col li small{display:block;color:var(--dlilac);font-weight:600;font-size:12px;margin-top:2px}
.lc-col .empty{font-size:14px;color:var(--muted);font-style:italic}
.lc-dates{padding:0 44px 6px}
.chips{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
.chip{border:1.5px solid var(--aub);border-radius:999px;padding:7px 14px;font-size:13.5px;background:var(--paper)}
.chip b{font-family:var(--serif);font-weight:400;font-style:italic;margin-right:6px}
.lc-money{margin:22px 44px 0;background:var(--paper);border-radius:20px;padding:18px 22px;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.lc-money .n{font-family:var(--serif);font-size:26px}
.lc-money .l{font-size:12.5px;color:var(--muted)}
.lc-sign{display:flex;justify-content:space-between;align-items:flex-end;padding:30px 44px 34px;gap:20px}
.lc-sign .sig{font-family:var(--serif);font-style:italic;font-size:34px;line-height:1}
.lc-sign .contact{font-size:13px;color:var(--dlilac);text-align:right;line-height:1.6}

body.shot header.app,body.shot .upd-settings,body.shot .section-head,body.shot .client-extra{display:none}
body.shot main{max-width:none;padding:30px}
body.shot .upd-wrap{display:block}
.shot-hint{position:fixed;bottom:16px;left:50%;transform:translateX(-50%);background:var(--aub);color:var(--cream);padding:8px 16px;border-radius:999px;font-size:13px;display:none;z-index:9}
body.shot .shot-hint{display:block}

.toast{position:fixed;right:20px;bottom:20px;background:var(--aub);color:var(--cream);padding:10px 16px;border-radius:12px;font-size:14px;opacity:0;transition:opacity .25s;pointer-events:none;z-index:10}
.toast.on{opacity:1}

@media (max-width:900px){
  main{padding:16px}
  header.app{padding:14px 16px 0}
  .upd-wrap{grid-template-columns:1fr}
  .task{grid-template-columns:28px 1fr;}
  .task.head{display:none}
  .task > *:nth-child(n+3){grid-column:2}
}
@media print{
  @page{size:A4 portrait;margin:8mm}
  body{background:#fff}
  header.app,.upd-settings,.section-head,.toast,.shot-hint{display:none!important}
  main{padding:0;max-width:none}
  .upd-wrap{display:block}
  #lisaCard{box-shadow:none;width:100%;zoom:.72}
  *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}

/* ---------- Portal additions ---------- */
.userbox{display:flex;gap:10px;align-items:center;font-size:13px;color:var(--lilac)}
.login{max-width:440px;margin:60px auto}
.login h2{font-size:34px;margin:6px 0 10px}
.login input{width:100%;border:1px solid var(--line);border-radius:12px;padding:11px 13px;background:var(--cream);font-size:16px;margin:6px 0 12px}
.login .err{color:var(--dlilac);background:var(--yellow);border-radius:10px;padding:8px 12px;font-size:14px;margin-top:10px}
.login .code{letter-spacing:.4em;font-size:22px;text-align:center}
.plist a{display:flex;justify-content:space-between;align-items:center;padding:14px 4px;border-bottom:1px solid var(--line);text-decoration:none;color:var(--aub)}
.plist a:last-child{border-bottom:0}
.plist .nm{font-family:var(--serif);font-size:22px}
.form-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;align-items:end}
.form-row label{font-size:12px;font-weight:600;color:var(--dlilac);letter-spacing:.06em;text-transform:uppercase}
.form-row input{width:100%;border:1px solid var(--line);border-radius:10px;padding:8px 10px;background:var(--cream);margin-top:4px}
.tick{width:22px;height:22px;border-radius:50%;border:2px solid var(--dlilac);background:var(--paper);padding:0;flex:none;position:relative;cursor:pointer}
.tick.on{background:var(--dlilac)}
.tick.on::after{content:"";position:absolute;left:6px;top:2px;width:5px;height:10px;border:solid var(--cream);border-width:0 2px 2px 0;transform:rotate(45deg)}
.lc-col li.has-tick{padding-left:0;display:flex;gap:10px;align-items:flex-start}
.lc-col li.has-tick::before{display:none}
.lc-col li.has-tick.isdone .txt{text-decoration:line-through;opacity:.6}
.cmt-btn{border:0;background:transparent;color:var(--dlilac);font-size:12px;font-weight:600;padding:2px 0;cursor:pointer;text-decoration:underline;text-underline-offset:2px}
.thread{margin:6px 0 2px;padding-left:10px;border-left:2px solid var(--lilac)}
.thread .c{font-size:13px;line-height:1.4;margin:4px 0}
.thread .c b{font-weight:600}
.thread .c time{color:var(--muted);font-size:11.5px;margin-left:4px}
.cmt-form{margin-top:6px}
.cmt-form textarea{width:100%;border:1px solid var(--line);border-radius:10px;padding:8px 10px;background:var(--paper);min-height:60px;font-size:14px;resize:vertical}
.cmt-form .btn{margin-top:6px}
.messages{max-width:1080px;margin:26px auto 0}
.messages .c{background:var(--paper);border-radius:16px;padding:12px 16px;margin-bottom:10px;max-width:80%}
.messages .c.dan{background:var(--lilac);margin-left:auto}
.messages .c .who{font-size:12px;font-weight:600;color:var(--dlilac)}
.messages .c .when{font-size:11.5px;color:var(--muted);margin-left:6px;font-weight:400}
.cm-admin li{display:block}
.cm-admin .unseen{background:linear-gradient(90deg,rgba(251,221,142,.6),transparent 80%);border-radius:8px;padding-left:8px}
.ccount{font-size:11px;font-weight:600;background:var(--lilac);color:var(--aub);border-radius:999px;padding:2px 8px;margin-left:6px;white-space:nowrap}
.adminbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:6px}
.center{text-align:center;padding:60px 20px}

/* ---------- Per-client sections (29 Oct) ---------- */
.step .here{position:absolute;top:-22px;left:0;font-style:normal;font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--aub);background:var(--yellow);border-radius:999px;padding:1px 8px;white-space:nowrap}
.step .pw{color:var(--dlilac);font-weight:600;font-size:11.5px}
.stepper{padding-top:40px}
.lc-count{margin:18px 44px 0;display:flex;align-items:baseline;gap:12px;font-size:15px}
.lc-count .n{font-family:var(--serif);font-size:44px;line-height:1;background:linear-gradient(transparent 55%,var(--yellow) 55%,var(--yellow) 92%,transparent 92%)}
.feat{display:flex;gap:10px;align-items:flex-start;padding:7px 0;border-bottom:1px solid var(--line)}
.feat:last-child{border-bottom:0}
.feat input{margin:3px 0 0}
.upd-settings .feat label{margin:0;text-transform:none;letter-spacing:0;font-size:14px;color:var(--aub);font-weight:400}
.feat label span{display:block;font-size:12px;color:var(--muted)}
.lede{font-size:16px;max-width:640px;margin:0 0 20px}
.plants{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px}
.plant{background:var(--paper);border-radius:22px;overflow:hidden;border:1px solid var(--line)}
.plant .ph{height:220px;margin:14px 14px 0;border-radius:110px 110px 0 0;overflow:hidden;background:var(--lilac);display:flex;align-items:center;justify-content:center}
.plant .ph img{width:100%;height:100%;object-fit:cover}
.plant .ph span{font-family:var(--serif);font-style:italic;font-size:64px;color:var(--dlilac)}
.plant .pb{padding:14px 18px 18px}
.plant .ord{margin:-2px 0 8px}
.plant h3{font-size:20px;margin:4px 0 8px}
.plant .why{margin:0 0 10px;font-size:14.5px}
.plant dl{margin:0;display:grid;grid-template-columns:62px 1fr;gap:4px 10px;font-size:13px}
.plant dt{color:var(--dlilac);font-weight:600}
.plant dd{margin:0}
h3.stage{font-size:24px;margin:22px 0 10px;font-style:italic}
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}
.gallery figure{margin:0}
.gallery img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:16px;display:block}
.gallery figcaption{font-size:13px;margin-top:6px}
.gallery figcaption span{color:var(--muted)}
.docs .doc{display:flex;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line)}
.docs .doc:last-child{border-bottom:0}
.docs .dt{flex:1;font-family:var(--serif);font-size:18px}
.care{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}
.care .month{background:var(--paper);border-radius:20px;padding:16px 20px;border:1px solid var(--line)}
.care .month.now{background:var(--yellow);border-color:transparent}
.care .month.quiet{opacity:.7}
.care h3{font-size:20px;margin-bottom:8px}
.care ul{list-style:none;margin:0;padding:0}
.care li{padding:6px 0;border-bottom:1px solid var(--line);font-size:14px}
.care li:last-child{border-bottom:0}
.care li span{color:var(--muted)}
.tbl.ro td{padding:9px 6px}
.sheetbox .form-row{grid-template-columns:2fr 1fr 1fr}
.thumb{width:52px;height:52px;border-radius:26px 26px 0 0;overflow:hidden;background:var(--lilac);display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-style:italic;font-size:22px;color:var(--dlilac)}
.thumb img{width:100%;height:100%;object-fit:cover}
.agallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px;margin-top:10px}
.aph{border:1px solid var(--line);border-radius:14px;padding:8px}
.aph img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:10px;display:block;margin-bottom:6px}
.aph input[type=text],.aph input[type=date],.aph select{width:100%;border:1px solid var(--line);border-radius:8px;padding:4px 6px;font-size:13px}
.aph .row2{display:flex;gap:6px;align-items:center;justify-content:space-between;margin-top:6px}
@media (max-width:700px){
  .stepper{flex-direction:column;gap:14px;padding:20px 20px 6px}
  .step{padding:0 0 0 30px}
  .step::before{display:none}
  .step .here{position:static;display:inline-block;margin-bottom:4px}
  .lc-top,.lc-hero,.lc-progress,.lc-cols,.lc-dates,.lc-sign{padding-left:20px;padding-right:20px}
  .lc-hero{grid-template-columns:1fr}
  .arch{width:100%}
  .lc-cols{grid-template-columns:1fr}
  .lc-count,.lc-money{margin-left:20px;margin-right:20px}
  .sheetbox .form-row{grid-template-columns:1fr}
}
.plant .pq{display:flex;justify-content:space-between;gap:8px;margin:0 0 10px;padding:6px 10px;background:var(--cream);border-radius:10px;font-size:13px;font-weight:600;color:var(--dlilac)}
.sourcing h3{font-size:20px}
@media print{ .sourcing .btn{display:none} .filters,.sheetbox,.grid.g4,.section-head{display:none!important} }
.viewswitch{display:inline-flex;background:rgba(248,245,236,.12);border-radius:999px;padding:3px;margin-right:6px}
.viewswitch a{color:var(--lilac);text-decoration:none;font-size:13px;font-weight:600;padding:5px 12px;border-radius:999px}
.viewswitch a.on{background:var(--yellow);color:var(--aub)}
.previewbar{max-width:1080px;margin:0 auto 18px;background:var(--yellow);border-radius:12px;padding:9px 16px;font-size:14px;font-weight:600;text-align:center}
.board{display:grid;grid-template-columns:repeat(4,minmax(220px,1fr));gap:14px;align-items:start}
.kcol{background:rgba(210,195,227,.35);border-radius:18px;padding:12px}
.kcol h3{font-size:18px;margin:2px 4px 10px}
.kcard{background:var(--paper);border-radius:14px;padding:10px 12px;margin-bottom:10px;border:1px solid var(--line)}
.kcard.od{background:linear-gradient(90deg,rgba(251,221,142,.7),var(--paper))}
.kcard.soon{border-color:var(--yellow)}
.kt{font-weight:600;font-size:14px;line-height:1.35;display:flex;gap:4px;align-items:flex-start}
.kcard[draggable=true]{cursor:grab}
.kcard.dragging{opacity:.45}
.kcol.over{outline:2px dashed var(--line);outline-offset:-4px;background:rgba(210,195,227,.6)}
.kt-in,.kdesc{width:100%;border:1px solid transparent;background:transparent;border-radius:8px;padding:3px 4px;font:inherit;color:inherit}
.kt-in{font-weight:600}
.kdesc{display:block;resize:vertical;font-size:12.5px;font-weight:400;color:var(--muted);margin-top:2px;min-height:26px}
.kt-in:hover,.kt-in:focus,.kdesc:hover,.kdesc:focus{border-color:var(--line);color:var(--aub)}
.kt .del{flex:none}
.km{display:flex;gap:4px;flex-wrap:wrap;margin:6px 0}
.kf{display:flex;gap:8px;align-items:center;justify-content:space-between}
.kf input{border:1px solid transparent;background:transparent;border-radius:8px;padding:3px 4px;font-size:12.5px;width:130px}
.kf input:hover,.kf input:focus{border-color:var(--line)}
.kb{display:flex;justify-content:space-between;margin-top:6px}
.kmove{border:1px solid var(--line);background:var(--cream);border-radius:999px;padding:2px 12px;font-size:13px;font-weight:600}
.kmove:hover{background:var(--sage)}
@media (max-width:900px){.board{grid-template-columns:1fr}}
.plant .pcred{font-size:10.5px;color:var(--muted);padding:4px 16px 0;line-height:1.3}
.updates{margin-top:6px;border-top:1px solid var(--line);padding-top:6px}
.updates .u{font-size:12.5px;line-height:1.4;padding:5px 7px;border-radius:8px;margin-bottom:5px;background:var(--cream)}
.updates .u.priv{background:rgba(210,195,227,.35)}
.updates .u.client{background:rgba(201,211,154,.45)}
.updates .u time{color:var(--muted);font-size:11px}
.updates textarea{width:100%;border:1px solid var(--line);border-radius:8px;padding:6px 8px;font-size:13px;min-height:52px;resize:vertical;margin-top:4px}
/* Task timeline: date axis, one row per task, sticky labels; scrolls sideways inside its panel */
.tl-panel{padding:12px 0 6px;overflow:hidden}
.tl{--tl-lab:240px;overflow-x:auto;-webkit-overflow-scrolling:touch}
.tl-in{position:relative}
.tl-grid{position:absolute;top:0;bottom:0;left:var(--tl-lab);right:0;pointer-events:none}
.tl-grid i{position:absolute;top:0;bottom:0;border-left:1px solid var(--line)}
.tl-today{position:absolute;top:0;bottom:0;border-left:2px solid var(--yellow);z-index:1}
.tl-row{display:flex;align-items:center;min-height:26px}
.tl-lab{position:sticky;left:0;z-index:2;flex:0 0 var(--tl-lab);width:var(--tl-lab);background:var(--paper);padding:3px 10px 3px 16px;font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border-right:1px solid var(--line)}
.tl-lab .date{display:inline-block;width:76px;color:var(--muted);font-size:11.5px}
.tl-track{position:relative;flex:1 0 auto;height:26px}
.tl-head .tl-lab{font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--dlilac)}
.tl-head .tl-track span{position:absolute;top:5px;padding-left:5px;font-size:12px;font-weight:600;color:var(--dlilac);white-space:nowrap}
.tl-tlab{position:absolute;top:-1px;transform:translateX(-50%);background:var(--yellow);border-radius:999px;padding:0 7px;font-size:10.5px;font-style:normal;font-weight:700;z-index:1}
.tl-ph{margin-top:8px}
.tl-ph .tl-lab{font-family:var(--serif);font-size:15px}
.tl-ph .tl-lab .muted{font-family:var(--sans)}
.tl-bar{position:absolute;top:8px;height:10px;border-radius:999px;background:var(--lilac);opacity:.75}
.tl-row.done .tl-lab{color:var(--muted)}
.tl-m{position:absolute;top:7px;width:12px;height:12px;margin-left:-4px;border-radius:50%;border:2px solid var(--dlilac);background:var(--paper);z-index:1}
.tl-m.doing{background:var(--yellow);border-color:var(--aub)}
.tl-m.waiting{background:var(--lilac)}
.tl-m.done{background:var(--sage);border-color:var(--sage)}
.tl-m.key{border-radius:2px;transform:rotate(45deg)}
.tl-m.od{box-shadow:0 0 0 3px var(--yellow)}
.tl-key{font-size:13px}
.tl-key span{display:inline-flex;align-items:center;gap:6px;margin-right:6px}
.tl-key .tl-m{position:static;margin:0;display:inline-block}
@media (max-width:700px){.tl{--tl-lab:140px}.tl-lab .date{display:block;width:auto;line-height:1.1}.tl-lab{padding-left:12px}}

/* Cost categories: plants = sage (green), materials = lilac, labour = yellow. Same on Dan's side and the client's. */
.ck-plants{--cat:var(--sage)}
.ck-materials{--cat:var(--lilac)}
.ck-labour{--cat:var(--yellow)}
.cost-legend{display:flex;gap:14px;flex-wrap:wrap;align-items:center;font-size:12.5px;margin:0 0 12px}
.adminbar .cost-legend{margin:0 8px 0 0}
.ck{display:inline-flex;align-items:center;gap:6px;font-weight:600}
.ck i{display:inline-block;width:12px;height:12px;border-radius:4px;background:var(--cat)}
.tbl tr[class*="ck-"] td.ckb{border-left:5px solid var(--cat);padding-left:10px}
.tbl tr.cat-h td{background:var(--cat);font-weight:600;padding:8px 10px}
.tbl tr.cat-h td:first-child{border-radius:10px 0 0 10px}
.tbl tr.cat-h td:last-child{border-radius:0 10px 10px 0}
.tbl tr.cat-h .ck{font-family:var(--serif);font-size:16px;font-weight:400}
.tbl tr.cat-h .ck i{background:var(--aub);opacity:.25}
.costs-tbl td{vertical-align:top;padding-top:8px}
.costs-tbl .cnotes{max-width:280px}
.costgrp{border-left:6px solid var(--cat)}
.costgrp .cat-head{display:flex;justify-content:space-between;align-items:center;gap:12px;background:var(--cat);margin:-4px 0 10px;padding:8px 12px;border-radius:10px}
.costgrp .cat-head h3{margin:0}
.costgrp .cat-head .ck i{background:var(--aub);opacity:.25}
.tag.st{background:var(--paper);border:1px solid var(--line);color:var(--aub)}
@media (max-width:700px){ .costs-tbl{display:block;overflow-x:auto} }

/* ---------- "Client sees" chip: one click shares or hides an item ---------- */
.see{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:600;letter-spacing:.03em;line-height:1.2;border:1px solid var(--sage);border-radius:999px;padding:2px 9px 2px 7px;background:var(--sage);color:var(--aub);white-space:nowrap;vertical-align:middle}
.see svg{width:13px;height:13px;flex:0 0 13px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.see:not(.on){background:transparent;border:1px dashed rgba(40,33,43,.3);color:var(--muted)}
.see:hover{filter:none;border-color:var(--dlilac)}
.see:focus-visible{outline:2px solid var(--dlilac);outline-offset:2px}
.see:disabled{opacity:.6;cursor:progress}
.see.icon{padding:0;width:22px;height:22px;justify-content:center;margin-right:6px;flex:0 0 22px}
.tl-lab .see.icon{width:18px;height:18px;flex-basis:18px;margin-right:5px;vertical-align:-4px}
.tl-lab .see.icon svg{width:11px;height:11px;flex-basis:11px}
/* Private items: same card, no pattern. The lock "Private" chip does the signalling; the title is a little muted. */
.kcard.priv .kt{color:var(--muted)}
.task.priv .title{color:var(--muted)}
.tl-row.priv .tl-lab{color:var(--muted)}
.clean li .see.icon{margin-top:1px}

/* ---------- The cover (after the Lilac Book) ---------- */
.qcover{position:relative;overflow:hidden;color:var(--aub);background:radial-gradient(ellipse at 50% 42%,#E2D6EE 0%,var(--lilac) 48%,#BBA8D2 100%)}
.qc-veil{position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(115deg,rgba(255,255,255,.035) 0 4px,transparent 4px 12px)}
.qc-arch{position:relative;width:min(220px,52vw);aspect-ratio:84/118;margin:0 auto;border:1.3px solid rgba(40,33,43,.55);border-radius:999px 999px 0 0;display:flex;align-items:center;justify-content:center}
.qc-arch::after{content:"";position:absolute;inset:7px;border:.8px solid rgba(40,33,43,.3);border-radius:999px 999px 0 0}
.qc-arch img{width:69%;height:auto;margin-top:12%;display:block}
.qc-sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Sign-in: the whole screen is the cover; the form sits quietly beneath the arch. */
body.cover-login header.app{display:none}
body.cover-login{background:var(--lilac)}
body.cover-login main{padding:0;max-width:none}
.qc-login{min-height:100vh;min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:28px;padding:48px 16px}
.qc-login .qc-top{position:relative;text-align:center}
.qc-line{font-family:var(--serif);font-size:19px;margin:22px 0 0;color:var(--aub)}
.qc-line em{color:var(--dlilac)}
.qc-login .login{position:relative;margin:0;width:100%;max-width:400px;background:rgba(248,245,236,.9);border-color:rgba(40,33,43,.12);box-shadow:0 18px 50px rgba(40,33,43,.12)}
.qc-login .login input{background:var(--paper)}
.qc-login .login input:focus,.qc-login .btn:focus-visible{outline:2px solid var(--dlilac);outline-offset:2px}
.qc-intro .qc-top{animation:qcFade 1.6s ease both}
.qc-intro .login{animation:qcRise 1s ease .9s both}
@keyframes qcFade{from{opacity:0}to{opacity:1}}
@keyframes qcRise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

/* Client's first view: their garden in the latest shared photo, then the update below.
   (The lilac cover is the sign-in page only.) */
.ph-hero{max-width:1080px;margin:0 auto 26px}
.ph-main{position:relative;margin:0;border-radius:28px;overflow:hidden;background:var(--lilac)}
.ph-main img{display:block;width:100%;height:60vh;max-height:680px;min-height:280px;object-fit:cover}
.ph-band{position:absolute;left:0;right:0;bottom:0;padding:70px 28px 22px;color:var(--cream);background:linear-gradient(transparent,rgba(40,33,43,.68))}
.ph-names{display:flex;flex-direction:column;gap:2px}
.ph-road{font-family:var(--serif);font-size:clamp(28px,4.4vw,44px);line-height:1.1}
.ph-for{font-family:var(--serif);font-style:italic;font-size:clamp(18px,2.4vw,24px);color:var(--lilac)}
.ph-cap{font-size:12.5px;letter-spacing:.04em;margin-top:8px;opacity:.92}
.ph-strip{display:flex;gap:10px;margin-top:12px;overflow-x:auto;padding:2px 2px 6px;scrollbar-width:thin}
.ph-th{flex:0 0 auto;width:96px;height:72px;padding:0;border:2px solid transparent;border-radius:14px;overflow:hidden;background:var(--lilac);opacity:.78}
.ph-th img{width:100%;height:100%;object-fit:cover;display:block}
.ph-th:hover{opacity:1}
.ph-th.on{border-color:var(--dlilac);opacity:1}
.ph-th:focus-visible{outline:2px solid var(--dlilac);outline-offset:2px}
.ph-empty{border-radius:28px;background:#F1ECDD;border:1px solid var(--line);padding:56px 24px;text-align:center}
.ph-empty .ph-names{align-items:center}
.ph-empty .ph-road{color:var(--aub)}
.ph-empty .ph-for{color:var(--dlilac)}
.ph-hint{margin:18px 0 0;font-size:13px;color:var(--muted)}
@media (max-width:700px){
  .ph-hero{margin-bottom:18px}
  .ph-main,.ph-empty{border-radius:20px}
  .ph-main img{height:45vh;height:45svh;min-height:220px}
  .ph-band{padding:56px 18px 16px}
  .ph-th{width:76px;height:58px;border-radius:12px}
  .qc-login{gap:22px;padding:36px 16px}
  .qc-line{font-size:17px}
}
@media (prefers-reduced-motion:no-preference){ .ph-th{transition:opacity .2s,border-color .2s} }
@media (prefers-reduced-motion:reduce){
  .qc-intro .qc-top,.qc-intro .login{animation:none}
}
@media print{ .ph-strip{display:none} .ph-main img{height:auto;max-height:340px} }
body.shot .ph-hero{display:none}

/* ---------- Finances: budget lines against the allowance ----------
   Forecast colour (bar + label): sage within, yellow at risk, terracotta over. Category colour stays a thin left border. */
.fs-ok{--fs:var(--sage);--fs-ink:var(--aub)}
.fs-risk{--fs:var(--yellow);--fs-ink:var(--aub)}
.fs-over{--fs:var(--warn);--fs-ink:var(--cream)}
.fs-none{--fs:var(--line);--fs-ink:var(--muted)}
.fs-done{--fs:var(--paper);--fs-ink:var(--dlilac)}
.tag.fs{background:var(--fs);color:var(--fs-ink)}
.tag.fs-done{border:1px solid var(--line)}
.fin-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:6px}
.fin-head h3 em{font-style:italic}
.fin-legend{display:flex;gap:14px;flex-wrap:wrap}
.fin-legend span,.paylegend span{display:inline-flex;align-items:center;gap:6px}
.fin-legend i{display:inline-block;width:22px;height:8px;border-radius:999px;background:var(--fs)}
.fin-scroll{overflow-x:auto;margin:0 -4px;padding:0 4px}
.fin-tbl{min-width:760px}
.fin-tbl td{vertical-align:top;padding-top:9px;padding-bottom:9px}
.fin-tbl td.num b{font-weight:600}
.fin-why{max-width:240px;margin-top:3px;line-height:1.35}
.fin-bar{position:relative;height:8px;border-radius:999px;background:var(--cream);border:1px solid var(--line);margin:6px 0 2px auto;width:120px;max-width:100%;overflow:hidden}
.fin-bar span{position:absolute;left:0;top:0;bottom:0;background:var(--fs);border-radius:999px}
.fin-bar i{position:absolute;top:-1px;bottom:-1px;width:1.5px;background:var(--aub);opacity:.45}
.fin-tbl tfoot tr.fin-total td{font-weight:600;background:var(--cream)}
.fin-tbl tfoot tr.fin-total + tr.fin-total td{border-top:1px solid var(--line)}
.fin-tbl tr.fin-unassigned td{color:var(--dlilac)}
.fin-act{width:1%;white-space:nowrap}
.fin-prompt{display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.fin-note{margin:0 0 10px}
@media (max-width:700px){ .fin-why{max-width:180px} }

/* ---------- Payments at a glance ----------
   Paid sage, due within 14 days yellow, overdue terracotta, upcoming lilac, not invoiced muted (dashed). */
.pst-paid{--pst:var(--sage);--pst-ink:var(--aub)}
.pst-soon{--pst:var(--yellow);--pst-ink:var(--aub)}
.pst-over{--pst:var(--warn);--pst-ink:var(--cream)}
.pst-upcoming{--pst:var(--lilac);--pst-ink:var(--aub)}
.pst-notinv{--pst:transparent;--pst-ink:var(--muted)}
.tag.pst{background:var(--pst);color:var(--pst-ink)}
.tag.pst-notinv{border:1px dashed rgba(40,33,43,.3)}
.paytbl tbody tr td:first-child{border-left:5px solid var(--pst);padding-left:9px}
.paytbl tbody tr.pst-notinv td:first-child{border-left:5px dashed rgba(40,33,43,.2)}
.paystrip{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;margin:0 0 6px;font-size:14px}
.paystrip .ps{display:inline-flex;align-items:center;gap:7px;padding:4px 12px 4px 8px;border-radius:999px;background:var(--cream)}
.paystrip .ps i,.paylegend i{display:inline-block;width:12px;height:12px;border-radius:4px;background:var(--pst)}
.paystrip .sep{color:var(--muted)}
.paylegend{display:flex;flex-wrap:wrap;gap:6px 14px;margin:0 0 12px;color:var(--aub)}
.paylegend .pst-notinv i{border:1px dashed rgba(40,33,43,.4)}

/* ---------- Your garden's year: month tiles at a glance ----------
   Season band (Lilac Book): winter deep lilac, spring sage, summer yellow, autumn lilac. The strip scrolls inside its panel. */
.yr-panel{padding:30px 44px 4px;min-width:0}
.yr-head{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.yr-head h2{font-size:30px}
.yr-head h2 em{font-style:italic}
.yr-zoom{display:inline-flex;background:var(--paper);border:1px solid var(--line);border-radius:999px;padding:3px}
.yr-zoom button{border:0;background:transparent;border-radius:999px;padding:5px 12px;font-size:13px;font-weight:600;color:var(--dlilac)}
.yr-zoom button.on{background:var(--aub);color:var(--cream)}
.yr-zoom button:focus-visible,.yt:focus-visible,.yr-x:focus-visible,.yr-all summary:focus-visible{outline:2px solid var(--dlilac);outline-offset:2px}
.yr-strip{--yt-w:128px;position:relative;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(var(--yt-w),1fr);gap:10px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;padding:4px 2px 12px;-webkit-overflow-scrolling:touch}
.z12 .yr-strip{--yt-w:96px;gap:6px}
.z18 .yr-strip{--yt-w:70px;gap:5px}
.yt{--band:var(--lilac);position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:5px;text-align:left;min-height:148px;padding:16px 12px 12px;border:1px solid var(--line);border-radius:16px;background:var(--paper);color:var(--aub);scroll-snap-align:start;overflow:hidden}
.z12 .yt{min-height:118px;padding:14px 9px 10px;border-radius:12px}
.z18 .yt{min-height:104px;padding:13px 7px 9px;border-radius:10px}
.yt:hover{border-color:var(--dlilac)}
.yt-band{position:absolute;left:0;right:0;top:0;height:7px;background:var(--band)}
.yt-winter{--band:var(--dlilac)} .yt-spring{--band:var(--sage)} .yt-summer{--band:var(--yellow)} .yt-autumn{--band:var(--lilac)}
.yt-m{font-family:var(--serif);font-size:19px;line-height:1.1}
.yt-m small{font-family:var(--sans);font-size:11px;font-weight:600;color:var(--muted);letter-spacing:.04em}
.z12 .yt-m{font-size:16px} .z18 .yt-m{font-size:14px}
.z18 .yt-m small{display:block}
.yt-here{font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;background:var(--yellow);border-radius:999px;padding:1px 7px}
.z18 .yt-here{font-size:9px;padding:1px 5px;letter-spacing:.04em}
.yt.now{border:2px solid var(--aub);padding-top:15px}
.yt.past{opacity:.55}
.yt.past:hover,.yt.past.open{opacity:.85}
.yt.quiet .yt-ct{color:var(--muted)}
.yt.open{border-color:var(--dlilac);box-shadow:0 0 0 2px var(--dlilac)}
.yt-pins{display:flex;flex-direction:column;gap:3px;flex:1;width:100%}
.yt-pin{display:flex;gap:5px;align-items:baseline;font-size:12.5px;line-height:1.25;font-weight:600;color:var(--aub)}
.yt-pin i,.yd-key,.yr-key .k-pin{flex:0 0 8px;width:8px;height:8px;background:var(--dlilac);transform:rotate(45deg);display:inline-block}
.yt-pin.priv{color:var(--muted);font-weight:500}
.yt-pin.priv i{background:transparent;border:1px dashed var(--muted)}
.yt-pin.more{color:var(--dlilac)}
.z12 .yt-pin{font-size:11.5px}
.yt-ct{font-size:12px;color:var(--dlilac);font-weight:600;display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.z18 .yt-ct{font-size:11px}
.yt-priv{color:var(--muted);font-weight:500}
.yt-need,.yr-key .k-need{width:9px;height:9px;border-radius:50%;background:var(--warn);display:inline-block;flex:0 0 9px}
.yr-key{display:flex;flex-wrap:wrap;gap:6px 16px;align-items:center;font-size:12px;color:var(--aub);margin:2px 0 6px}
.yr-key > span{display:inline-flex;align-items:center;gap:6px}
.yr-key .k-seasons i{width:14px;height:6px;border-radius:3px;background:var(--band);display:inline-block;margin-left:4px}
.yr-key .k-seasons i:first-child{margin-left:0}
.yr-detail{background:var(--paper);border-radius:20px;padding:20px 22px;margin:8px 0 6px;border:1px solid var(--line)}
@media (prefers-reduced-motion:no-preference){ .yr-detail{animation:yrIn .22s ease-out} }
@keyframes yrIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
.yd-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.yd-head h3{font-size:26px;margin-top:4px}
.yd-head h3 em{font-style:italic}
.yd-head p{margin:4px 0 0}
.yd-needn{color:var(--warn)}
.yr-x{border:1px solid var(--line);background:transparent;border-radius:999px;width:34px;height:34px;font-size:20px;line-height:1;color:var(--aub);flex:0 0 34px}
.yd-cols{display:grid;grid-template-columns:3fr 2fr;gap:22px;margin-top:12px}
.yd-cols.one{grid-template-columns:1fr}
.yd-cols h4,.yr-all h4{font-family:var(--serif);font-weight:400;font-size:18px;margin:0 0 6px}
.yd-list{list-style:none;margin:0;padding:0}
.yd-list li{display:flex;gap:10px;align-items:flex-start;padding:8px 0;border-bottom:1px solid var(--line);font-size:14.5px;line-height:1.35}
.yd-list li:last-child{border-bottom:0}
.yd-list .date{min-width:84px;padding-top:1px}
.yd-t{flex:1;min-width:0}
.yd-t small{display:block;color:var(--muted);font-size:12.5px;margin-top:2px}
.yd-t .yd-key{margin-right:7px;vertical-align:1px}
.yd-s{display:inline-flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.yd-list li.need{background:var(--lilac);border-radius:12px;padding:8px 10px;border-bottom:0;margin:2px 0}
.yd-list li.isdone .yd-t{color:var(--muted)}
.yd-list li.priv .yd-t{color:var(--muted)}
.yr-all{margin:0 44px 10px;background:var(--paper);border-radius:20px;padding:4px 22px}
.yr-all summary{cursor:pointer;padding:14px 0;font-family:var(--serif);font-size:20px;list-style-position:outside}
.yr-all summary .muted{font-family:var(--sans)}
.yr-all[open]{padding-bottom:16px}
.yr-all h4{margin-top:14px}
.yr-adminwrap{padding:0 0 10px;overflow:hidden}
.yr-adminwrap .yr-panel{padding:20px 22px 4px}
@media (max-width:700px){
  .yr-panel{padding:22px 16px 4px}
  .yr-head h2{font-size:25px}
  .yr-strip{--yt-w:132px;margin:0 -16px;padding:4px 16px 12px;scroll-padding:0 16px}
  .z12 .yr-strip{--yt-w:96px} .z18 .yr-strip{--yt-w:72px}
  .yr-detail{padding:16px}
  .yd-cols{grid-template-columns:1fr}
  .yd-list li{flex-wrap:wrap}
  .yd-list .date{min-width:0;width:100%}
  .yr-all{margin:0 16px 10px;padding:4px 16px}
  .yr-adminwrap .yr-panel{padding:16px 16px 4px}
}
@media print{ .yr-zoom,.yr-detail,.yr-all{display:none} .yr-strip{overflow:visible} }
body.shot .yr-zoom{display:none}
