/* Pochacco stationery theme. All assets are local for offline use. */
:root {color-scheme:light;--bg:#f7f5ef;--surface:#fffefa;--surface-2:#f5f0e6;--ink:#493e35;--ink-soft:#675c50;--muted:#85796c;--line:#e9e2d6;--line-strong:#d9cebb;--danger:#ab5745;--danger-bg:#fbefe7;--danger-line:#e9cabc;--ok:#63795a;--ok-bg:#edf2e7;--c-work:#997956;--c-life:#bd836c;--c-study:#788868;--c-sport:#bf9852;--c-habit:#b68783;--gold:#aa823a;--shadow:0 4px 18px #68533506;--radius:20px}
body{background:var(--bg);font-family:"Microsoft YaHei","PingFang SC",sans-serif;font-size:14px;line-height:1.65}
.brand-panel{position:fixed;inset:0 auto 0 0;width:228px;background:#f1ebdf;border-right:1px solid #e6ddcd;padding:35px 25px;z-index:20}
.brand{display:flex;gap:11px;align-items:center;color:var(--ink);text-decoration:none;font-size:21px;font-weight:800;letter-spacing:1px}
.brand small{display:block;font-size:8px;letter-spacing:1.5px;margin-top:3px;font-weight:500}
.brand-mark{display:grid;place-items:center;flex:none;width:39px;height:44px;color:#fff8e9;background:#806950;border-radius:15px 15px 12px 12px;font-size:30px;transform:rotate(-7deg)}
.side-caption{font-size:11px;margin:24px 0;color:#918370}
.side-note{position:absolute;bottom:110px;left:24px;right:24px;border:1px solid #ded3bf;background:repeating-linear-gradient(0deg,transparent,transparent 23px,#b49b7015 23px,#b49b7015 24px),#fbf7e9;padding:24px 18px 18px;transform:rotate(-3deg);border-radius:4px 15px 15px 4px;box-shadow:3px 5px 0 #e5dccb}
.side-note:before{content:"";position:absolute;top:-9px;left:55px;width:60px;height:18px;background:#b8bd9790;transform:rotate(6deg)}
.note-star{display:block;color:#b7944c;font-size:30px}.side-note strong{font-size:14px}.side-note p{font-size:11px;line-height:1.9;color:#8a7b66}.note-foot{font-size:7px;letter-spacing:1.4px;color:#9c8c73}.side-bottom{position:absolute;bottom:28px;font-size:8px;letter-spacing:1px;line-height:2;color:#978874}.side-bottom span{font-size:10px;letter-spacing:2px}
.wrap{max-width:1460px;margin:0 auto 0 228px;padding:30px 42px 24px}
.topbar{align-items:center;margin-bottom:26px;gap:16px}.today-line{font-size:11px;letter-spacing:1px;color:#938570}.topbar h1{font-size:23px;letter-spacing:1px;margin-top:6px}.title-spark{color:#c29a54;margin-left:12px}
.backup-note{font-size:10px;color:#948775;margin-top:7px}.backup-btns .btn{background:transparent;font-size:11px;border-radius:8px;padding:7px 12px}.backup-btns .btn:first-child{background:#fffdf7}
.tabs{position:fixed;z-index:21;left:23px;top:165px;width:181px;display:flex;flex-direction:column;gap:8px;margin:0}
.tab{border:1px solid transparent;border-radius:12px;background:transparent;padding:13px 18px;color:#83735f;font-size:14px;gap:14px;font-weight:500;position:relative}
.tab svg{width:19px;height:19px;flex:none}.tab:hover{background:#e9e0d1}.tab.active{background:#7d6951;color:#fffaf0;border-color:#7d6951;box-shadow:0 4px 8px #68523615}.tab.active:after{content:"";width:5px;height:5px;border-radius:50%;background:#f7e6ba;margin-left:auto}.tab .badge{margin-left:auto;background:#b4775c}.tab.active:has(.badge):after{display:none}
.welcome{position:relative;min-height:306px;margin-bottom:26px;background:#fcf6e9;border:1px solid #e9dfc9;border-radius:23px;overflow:hidden;isolation:isolate}
.welcome-copy{position:relative;z-index:2;padding:34px 35px;max-width:55%}.eyebrow{font-size:9px;letter-spacing:2px;color:#958467;display:flex;gap:7px;align-items:center}.eyebrow span{width:6px;height:6px;background:#a1ab83;border-radius:50%}.welcome h2{font-size:30px;line-height:1.55;letter-spacing:1px;margin:15px 0 12px;font-weight:750}.welcome p{font-size:12px;color:#94816b;line-height:1.95;margin:0 0 19px}.hero-button{background:#7b6850;color:#fff9e9;border:0;padding:11px 18px;border-radius:10px;font-size:12px}.hero-button span{margin-left:13px}.hero-button:hover{background:#63523e}.hero-foot{font-size:10px;color:#ac9574;margin-top:15px;letter-spacing:.5px}.hero-art{position:absolute;right:0;bottom:0;height:100%;width:65%;object-fit:cover;object-position:right center;z-index:0;mix-blend-mode:multiply}.hero-sticker{position:absolute;right:29px;top:20px;background:#e9ecdb;border:1px dashed #abb18b;border-radius:50%;width:87px;height:87px;display:flex;flex-direction:column;justify-content:center;align-items:center;transform:rotate(12deg);color:#7e8963;font-family:Georgia,serif;font-style:italic;font-size:14px;line-height:1.4;z-index:1}.hero-sticker b{font-weight:400}
body:not([data-view="today"]) .welcome{display:none}
.stats{gap:12px;margin-bottom:26px}.stat{position:relative;border-radius:15px;padding:20px 17px 16px;background:#fffefa;box-shadow:none;border-color:#e9e2d6;min-height:111px}.stat:nth-child(2){background:#f1f3e9}.stat:nth-child(3){background:#fbf1e4}.stat:nth-child(4){background:#f3eeea}.stat:nth-child(5){background:#f4f0df}.stat .num{font-size:28px;font-family:Georgia,"Microsoft YaHei",serif;color:#67553f}.stat .num small{font-size:12px;color:#94846c}.stat .label{font-size:10px;margin-top:7px;color:#887b66}.progress{height:5px;border:0;background:#eee7d9;margin-top:10px}.progress>i{background:#a2ae89}
.card{padding:24px;border-color:#e7dfd2;box-shadow:var(--shadow);margin-bottom:20px}.card>h2,.sec-head h2{font-size:16px;letter-spacing:.5px}.card>h2 .bar,.sec-head .bar{height:15px;width:4px;border-radius:3px;background:#a29170}.sec-head{margin-bottom:15px}.sec-head .sub{font-size:10px}.grid-2{gap:20px}.empty{padding:22px 12px;color:#9a8a73;font-size:12px;background:repeating-linear-gradient(0deg,transparent,transparent 27px,#bda98012 27px,#bda98012 28px);border-radius:10px;margin:10px 0;text-align:center}
.btn{border-color:#dcd0bb;border-radius:9px;font-size:12px;padding:9px 15px}.btn.primary{background:#7d6951;border-color:#7d6951;color:#fff9ef}.btn.primary:hover{background:#68553f}.btn.small{font-size:11px}.icon-btn{font-size:11px;padding:7px}.task{padding:13px 0;gap:11px}.task .title{font-size:13px;font-weight:600}.task .meta,.task .note{font-size:11px}.task .check{border-color:#cfc3ac;background:#fffef9;width:23px;height:23px}.task.done .check{background:#8b9b79;border-color:#8b9b79}.pill{font-size:10px;padding:0 7px}.pill.pri-mid{background:#f6edda;color:#96763c}.pill.pri-low{background:#f3f0e8;color:#8e826c}.overdue-card{background:#fbf0e9;border-style:dashed}.done-fold summary{font-size:11px}
input[type="text"],input[type="date"],input[type="number"],select,textarea{background:#fcfaf5;border-color:#e2d9c9;border-radius:10px;padding:10px 12px;font-size:13px;min-width:0}input:focus,select:focus,textarea:focus{outline:2px solid #a79c7e;background:#fffefb}.form-note{font-size:10px}.editing-banner{font-size:11px;background:#f8efdb;color:#8a7049;border-color:#e6d7b7}form.add{gap:10px;margin-top:20px}.log-row{font-size:12px;padding:12px 0}.log-row .d{font-size:10px}.mini-stats div b{font-family:Georgia,"Microsoft YaHei",serif;color:#7a684e;font-size:22px}.mini-stats div span{font-size:10px}.word{padding:11px 0;gap:9px}.word .w{font-family:Georgia,serif;font-size:17px;color:#655039}.word .meaning{font-size:12px}.word .ipa{font-size:11px}.word .learned-btn{background:#faf7ed;padding:5px 10px;font-size:10px}.word .learned-btn.on{background:#edf2e7}.words-progress{font-size:10px}.lesson{font-size:15px;line-height:2.1;color:#837158}.lesson .from{font-size:10px}
.law{background:#faf7ee;border-style:dashed;box-shadow:none}.law .n{color:#a58c63;font-size:10px}.law h3{font-size:14px}.law p{font-size:12px}.habit{padding:23px;border-color:#e6decd}.habit h3{font-size:16px}.habit .identity{color:#a18a6e;font-size:12px}.habit .fields{font-size:12px}.habit .fields b{font-size:11px}.checkin{font-size:12px;border-color:#9eab8a;color:#788665;padding:9px 15px}.checkin.done{background:#8d9d79;color:#fff}.day .dotc{border-color:#d8ceba;background:#fffdf7}.day.on .dotc{background:#95a47f;border-color:#95a47f}.streak{font-size:12px}.modal{background:#fffdf7;border-radius:22px}.toast{background:#746149;color:#fff8e8;font-size:12px}.page-footer{display:flex;justify-content:space-between;color:#a29683;font-size:10px;padding:10px 3px 0}.page-footer span{font-size:8px;letter-spacing:1.5px}
@media(min-width:1500px){.wrap{margin-left:calc(228px + (100vw - 1500px)/2);max-width:1272px}}
@media(max-width:1150px){.wrap{padding:26px}.welcome h2{font-size:25px}.welcome-copy{padding:29px;max-width:60%}.hero-art{width:62%}.hero-sticker{width:65px;height:65px;font-size:11px;right:16px}.stats{grid-template-columns:repeat(3,1fr)}.stat{min-height:105px}.backup-note{max-width:180px}.topbar h1{font-size:20px}}
@media(max-height:780px) and (min-width:761px){.side-note{display:none}}
@media(max-width:760px){.brand-panel{position:relative;width:auto;height:auto;padding:19px 21px 16px;background:#f1ebdf;border-right:0;border-bottom:1px solid #e6ddcd}.brand{font-size:19px}.brand small{font-size:7px}.brand-mark{height:36px;width:33px;font-size:26px}.side-caption,.side-note,.side-bottom{display:none}.wrap{margin:0;padding:22px 18px calc(100px + env(safe-area-inset-bottom))}.topbar{margin-bottom:20px;align-items:flex-start}.today-line{font-size:10px;letter-spacing:.3px}.topbar h1{font-size:19px;margin-top:6px;letter-spacing:0}.backup-box{text-align:left;width:100%;display:flex;justify-content:space-between;align-items:center;gap:10px}.backup-btns .btn{font-size:10px;padding:6px 10px}.backup-note{font-size:9px;margin:0;max-width:150px}.tabs{position:fixed;top:auto;bottom:0;left:0;right:0;width:auto;flex-direction:row;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:0;padding:9px 8px calc(9px + env(safe-area-inset-bottom));background:#fffdf7f5;backdrop-filter:blur(14px);border-top:1px solid #e7ddcc;margin:0}.tab{padding:7px 0;flex-direction:column;gap:4px;font-size:10px;border-radius:12px}.tab svg{width:19px;height:19px}.tab.active{background:#eee5d5;border-color:transparent;color:#725b40;box-shadow:none}.tab.active:after{display:none}.tab .badge{position:absolute;right:3px;top:0;font-size:9px;min-width:14px;line-height:14px;padding:0 3px}.welcome{min-height:0;margin-bottom:18px;border-radius:19px}.welcome-copy{padding:25px 23px 185px;max-width:100%}.eyebrow{font-size:8px;letter-spacing:1.5px}.welcome h2{font-size:25px;line-height:1.5;margin-top:13px}.welcome p{font-size:11px;line-height:1.9;margin-bottom:15px}.hero-button{padding:10px 13px;font-size:11px}.hero-foot{display:none}.hero-art{height:230px;width:100%;object-fit:cover;object-position:right 60%;bottom:-5px;z-index:-1}.hero-sticker{top:auto;bottom:105px;left:22px;right:auto;width:64px;height:64px;font-size:11px;transform:rotate(-10deg)}.stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:18px}.stat{padding:16px;min-height:100px}.stat:first-child{grid-column:1 / -1;min-height:0;display:grid;grid-template-columns:1fr 1fr;gap:0 10px;align-items:center}.stat:first-child .num{grid-row:1 / 3}.stat:first-child .label{margin:0}.stat:first-child .progress{grid-column:1 / -1;margin-top:12px}.stat .num{font-size:26px}.stat .label{font-size:10px}.card{padding:19px 16px;border-radius:17px;margin-bottom:16px}.card>h2,.sec-head h2{font-size:15px}.sec-head .sub{font-size:9px}.grid-2{grid-template-columns:1fr;gap:0}.empty{padding:18px 8px;font-size:11px}.page-footer{display:block;text-align:center;font-size:10px}.page-footer span{display:block;margin-top:5px}.laws{gap:10px}.law{padding:15px}.habit{padding:18px}.task .ops{flex-direction:column;gap:0}.task .ops .icon-btn{padding:2px 5px}.word .meaning{min-width:100px}.word .w{font-size:16px}.words-card .sec-head{flex-wrap:wrap}.words-progress{margin-left:auto}.toast{bottom:calc(90px + env(safe-area-inset-bottom))}input[type="text"],input[type="date"],input[type="number"],select,textarea{font-size:16px}.form-note{font-size:10px}.modal-mask{padding:18px}.modal .btn{min-height:44px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
.hero-art{mask-image:linear-gradient(to right,transparent,#000 18%)}
@media(max-width:760px){.hero-art{mask-image:linear-gradient(to bottom,transparent,#000 22%)}}