:root{
  color-scheme:light;
  --ground:#F5F5F7;--surface:#FFFFFF;--ink:#1D1D1F;--ink2:#6E6E73;--part:#B26A00;--line:rgba(0,0,0,.09);--fill:#EDEDF0;
  --accent:#C2410C;--accent-press:#9A3412;--accent-soft:#FFF0E8;
  --ok:#1A7F37;--ok-soft:#E5F4EA;--due:#8A5300;--due-soft:#FFF1D6;--bad:#C42B1C;--bad-soft:#FDECEA;--info:#0A5BD3;--info-soft:#E8F0FE;
  --r-card:18px;--r-photo:14px;--r-btn:14px;
  --font:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --ease:cubic-bezier(.16,1,.3,1);
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{height:100%}
body{margin:0;background:#E8E8EC;color:var(--ink);font-family:var(--font);font-size:17px;line-height:1.45;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;caret-color:var(--accent)}
::selection{background:#FFDCC8;color:var(--ink)}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
input,textarea{font:inherit;color:var(--ink)}
img{display:block;max-width:100%}
svg.i{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
.app{position:relative;max-width:430px;height:100%;margin:0 auto;background:var(--ground);overflow:hidden;display:flex;flex-direction:column}
@media (min-width:600px){.app{box-shadow:0 0 0 1px rgba(0,0,0,.06),0 20px 60px rgba(0,0,0,.12)}}
.screen{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:0 16px 168px;scrollbar-width:thin;scrollbar-color:#C9C9CE transparent}
.screen::-webkit-scrollbar{width:6px}.screen::-webkit-scrollbar-thumb{background:#C9C9CE;border-radius:3px}
.pr{transition:transform .12s ease,background-color .15s ease,opacity .15s}
.pr:active{transform:scale(.97)}
.tnum{font-variant-numeric:tabular-nums}


.top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 0 2px;min-height:52px}
.who{font-size:15px;color:var(--ink2);font-weight:500}
.back{display:inline-flex;align-items:center;gap:2px;color:var(--accent);font-size:17px;font-weight:500;min-height:48px;margin-left:-6px}
.back svg{width:26px;height:26px}
.areapill{display:inline-flex;align-items:center;gap:6px;background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:9px 14px;font-size:16px;font-weight:600;min-height:48px}
.areapill svg{width:18px;height:18px;color:var(--accent)}
h1.lt{font-size:34px;line-height:1.12;font-weight:700;letter-spacing:-.022em;margin:2px 0 0;text-wrap:balance}
.sub{font-size:17px;color:var(--ink2);margin:2px 0 0}
h2.sec{font-size:22px;font-weight:700;letter-spacing:-.015em;margin:28px 4px 10px;display:flex;align-items:baseline;justify-content:space-between}
h2.sec small{font-size:15px;font-weight:500;color:var(--ink2);letter-spacing:0}

.compact{position:absolute;left:0;right:0;top:0;z-index:6;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:8px;padding:calc(6px + env(safe-area-inset-top,0px)) 12px 6px;min-height:62px;background:rgba(245,245,247,.88);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);border-bottom:1px solid var(--line);opacity:0;transform:translateY(-6px);pointer-events:none;transition:opacity .2s ease,transform .25s var(--ease)}
.compact.on{opacity:1;transform:none;pointer-events:auto}
.compact h2{margin:0;font-size:17px;font-weight:600;text-align:center;white-space:nowrap}
.compact .cl{justify-self:start;display:flex;align-items:center;gap:6px;font-size:15px;font-weight:600;color:var(--ink2);min-height:44px}
.compact .cl.back{color:var(--accent)}
.compact .cr{justify-self:end}
.compact .areapill{min-height:48px;padding:6px 12px;font-size:15px}
.me{width:26px;height:26px;border-radius:50%;background:#2F6FB3;color:#fff;display:grid;place-items:center;font-size:13px;font-weight:700}


.today{margin-top:18px;background:var(--surface);border-radius:var(--r-card);display:grid;grid-template-columns:repeat(3,1fr)}
.tt{display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:14px 14px 15px;text-align:left;min-height:118px}
.tt+.tt{border-left:1px solid var(--line)}
.dot{width:36px;height:36px;border-radius:50%;display:grid;place-items:center}
.dot svg{width:20px;height:20px}
.dot.ok{background:var(--ok-soft);color:var(--ok)}.dot.due{background:var(--due-soft);color:var(--due)}.dot.neu{background:var(--fill);color:var(--ink)}.dot.bad{background:var(--bad-soft);color:var(--bad)}
.tt b{font-size:17px;font-weight:600;line-height:1.2}
.tt b.due{color:var(--due)}.tt b.bad{color:var(--bad)}
.tt span{font-size:15px;color:var(--ink2);line-height:1.25}


.group{background:var(--surface);border-radius:var(--r-card);overflow:hidden}
.row{width:100%;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;padding:12px 14px;min-height:76px;text-align:left;position:relative}
.row+.row::before{content:"";position:absolute;top:0;left:84px;right:0;height:1px;background:var(--line)}
.row.plain+.row.plain::before{left:14px}
.thumb{width:56px;height:56px;border-radius:12px;object-fit:cover;background:var(--fill)}
.ini{width:56px;height:56px;border-radius:12px;display:grid;place-items:center;font-size:20px;font-weight:700;color:#fff}
.ini.plt{background:var(--fill);color:var(--ink)}
.ini.plt svg{width:26px;height:26px}
.row h3{margin:0;font-size:17px;font-weight:600;line-height:1.25;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.row p{margin:2px 0 0;font-size:15px;color:var(--ink2);line-height:1.3}
.row p.due{color:var(--due);font-weight:500}
.chev{color:#AEAEB2}
.badge{display:inline-flex;align-items:center;gap:4px;font-size:15px;font-weight:600;padding:2px 8px;border-radius:999px;line-height:1.4}
.badge.new{background:var(--due-soft);color:var(--due)}
.badge.ok{background:var(--ok-soft);color:var(--ok)}.badge.due{background:var(--due-soft);color:var(--due)}.badge.bad{background:var(--bad-soft);color:var(--bad)}.badge.info{background:var(--info-soft);color:var(--info)}.badge.neu{background:var(--fill);color:var(--ink)}
.addrow{display:flex;align-items:center;gap:12px;padding:16px 14px;color:var(--accent);font-weight:600;width:100%;min-height:60px;border-top:1px solid var(--line)}
.addrow svg{width:22px;height:22px}


.fab{position:absolute;left:50%;bottom:calc(88px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);display:flex;align-items:center;gap:10px;background:var(--accent);color:#fff;font-size:18px;font-weight:600;padding:0 28px;height:58px;border-radius:999px;box-shadow:0 6px 18px rgba(0,0,0,.2),0 2px 6px rgba(0,0,0,.12);z-index:5;white-space:nowrap}
.fab:active{transform:translateX(-50%) scale(.97);background:var(--accent-press)}
.fab svg{width:24px;height:24px}
.tabbar{position:absolute;left:0;right:0;bottom:0;display:grid;grid-template-columns:repeat(4,1fr);padding:8px 6px calc(10px + env(safe-area-inset-bottom,0px));background:rgba(249,249,251,.86);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);border-top:1px solid var(--line);z-index:4}
.tab{display:flex;flex-direction:column;align-items:center;gap:3px;font-size:15px;font-weight:600;color:var(--ink2);min-height:52px;justify-content:center}
.tab svg{width:26px;height:26px}
.tab.on{color:var(--accent)}


.acts{display:grid;grid-template-columns:1.25fr 1fr;gap:10px;margin-top:18px}
.big{display:flex;align-items:center;justify-content:center;gap:10px;height:60px;border-radius:var(--r-btn);font-size:18px;font-weight:600}
.big svg{width:24px;height:24px}
.big.primary{background:var(--accent);color:#fff}.big.primary:active{background:var(--accent-press)}
.big.dark{background:var(--ink);color:#fff}
.big.quiet{background:var(--surface);color:var(--ink);border:1px solid var(--line)}

.entries{display:flex;flex-direction:column;gap:14px}
.card{background:var(--surface);border-radius:var(--r-card);overflow:hidden;text-align:left;width:100%}
.card .ph{position:relative}
.card .ph img{width:100%;aspect-ratio:4/3;object-fit:cover}
.card .ph .tag{position:absolute;left:10px;top:10px;background:rgba(255,255,255,.94);border-radius:999px;padding:5px 11px;font-size:15px;font-weight:600;color:var(--ink)}
.card .bd{padding:12px 14px 14px}
.meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.meta time{font-size:17px;font-weight:700}
.meta .ar{font-size:15px;color:var(--ink2);font-weight:500}
.card .txt{margin:6px 0 0;font-size:17px;line-height:1.4}
.card .ft{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:10px;font-size:15px;color:var(--ink2)}
.sync{display:inline-flex;align-items:center;gap:6px;font-size:15px;font-weight:600;white-space:nowrap}
.ring{width:14px;height:14px;border-radius:50%;border:2px solid currentColor;position:relative;transition:background-color .5s var(--ease)}
.sync.phone{color:var(--due)}.sync.saved{color:var(--ok)}.sync.saved .ring{background:currentColor}
.sync.locked{color:var(--ink2)}
.sync.locked svg{width:16px;height:16px}
.note{margin-top:10px;background:var(--due-soft);border-radius:12px;padding:10px 12px;font-size:16px;line-height:1.4}
.note b{display:block;font-size:15px;color:var(--due);margin-bottom:2px}
.addnote{display:inline-flex;align-items:center;gap:6px;margin-top:8px;min-height:48px;color:var(--accent);font-weight:600;font-size:16px}
.addnote svg{width:18px;height:18px}
.card.fresh{animation:drop .6s var(--ease)}
@keyframes drop{from{transform:translateY(-14px);opacity:.2}to{transform:none;opacity:1}}
.empty{background:var(--surface);border-radius:var(--r-card);padding:26px 18px;text-align:center;color:var(--ink2)}
.empty b{display:block;color:var(--ink);font-size:17px;margin-bottom:4px}


.stepper{display:flex;align-items:center;justify-content:space-between;background:var(--surface);border-radius:var(--r-card);margin-top:16px;padding:6px}
.stepper button{width:48px;height:48px;border-radius:12px;display:grid;place-items:center}
.stepper button:disabled{opacity:.3}
.stepper div{text-align:center}
.stepper b{display:block;font-size:17px}
.stepper span{font-size:15px;color:var(--ink2)}
.seg{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;background:var(--fill);border-radius:12px;padding:3px;margin-top:12px}
.seg button{height:48px;border-radius:10px;font-size:16px;font-weight:600;color:var(--ink2)}
.seg button.on{background:var(--surface);color:var(--ink);box-shadow:0 1px 3px rgba(0,0,0,.12)}
.lockbar{display:flex;gap:12px;align-items:flex-start;background:var(--fill);border-radius:14px;padding:12px 14px;margin-top:12px;font-size:15px;color:var(--ink)}
.lockbar svg{width:20px;height:20px;margin-top:1px}
.who-on{font-size:15px;font-weight:600;color:var(--ink)}


.ofc{background:var(--surface);border-radius:var(--r-card);padding:16px;margin-top:16px}
.ofc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px 10px}
.kv b{display:block;font-size:28px;font-weight:700;letter-spacing:-.02em;line-height:1.1}
.kv span{font-size:15px;color:var(--ink2)}
.ofc-line{display:flex;align-items:center;gap:10px;margin-top:14px;padding-top:14px;border-top:1px solid var(--line);font-size:15px}
.strip{display:grid;grid-template-columns:96px 1fr;align-items:center;gap:10px;padding:10px 14px}
.strip+.strip{border-top:1px solid var(--line)}
.strip b{font-size:16px;font-weight:600}
.sq{display:grid;grid-template-columns:repeat(14,1fr);gap:3px}
.sq i{aspect-ratio:1;border-radius:3px;border:2px solid #8E8E93}
.sq i.g{background:var(--ok);border-color:var(--ok)}.sq i.a{background:#B26A00;border-color:#B26A00}
.axis{display:flex;justify-content:space-between;font-size:14px;color:var(--ink2);padding:0 14px 10px 120px}
.legend{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:15px;color:var(--ink2);margin:10px 4px 0}
.legend i{display:inline-block;width:11px;height:11px;border-radius:50%;margin-right:6px;vertical-align:-1px}
.legend i.n{background:transparent;border:2px solid #8E8E93}
.legend.sql i{border-radius:2px}
.pgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:3px;border-radius:var(--r-card);overflow:hidden}
.pgrid img{width:100%;aspect-ratio:1;object-fit:cover}
.pgl{font-size:15px;font-weight:600;color:var(--ink2);margin:16px 4px 8px}
.tbl{width:100%;border-collapse:collapse;font-size:15px}
.tbl th{text-align:right;font-weight:600;color:var(--ink2);font-size:14px;padding:10px 5px;border-bottom:1px solid var(--line)}
.tbl th:first-child,.tbl td:first-child{text-align:left;padding-left:12px}
.tbl th:last-child,.tbl td:last-child{padding-right:12px}
.tbl td{text-align:right;padding:12px 5px;border-bottom:1px solid var(--line);font-variant-numeric:tabular-nums}
.tbl tr:last-child td{border-bottom:0}
.tblwrap{background:var(--surface);border-radius:var(--r-card);overflow-x:auto}
.search{display:flex;align-items:center;gap:8px;background:var(--fill);border-radius:12px;padding:0 12px;height:44px;margin-top:14px;color:var(--ink2)}
.search input{border:0;background:transparent;flex:1;height:100%;font-size:17px;outline:none}
.exp{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}

.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;text-align:center}
.cw{font-size:14px;font-weight:600;color:var(--ink2);padding-bottom:4px}
.cd{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;height:48px;border-radius:12px}
.cd b{font-size:16px;font-weight:600}
.cd i{width:6px;height:6px;border-radius:50%}
.cd i.g{background:var(--ok)}.cd i.a{background:#B26A00}
.cd.td b{color:var(--accent)}
.cd.on{background:var(--ink)}.cd.on b{color:#fff}
.cd:disabled{opacity:.35}

.scrim{position:absolute;inset:0;background:rgba(0,0,0,.32);opacity:0;transition:opacity .3s ease;z-index:20}
.scrim.on{opacity:1}
.sheet{position:absolute;left:0;right:0;bottom:0;max-height:94%;background:var(--ground);border-radius:22px 22px 0 0;z-index:21;display:flex;flex-direction:column;transform:translateY(100%);transition:transform .42s var(--ease)}
.sheet.on{transform:none}
.grab{width:40px;height:5px;border-radius:3px;background:#C7C7CC;margin:8px auto 0}
.sh-top{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:6px 12px 8px;min-height:52px}
.sh-top h3{margin:0;font-size:17px;font-weight:600;text-align:center}
.sh-top .l{justify-self:start;color:var(--accent);font-size:17px;min-height:48px;padding:0 8px}
.sh-body{overflow-y:auto;padding:4px 16px 16px}
.sh-foot{padding:10px 16px calc(14px + env(safe-area-inset-bottom,0px));background:var(--ground);border-top:1px solid var(--line)}
.sh-foot .big{width:100%}
.big:disabled{background:#D9D9DE;color:#8E8E93}
.prev{position:relative;border-radius:var(--r-photo);overflow:hidden;background:var(--fill)}
.prev img{width:100%;aspect-ratio:4/3;object-fit:cover}
.prev .tag{position:absolute;left:10px;top:10px;background:rgba(255,255,255,.94);border-radius:999px;padding:5px 11px;font-size:15px;font-weight:600}
.prev .tag.gal{background:var(--due-soft);color:var(--due)}
.prev .redo{position:absolute;right:10px;bottom:10px;background:rgba(29,29,31,.78);color:#fff;border-radius:999px;padding:12px 18px;font-size:16px;font-weight:600;min-height:48px}
.fld{background:var(--surface);border-radius:var(--r-card);margin-top:14px;overflow:hidden}
.fld .r{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 14px;min-height:56px;width:100%;text-align:left}
.fld .r+.r{border-top:1px solid var(--line)}
.fld .r span{color:var(--ink2)}
.fld .r b{font-weight:600;display:inline-flex;align-items:center;gap:4px}
.fld textarea,.fld input[type=text],.fld input[type=number]{width:100%;border:0;background:transparent;padding:16px 14px;font-size:17px;resize:none;outline:none}
.lab{font-size:15px;font-weight:600;color:var(--ink2);margin:18px 4px 8px}
.tchips{display:flex;gap:8px;overflow-x:auto;padding-bottom:2px;scrollbar-width:none}
.tchips::-webkit-scrollbar{display:none}
.tc{flex:none;height:48px;padding:0 16px;border-radius:999px;background:var(--surface);border:1px solid var(--line);font-size:16px;font-weight:600;color:var(--ink)}
.tc.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.sw{width:51px;height:31px;border-radius:999px;background:#E3E3E8;position:relative;transition:background-color .2s}
.sw::after{content:"";position:absolute;left:2px;top:2px;width:27px;height:27px;border-radius:50%;background:#fff;box-shadow:0 2px 4px rgba(0,0,0,.2);transition:transform .25s var(--ease)}
.sw.on{background:var(--ok)}.sw.on::after{transform:translateX(20px)}
.opt{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:56px;padding:0 14px;width:100%;text-align:left}
.opt+.opt{border-top:1px solid var(--line)}
.opt .ck{width:24px;height:24px;border-radius:50%;border:2px solid #C7C7CC;display:grid;place-items:center;color:#fff}
.opt.on .ck{background:var(--accent);border-color:var(--accent)}
.opt .ck svg{width:15px;height:15px;stroke-width:3}
.wtiles{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.wt{background:var(--surface);border-radius:var(--r-card);border:2px solid transparent;padding:16px 14px;display:flex;flex-direction:column;align-items:flex-start;gap:10px;min-height:104px;text-align:left}
.wt b{font-size:18px}
.wt.on{border-color:var(--accent);background:var(--accent-soft)}
.wt svg{width:28px;height:28px}
.tctl{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:10px;padding:10px 10px 10px 14px}
.tctl+.tctl{border-top:1px solid var(--line)}
.tctl .tl{font-size:16px;color:var(--ink2)}
.tv{display:flex;align-items:center;gap:6px}
.tv button{width:48px;height:48px;border-radius:12px;background:var(--fill);display:grid;place-items:center}
.tv output{min-width:64px;text-align:center;font-size:20px;font-weight:700}
.now{height:48px;padding:0 14px;border-radius:12px;background:var(--ink);color:#fff;font-size:15px;font-weight:600}
.agrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.agrid.l{grid-template-columns:repeat(4,1fr)}
.ab{height:54px;border-radius:14px;background:var(--surface);border:2px solid transparent;font-size:17px;font-weight:600}
.ab.on{border-color:var(--accent);background:var(--accent-soft);color:var(--accent)}
.hc{display:grid;grid-template-columns:1fr auto;align-items:center;gap:12px;padding:8px 8px 8px 14px;min-height:64px}
.hc+.hc{border-top:1px solid var(--line)}
.hc b{font-size:17px;font-weight:600}
.step{display:flex;align-items:center;gap:6px}
.step button{width:48px;height:48px;border-radius:12px;background:var(--fill);display:grid;place-items:center}
.step output{min-width:40px;text-align:center;font-size:22px;font-weight:700;font-variant-numeric:tabular-nums}
.total{display:flex;justify-content:space-between;padding:14px;font-weight:600;border-top:1px solid var(--line)}
.confirm{background:var(--bad-soft);border-radius:var(--r-card);padding:14px;margin-top:14px}
.confirm p{margin:0 0 10px;font-weight:600;color:var(--bad)}
.confirm .two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.big.danger{background:var(--bad);color:#fff}


.toast{position:absolute;left:16px;right:16px;bottom:calc(160px + env(safe-area-inset-bottom,0px));background:var(--ink);color:#fff;border-radius:16px;padding:14px 16px;display:flex;gap:12px;align-items:center;font-size:16px;font-weight:500;z-index:30;opacity:0;transform:translateY(10px);transition:opacity .25s ease,transform .35s var(--ease);pointer-events:none}
.toast.on{opacity:1;transform:none}
.toast svg{color:#7EE2A0}


.signin>*{flex-shrink:0}
.signin{position:absolute;inset:0;background:var(--ground);z-index:40;display:flex;flex-direction:column;overflow-y:auto;padding:24px 16px 32px}
.signin h1{font-size:34px;font-weight:700;letter-spacing:-.022em;margin:28px 0 4px}
.signin p.s{margin:0 0 22px;color:var(--ink2)}
.pins{display:flex;gap:18px;justify-content:center;margin:34px 0 10px}
.pins i{width:18px;height:18px;border-radius:50%;border:2px solid var(--ink)}
.pins i.f{background:var(--ink)}
.pinmsg{text-align:center;min-height:24px;font-size:15px;color:var(--bad);font-weight:600}
.keys{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;max-width:320px;margin:18px auto 0;width:100%}
.keys button{height:72px;border-radius:50%;background:var(--surface);font-size:30px;font-weight:500;width:72px;justify-self:center}
.keys button.t{background:transparent;font-size:16px;color:var(--accent);font-weight:600}
.locknote{display:flex;gap:12px;background:var(--surface);border-radius:var(--r-card);padding:16px;margin-top:20px;align-items:flex-start}
.foot-note{font-size:15px;color:var(--ink2);text-align:center;margin:22px 8px 0;line-height:1.5}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

.syncchip{display:inline-flex;align-items:center;gap:8px;font-size:15px;font-weight:600;color:var(--ink2);min-height:48px}
.syncchip .ring{width:12px;height:12px}
.syncchip.ok{color:var(--ok)}.syncchip.ok .ring{background:currentColor}
.syncchip.wait{color:var(--due)}
.syncchip.err{color:var(--bad)}
.gallink{display:block;margin:12px auto 0;color:var(--accent);font-size:16px;font-weight:600;min-height:48px}
.hiddenbar{display:flex;gap:10px;align-items:flex-start;background:var(--fill);border-radius:12px;padding:10px 12px;margin-top:10px;font-size:15px;color:var(--ink)}
.hiddenbar svg{width:18px;height:18px;margin-top:2px;color:var(--ink2)}
.card.hid .ph,.card.hid .txt{opacity:.45}
.card .err{margin-top:10px;background:var(--bad-soft);color:var(--bad);border-radius:12px;padding:10px 12px;font-size:15px;font-weight:600}
.card .by{font-size:15px;font-weight:600;color:var(--ink)}
.cardbtn{width:100%;text-align:left;display:block}
.phstrip{display:flex;gap:10px;overflow-x:auto;padding-bottom:4px}
.phstrip .pt{position:relative;flex:none;width:120px;height:90px;border-radius:12px;overflow:hidden;background:var(--fill)}
.phstrip .pt img{width:100%;height:100%;object-fit:cover}
.phstrip .pt button{position:absolute;right:4px;top:4px;width:40px;height:40px;border-radius:50%;background:rgba(29,29,31,.78);color:#fff;display:grid;place-items:center}
.phstrip .pt button svg{width:18px;height:18px}
.phstrip .add{flex:none;width:120px;height:90px;border-radius:12px;border:2px dashed #C7C7CC;color:var(--ink2);display:grid;place-items:center;font-weight:600}
.danger-link{display:block;width:100%;margin-top:18px;min-height:52px;border-radius:var(--r-btn);background:var(--surface);color:var(--bad);font-weight:600;font-size:17px}
.code{width:100%;border:0;background:var(--surface);border-radius:var(--r-card);height:64px;font-size:28px;font-weight:700;letter-spacing:.3em;text-align:center;outline:none}
.signin .err{margin:14px 0 0;color:var(--bad);font-weight:600;font-size:16px;text-align:center;min-height:24px}
.boot{display:grid;place-items:center;height:100%;color:var(--ink2);font-size:17px}
img[data-pid]:not([src]){background:var(--fill)}
.ph img[data-pid]:not([src]){aspect-ratio:4/3}
.shiftlink{display:inline-block;color:var(--accent);font:inherit;font-weight:600;padding-block:12px;margin-block:-12px}

.search input::-webkit-search-cancel-button{-webkit-appearance:none}
.search input{-webkit-appearance:none;appearance:none}
.fpills{display:flex;gap:8px;overflow-x:auto;margin-top:10px;padding-bottom:2px;scrollbar-width:none}
.fpills::-webkit-scrollbar{display:none}
.fpill{flex:none;display:inline-flex;align-items:center;gap:4px;height:48px;padding:0 12px 0 16px;border-radius:999px;background:var(--surface);border:1px solid var(--line);font-size:16px;font-weight:600;color:var(--ink)}
.fpill svg{width:18px;height:18px}
.fpill .chev{transform:rotate(90deg)}
.fpill.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.dhead{font-size:17px;font-weight:700;margin:18px 4px 2px}
.ofc-line{width:100%;text-align:left;display:flex;align-items:flex-start;gap:10px;margin-top:12px;padding-top:12px;border-top:1px solid var(--line);font-size:16px;line-height:1.4;min-height:48px}
.ofc-line svg{flex:none;margin-top:1px}
.ofc-line.info{color:var(--info)}.ofc-line.due{color:var(--due)}.ofc-line.bad{color:var(--bad)}
.kv b.bad{color:var(--bad)}
.pgrid button{display:block;padding:0}
.phbtn{display:block;width:100%;padding:0}
.strip{width:100%;text-align:left;display:grid;grid-template-columns:110px 1fr;align-items:center;gap:10px;padding:12px 14px;min-height:64px}
.strip+.strip{border-top:1px solid var(--line)}
.strip b{display:block;font-size:17px;font-weight:600}
.strip small{display:block;font-size:15px;color:var(--ink2);line-height:1.3;margin-top:2px}
.sq{display:grid;grid-template-columns:repeat(14,1fr);gap:3px}
.sq i{aspect-ratio:1;border-radius:3px;border:2px solid #8E8E93}
.sq i.g{background:var(--ok);border-color:var(--ok)}
.sq i.a{border-color:var(--part);background:linear-gradient(135deg,var(--part) 50%,transparent 50%)}
.axis{display:flex;justify-content:space-between;font-size:15px;color:var(--ink2);padding:0 14px 12px 134px}
.legend i.pt{border:2px solid var(--part);background:linear-gradient(135deg,var(--part) 50%,transparent 50%)}
.cd i.g{background:var(--ok)}
.cd i.a{background:var(--part)}
tr.tap{cursor:pointer}
tr.tap:active td{background:var(--fill)}
.mini{height:44px;padding:0 14px;border-radius:12px;background:var(--fill);font-size:15px;font-weight:600;color:var(--ink)}
.mini-danger{height:44px;padding:0 14px;border-radius:12px;background:var(--bad);font-size:15px;font-weight:600;color:#fff}
.card.flash{animation:flash 1.2s var(--ease)}
@keyframes flash{0%{outline:3px solid var(--accent);outline-offset:2px}70%{outline:3px solid var(--accent);outline-offset:2px}100%{outline:3px solid transparent;outline-offset:2px}}
.viewer{position:absolute;inset:0;z-index:50;background:#0B0B0C;display:flex;flex-direction:column;justify-content:center}
.viewer img{width:100%;max-height:78%;object-fit:contain}
.vclose{position:absolute;right:12px;top:calc(12px + env(safe-area-inset-top,0px));width:48px;height:48px;border-radius:50%;background:rgba(255,255,255,.16);color:#fff;display:grid;place-items:center;z-index:2}
.vcap{color:#fff;font-size:16px;line-height:1.45;padding:14px 18px}
@media (min-width:900px){
body.office .app{max-width:1120px}
body.office .screen{padding-inline:28px}
body.office .entries{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));align-items:start}
body.office .pgrid{grid-template-columns:repeat(6,1fr)}
body.office .ofc-grid{grid-template-columns:repeat(6,1fr)}
body.office .fpills{flex-wrap:wrap}
body.office .tabbar{padding-inline:calc(50% - 300px)}
body.office .sheet{left:50%;right:auto;width:520px;transform:translate(-50%,100%)}
body.office .sheet.on{transform:translate(-50%,0)}
body.office .viewer img{max-height:84%}
}