/* Everflow CRM (20 Oct 2026): the website-client area of the portal (crm.js, inbox.js, reviews.js). The look of the Northpour demo
   (EverflowTools\crm\demo), every class prefixed c- so nothing clashes with styles.css. Brand only: lime #88D105, forest #062012,
   black #0A0B08, white #FEFEFE; Anton headings, Inter Tight body; no grey or faded text, no outlined lime. */
:root{--c-bg:#F1F3EC;--c-ln:rgba(6,32,18,.14);--c-ln2:rgba(6,32,18,.26);--c-r:14px;--c-top:60px;--c-tab:68px}
.c-i{width:22px;height:22px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.c-h{font-family:var(--display);font-weight:400;text-transform:uppercase;letter-spacing:.01em;line-height:1;margin:0;color:inherit}
.c-app{min-height:100vh;background:var(--c-bg);color:var(--black);overflow-x:hidden}
.c-app p{margin:0}
.c-app :focus-visible{outline:3px solid var(--black);outline-offset:2px}
.c-app ::placeholder,.c-embed ::placeholder{color:var(--forest);opacity:1}

/* banners (demo / preview / own) */
.c-banner{display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center;justify-content:center;padding:6px 16px;background:var(--lime);color:var(--black);font-size:13px;font-weight:700;text-align:center}
.c-banner button{all:unset;cursor:pointer;text-decoration:underline;text-underline-offset:3px;font-weight:700}
.c-banner.forest{background:var(--forest);color:var(--white)}

/* shell */
.c-top{position:sticky;top:0;z-index:40;display:flex;align-items:center;gap:12px;min-height:var(--c-top);padding:0 max(16px,env(safe-area-inset-right)) 0 max(16px,env(safe-area-inset-left));background:var(--black);color:var(--white)}
.c-brand{display:flex;flex-direction:column;min-width:0;margin-right:auto}
.c-brand .bn{font-family:var(--display);text-transform:uppercase;font-size:21px;line-height:1.05;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.c-brand .pw{font-size:12px;line-height:1.2;margin-top:4px;font-weight:600;color:var(--white)}
.c-brand .pw b{color:var(--black);background:var(--lime);padding:0 4px;border-radius:3px;font-weight:700}
.c-bell{all:unset;cursor:pointer;position:relative;display:grid;place-items:center;width:46px;height:46px;border-radius:12px;color:var(--white)}
.c-badge{position:absolute;top:4px;right:2px;min-width:20px;height:20px;padding:0 6px;border-radius:10px;background:var(--lime);color:var(--black);font:700 12px/20px var(--body);text-align:center}
.c-view{display:block;padding:20px max(16px,env(safe-area-inset-right)) calc(var(--c-tab) + 28px + env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));max-width:1240px;margin:0 auto;min-width:0}
.c-side{display:none}
.c-tabbar{position:fixed;left:0;right:0;bottom:0;z-index:45;display:grid;grid-auto-flow:column;grid-auto-columns:1fr;height:calc(var(--c-tab) + env(safe-area-inset-bottom));padding:6px 4px env(safe-area-inset-bottom);background:var(--black)}
.c-tabbar button{all:unset;cursor:pointer;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:52px;color:var(--white);font:700 12px/1 var(--body);border-radius:12px;text-align:center}
.c-tabbar button[aria-current="page"]{color:var(--black);background:var(--lime)}
.c-tabbar .c-badge{top:2px;right:calc(50% - 26px)}
.c-tabbar button[aria-current="page"] .c-badge{background:var(--black);color:var(--lime)}
@media (min-width:1024px){
  .c-top,.c-tabbar{display:none}
  .c-shell{display:grid;grid-template-columns:256px minmax(0,1fr)}
  .c-side{display:flex;flex-direction:column;position:sticky;top:0;height:100vh;background:var(--black);color:var(--white);padding:26px 18px 22px}
  .c-side .c-brand{margin:0 0 30px 8px}
  .c-side .c-brand .bn{font-size:24px;white-space:normal}
  .c-sidenav{display:grid;gap:4px}
  .c-sidenav button{all:unset;cursor:pointer;position:relative;display:flex;align-items:center;gap:12px;min-height:48px;padding:0 14px;border-radius:12px;font-weight:700;font-size:16px}
  .c-sidenav button:hover{background:rgba(254,254,254,.1)}
  .c-sidenav button[aria-current="page"]{background:var(--lime);color:var(--black)}
  .c-sidenav .c-badge{position:static;margin-left:auto}
  .c-sidenav button[aria-current="page"] .c-badge{background:var(--black);color:var(--lime)}
  .c-side-foot{margin-top:auto;display:grid;gap:8px;padding:12px 14px;border-radius:12px;background:var(--forest);font-size:13px;font-weight:700;line-height:1.35;overflow-wrap:anywhere}
  .c-side-foot button{all:unset;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
  .c-view{width:100%;padding:36px 44px 64px}
}

/* the CRM inside an Instagram client's portal (their Inbox tab): a row of sections instead of the shell */
.c-subnav{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:0 0 18px;padding:2px}
.c-subnav::-webkit-scrollbar{display:none}
.c-subnav button{all:unset;cursor:pointer;flex:none;min-height:40px;padding:0 14px;border-radius:10px;border:2px solid var(--black);background:var(--white);font-weight:700;font-size:14px;display:inline-flex;align-items:center;gap:6px}
.c-subnav button[aria-current="page"]{background:var(--black);color:var(--white)}

/* page heads */
.c-ph{display:flex;align-items:flex-end;justify-content:space-between;gap:12px 16px;flex-wrap:wrap;margin-bottom:20px}
.c-ph .c-h{font-size:40px}
.c-eye{display:block;font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;margin-bottom:8px;color:var(--forest)}
.c-sub{margin-top:8px;font-size:16px;max-width:56ch}
@media (min-width:1024px){.c-ph .c-h{font-size:56px}.c-ph{margin-bottom:28px}}
.c-sec{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:30px 0 12px}
.c-sec .c-h{font-size:24px}

/* buttons */
.c-btn{all:unset;box-sizing:border-box;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:48px;padding:0 18px;border-radius:12px;border:2px solid transparent;font:700 16px/1.15 var(--body);text-align:center;transition:background-color .14s,transform .12s,color .14s}
.c-btn:active{transform:scale(.97)}
.c-btn .c-i{width:20px;height:20px}
.c-btn.lime{background:var(--lime);color:var(--black)}
.c-btn.lime:hover{background:var(--soft)}
.c-btn.black{background:var(--black);color:var(--white)}
.c-btn.black:hover{background:var(--forest)}
.c-btn.line{background:var(--white);color:var(--black);border-color:var(--black)}
.c-btn.line:hover{background:var(--black);color:var(--white)}
.c-btn.danger{background:var(--white);color:var(--crit);border-color:var(--crit)}
.c-btn.big{min-height:58px;font-size:18px;width:100%}
.c-btn.sm{min-height:44px;padding:0 14px;font-size:15px}
.c-btn[disabled]{cursor:wait;background:var(--forest);color:var(--white);border-color:var(--forest)}
.c-link{all:unset;cursor:pointer;font-weight:700;text-decoration:underline;text-underline-offset:3px;min-height:36px;display:inline-flex;align-items:center}
.c-row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.c-trio{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:8px}
.c-trio .c-btn{padding:0 8px;min-width:0}

/* cards, tags */
.c-card{background:var(--white);border:1px solid var(--c-ln);border-radius:var(--c-r);padding:16px;min-width:0}
.c-card.dark{background:var(--black);color:var(--white);border-color:var(--black)}
.c-k{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;margin-bottom:6px}
.c-tag{display:inline-flex;align-items:center;gap:5px;min-height:24px;padding:2px 9px;border-radius:6px;font:700 12px/1.1 var(--body);letter-spacing:.04em;text-transform:uppercase;background:var(--black);color:var(--white);white-space:nowrap}
.c-tag .c-i{width:14px;height:14px;stroke-width:2.6}
.c-tag.lime{background:var(--lime);color:var(--black)}
.c-tag.line{background:transparent;color:var(--black);box-shadow:inset 0 0 0 1.5px var(--black)}
.c-tag.forest{background:var(--forest);color:var(--white)}
.c-tag.crit{background:var(--crit);color:var(--white)}
.c-tags{display:flex;gap:6px;flex-wrap:wrap}
.c-small{font-size:14px;font-weight:600;color:var(--forest)}
.c-small.b{color:var(--black)}

/* KPI tiles */
.c-kpis{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.c-kpi{all:unset;box-sizing:border-box;cursor:pointer;display:flex;flex-direction:column;justify-content:space-between;gap:10px;min-height:118px;padding:16px;border-radius:var(--c-r);background:var(--white);border:1px solid var(--c-ln);color:var(--black);min-width:0}
.c-kpi .k{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.c-kpi .v{font-family:var(--display);font-size:46px;line-height:.9}
.c-kpi .v small{font-size:22px;margin-left:4px}
.c-kpi .n{font-size:13px;font-weight:600}
.c-kpi.dark{background:var(--black);color:var(--white);border-color:var(--black)}
.c-kpi.dark .v{color:var(--lime)}
.c-kpi.wide{grid-column:1 / -1}
@media (min-width:700px){.c-kpis{grid-template-columns:repeat(3,1fr)}.c-kpi.wide{grid-column:auto}}
@media (min-width:1024px){.c-kpis.five{grid-template-columns:repeat(5,1fr)}.c-kpis.four{grid-template-columns:repeat(4,1fr)}.c-kpi{min-height:136px}.c-kpi .v{font-size:54px}}

/* lists */
.c-list{display:grid;gap:10px}
.c-li{all:unset;box-sizing:border-box;cursor:pointer;display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:var(--c-r);background:var(--white);border:1px solid var(--c-ln);color:var(--black);min-height:64px;min-width:0}
div.c-li{cursor:default}
.c-li .ic{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:var(--black);color:var(--lime);flex:none}
.c-li .ic.lime{background:var(--lime);color:var(--black)}
.c-li .tx{min-width:0;flex:1}
.c-li .tx b{display:block;font-size:16px;line-height:1.25;overflow-wrap:anywhere}
.c-li .tx span{display:block;font-size:14px;font-weight:600;color:var(--forest);line-height:1.3;margin-top:2px;overflow-wrap:anywhere}
.c-li .end{flex:none;font-weight:700;font-size:14px}
.c-two{display:grid;gap:0 28px}
@media (min-width:1024px){.c-two{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr)}}

/* inbox cards */
.c-enq{position:relative;display:grid;gap:10px;padding:16px 16px 14px;border-radius:var(--c-r);background:var(--white);border:1px solid var(--c-ln);min-width:0}
.c-enq.new{border-color:var(--black);box-shadow:inset 6px 0 0 var(--lime)}
.c-enq.held{border-style:dashed;border-color:var(--crit)}
.c-enq.test{background:var(--c-bg)}
.c-enq-top{display:flex;align-items:flex-start;gap:10px}
.c-who{flex:1;min-width:0}
.c-who b{display:block;font-size:18px;line-height:1.2;overflow-wrap:anywhere}
.c-who span{display:block;font-size:14px;font-weight:600;color:var(--forest);margin-top:2px;overflow-wrap:anywhere}
.c-timer{display:inline-flex;align-items:center;gap:6px;min-height:30px;padding:0 10px;border-radius:8px;background:var(--black);color:var(--lime);font:700 14px/1 var(--body);font-variant-numeric:tabular-nums;white-space:nowrap;flex:none}
.c-timer .c-i{width:16px;height:16px}
.c-timer.ok{background:var(--lime);color:var(--black)}
.c-msg{font-size:16px;line-height:1.45;white-space:pre-wrap;overflow-wrap:anywhere}
.c-answers{margin:0;display:grid;grid-template-columns:auto 1fr;gap:4px 12px;font-size:14px}
.c-answers dt{font-weight:700}
.c-answers dd{margin:0;overflow-wrap:anywhere}
.c-auto{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border-radius:10px;background:var(--c-bg);font-size:14px;line-height:1.4}
.c-auto .ok{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--lime);flex:none}
.c-auto .ok .c-i{width:15px;height:15px;stroke-width:3}
.c-auto b{display:block;font-size:13px;letter-spacing:.04em;text-transform:uppercase}
.c-contact{font-size:14px;font-weight:600;overflow-wrap:anywhere}
.c-warn{color:var(--crit);font-weight:700}
.c-ask{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:10px 12px;border-radius:10px;background:var(--black);color:var(--white);font-weight:700;font-size:15px}
.c-ask .c-btn.line{background:transparent;color:var(--white);border-color:var(--white)}
.c-enq-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.c-more{display:grid;gap:8px;padding-top:10px;border-top:1px solid var(--c-ln)}
.c-delivery{font-size:13px;font-weight:600;overflow-wrap:anywhere}

/* alerts card */
.c-alerts{display:grid;gap:8px;border-left:5px solid var(--lime)}
.c-alerts.off{border-left-color:var(--black)}
.c-alerts ol{margin:0;padding-left:20px;display:grid;gap:3px;font-size:14px}

/* the add-an-enquiry form */
.c-form{display:grid;gap:12px}
.c-form .c-two-in{display:grid;gap:12px}
@media (min-width:640px){.c-form .c-two-in{grid-template-columns:1fr 1fr}}
.c-form .field{color:var(--black)}
.c-form .field .hint{color:var(--forest)}
.c-err{color:var(--crit);font-weight:700;font-size:14px}

/* pipeline */
.c-seg{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:0 -16px 14px;padding:2px 16px}
.c-seg::-webkit-scrollbar{display:none}
.c-seg button{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:8px;min-height:46px;padding:0 14px;border-radius:12px;border:2px solid var(--black);background:var(--white);font-weight:700;font-size:15px;white-space:nowrap;flex:none}
.c-seg button .c{display:inline-grid;place-items:center;min-width:24px;height:24px;padding:0 6px;border-radius:7px;background:var(--black);color:var(--white);font-size:13px}
.c-seg button[aria-selected="true"]{background:var(--black);color:var(--white)}
.c-seg button[aria-selected="true"] .c{background:var(--lime);color:var(--black)}
.c-hint{font-size:13px;font-weight:600;margin:-4px 0 12px;color:var(--forest)}
.c-stage-list{display:grid;gap:10px;touch-action:pan-y}
@media (prefers-reduced-motion:no-preference){.c-stage-list.slide{animation:c-sl .3s ease-out}@keyframes c-sl{from{opacity:.2;transform:translateX(24px)}to{opacity:1;transform:none}}}
.c-board{display:none}
.c-jc{all:unset;box-sizing:border-box;cursor:pointer;display:flex;flex-direction:column;gap:4px;padding:14px;border-radius:var(--c-r);background:var(--white);border:1px solid var(--c-ln);color:var(--black);min-width:0;transition:border-color .14s}
.c-jc:hover{border-color:var(--black)}
.c-jc .jn{display:flex;justify-content:space-between;gap:8px;font-weight:700;font-size:16px;line-height:1.25}
.c-jc .jn b{overflow-wrap:anywhere;min-width:0}
.c-jc .jn span{white-space:nowrap}
.c-jc .jt{font-size:14px;font-weight:600;color:var(--forest);line-height:1.3;overflow-wrap:anywhere}
.c-jc .c-tags{margin-top:6px}
@media (min-width:1024px){
  .c-seg,.c-stage-list,.c-hint{display:none}
  .c-board{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:12px;align-items:start}
  .c-col{background:rgba(6,32,18,.06);border-radius:16px;padding:10px;min-height:420px;min-width:0}
  .c-col-h{display:flex;align-items:baseline;justify-content:space-between;gap:6px;padding:6px 6px 12px}
  .c-col-h .c-h{font-size:20px}
  .c-col-h span{font-size:13px;font-weight:700}
  .c-col .c-list{gap:8px}
  .c-col .c-jc{padding:12px}
  .c-col .c-jc .jn{flex-direction:column;gap:2px}
  .c-col.won .c-col-h .c-h{background:var(--lime);padding:2px 6px;border-radius:4px}
}

/* job page */
.c-back{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:8px;min-height:44px;font-weight:700;margin:-6px 0 8px}
.c-jd-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap}
.c-jd-head .c-h{font-size:34px;margin-top:10px;overflow-wrap:anywhere}
.c-jd-head .val{font-family:var(--display);font-size:30px}
.c-jd-sub{margin-top:6px;font-weight:700;font-size:16px;overflow-wrap:anywhere}
.c-stepper{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:4px;margin:18px 0}
.c-stepper span{display:block;padding-top:10px;border-top:5px solid var(--c-ln2);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;line-height:1.2;overflow-wrap:anywhere}
.c-stepper span.on{border-color:var(--black)}
.c-stepper span.cur{border-color:var(--lime)}
.c-stepper.lost span{border-color:var(--c-ln2)}
.c-blk{margin-top:16px}
.c-blk>h3,.c-blk>.c-k{font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;margin:0 0 8px}
.c-note{width:100%;min-height:110px;padding:12px 14px;border-radius:12px;border:2px solid var(--c-ln2);background:var(--white);font:500 16px/1.45 var(--body);color:var(--black);resize:vertical;box-sizing:border-box}
.c-note:focus{border-color:var(--black);outline:none}
.c-stages{display:flex;flex-wrap:wrap;gap:8px}
.c-stages button{all:unset;cursor:pointer;min-height:44px;padding:0 14px;border-radius:10px;border:2px solid var(--black);background:var(--white);font-weight:700;font-size:15px;display:inline-flex;align-items:center}
.c-stages button[aria-pressed="true"]{background:var(--black);color:var(--white)}
.c-stages button.lost[aria-pressed="true"]{background:var(--crit);border-color:var(--crit)}
.c-fu{padding:16px;border-radius:var(--c-r);background:var(--forest);color:var(--white)}
.c-fu .c-h{font-size:22px;color:var(--lime)}
.c-fu pre{white-space:pre-wrap;font:500 15px/1.45 var(--body);margin:10px 0 14px;padding:12px;border-radius:10px;background:rgba(254,254,254,.1);overflow-wrap:anywhere}
.c-fu .c-btn.line{border-color:var(--white);background:transparent;color:var(--white)}
.c-donebox{padding:16px;border-radius:var(--c-r);background:var(--black);color:var(--white)}
.c-donebox .c-h{font-size:24px;color:var(--lime)}
.c-donebox p{margin-top:6px}
.c-sticky{position:sticky;bottom:calc(var(--c-tab) + 10px + env(safe-area-inset-bottom));z-index:20;margin-top:18px}
.c-embed .c-sticky{bottom:calc(76px + env(safe-area-inset-bottom))}
@media (min-width:1024px){.c-sticky{bottom:20px}.c-jd-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px;align-items:start}}

/* Mark job done: the timeline (only the steps that really happen) */
.c-ov{position:fixed;inset:0;z-index:150;display:flex;align-items:stretch;justify-content:center;background:rgba(10,11,8,.6)}
.c-ov-in{position:relative;display:flex;flex-direction:column;width:100%;max-width:560px;background:var(--black);color:var(--white);overflow:hidden}
@media (min-width:700px){.c-ov{align-items:center;padding:24px}.c-ov-in{max-height:min(900px,calc(100vh - 48px));border-radius:22px}}
.c-ov-bar{height:5px;background:var(--forest)}
.c-ov-bar i{display:block;height:100%;width:0;background:var(--lime);transition:width .5s ease}
.c-ov-hd{padding:20px 20px 14px;border-bottom:1px solid var(--forest)}
.c-ov-hd .c-eye{display:inline-flex;align-items:center;gap:6px;color:var(--lime);margin:0}
.c-ov-hd .c-eye .c-i{width:16px;height:16px}
.c-ov-hd .c-h{font-size:clamp(26px,8vw,38px);margin-top:8px;line-height:.95}
.c-ov-hd .c-h .arr{color:var(--lime)}
.c-ov-hd p{font-size:15px;font-weight:600;margin-top:8px;overflow-wrap:anywhere}
.c-ov-sc{flex:1;overflow-y:auto;padding:8px 20px 20px}
.c-steps{list-style:none;margin:0;padding:0}
.c-stp{display:grid;grid-template-columns:34px minmax(0,1fr);gap:12px;padding:12px 0}
.c-stp+.c-stp{border-top:1px solid var(--forest)}
.c-mk{position:relative;width:30px;height:30px;border-radius:50%;border:2px solid var(--white);display:grid;place-items:center;margin-top:-2px;box-sizing:border-box}
.c-mk .c-i{width:18px;height:18px;stroke-width:3}
.c-stp.run .c-mk{border-color:var(--lime);border-right-color:transparent}
@media (prefers-reduced-motion:no-preference){.c-stp.run .c-mk{animation:c-spin .8s linear infinite}.c-stp.fresh .c-mk{animation:c-pop .35s cubic-bezier(.3,1.6,.5,1)}.c-stp.fresh .t{animation:c-up .4s ease-out both}
  @keyframes c-spin{to{transform:rotate(360deg)}}@keyframes c-pop{0%{transform:scale(.5)}100%{transform:scale(1)}}@keyframes c-up{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}}
.c-stp.ok .c-mk{background:var(--lime);border-color:var(--lime);color:var(--black)}
.c-stp.next .c-mk{background:var(--white);border-color:var(--white);color:var(--black)}
.c-stp .t{font-weight:700;font-size:18px;line-height:1.25;padding-top:2px}
.c-stp .t small{display:block;font-size:14px;font-weight:600;margin-top:2px}
.c-dt{margin-top:10px}
.c-dcard{padding:12px;border-radius:12px;background:var(--forest);font-size:15px;line-height:1.45;overflow-wrap:anywhere}
.c-ov-ft{padding:14px 20px calc(16px + env(safe-area-inset-bottom));border-top:1px solid var(--forest);display:grid;gap:10px}
.c-ov-ft .c-btn.line{background:transparent;color:var(--white);border-color:var(--white)}
.c-ov-ft .c-btn.line:hover{background:var(--white);color:var(--black)}
.c-ov-ft .note2{font-size:13px;font-weight:600;text-align:center}

/* More sheet */
.c-sheet{position:fixed;inset:0;z-index:120;background:rgba(10,11,8,.5);display:flex;align-items:flex-end}
.c-sheet-in{width:100%;background:var(--white);border-radius:22px 22px 0 0;padding:10px 16px calc(20px + env(safe-area-inset-bottom));box-sizing:border-box}
@media (prefers-reduced-motion:no-preference){.c-sheet-in{animation:c-upp .28s ease-out}@keyframes c-upp{from{transform:translateY(100%)}to{transform:none}}}
.c-sheet-in .grab{width:44px;height:5px;border-radius:3px;background:var(--c-ln2);margin:0 auto 14px}
.c-sheet-in .c-li{margin-bottom:8px;width:100%}

/* reviews */
.c-rv{display:grid;gap:8px}
.c-rv.due{border-color:var(--black);box-shadow:inset 6px 0 0 var(--lime)}
.c-fine{margin-top:14px;padding:12px 14px;border-radius:12px;background:var(--forest);color:var(--white);font-size:14px;font-weight:600;line-height:1.45}

/* monthly report */
.c-report{max-width:880px;background:var(--white);border:1px solid var(--c-ln);border-radius:18px;overflow:hidden}
.c-rep-hd{padding:24px 22px;background:var(--black);color:var(--white)}
.c-rep-hd .c-eye{color:var(--lime);margin:0}
.c-rep-hd .c-h{font-size:40px;margin-top:8px}
.c-rep-hd p{margin-top:8px;font-size:15px;font-weight:600}
.c-rep-bd{padding:22px 18px}
.c-rep-k{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media (min-width:700px){.c-rep-k{grid-template-columns:repeat(3,1fr)}}
.c-rep-k div{padding:14px;border-radius:12px;border:1px solid var(--c-ln);min-width:0}
.c-rep-k b{display:block;font-family:var(--display);font-weight:400;font-size:40px;line-height:1}
.c-rep-k span{display:block;font-size:13px;font-weight:700;margin-top:6px}
.c-rep-list{margin:0;padding-left:20px;display:grid;gap:8px;font-size:16px}
.c-rep-list li{overflow-wrap:anywhere}
.c-rep-ft{padding:14px 22px;border-top:1px solid var(--c-ln);font-size:13px;font-weight:600;display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}

.c-empty{padding:22px;border-radius:var(--c-r);border:2px dashed var(--c-ln2);text-align:center;font-weight:700;background:var(--white)}
.c-confirm{margin-top:10px;padding:14px;border-radius:12px;background:var(--black);color:var(--white)}
.c-confirm p{font-weight:700;margin-bottom:10px}
.c-confirm .c-btn.line{background:transparent;color:var(--white);border-color:var(--white)}
@media print{.c-banner,.c-side,.c-top,.c-tabbar,.c-noprint{display:none!important}.c-shell{display:block}.c-view{padding:0}}