:root{--ink:#241c17;--muted:#9d9188;--brown:#813c00;--line:rgba(102,69,46,.19);--panel:rgba(255,253,250,.65);--peach:#ffe3d3;--safe:env(safe-area-inset-bottom,0px);font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;color:var(--ink);font-synthesis:none}
*{box-sizing:border-box}body{margin:0;background:#f4e7df}button,input,textarea,select{font:inherit}button{cursor:pointer;color:inherit;border:0;background:none;-webkit-tap-highlight-color:transparent}button:disabled{cursor:default}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid #a66631;outline-offset:4px}input,textarea,select{color:inherit;max-width:100%}svg{width:26px;height:26px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
#app{max-width:480px;margin:auto;min-height:100dvh;background:linear-gradient(150deg,#ffe2d1 0%,#ffebe1 53%,#fff8f4 100%);position:relative;overflow-x:clip}.screen{padding:calc(env(safe-area-inset-top,0px) + 32px) 16px calc(112px + var(--safe));min-height:100dvh;animation:appear .18s ease}.page-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:18px 0 14px}h1{font-size:36px;letter-spacing:1px;margin:0;font-weight:800}h2{margin:0;font-size:21px}.tools{display:flex;align-items:center;gap:10px}.icon-button{height:44px;width:40px;display:grid;place-items:center;flex-shrink:0}.icon-button svg{height:28px;width:28px}.icon-button.plus svg{height:31px;width:31px}.stats{display:flex;margin:9px 0 14px}.stat{flex:1;padding-left:20px;border-left:1px solid var(--line);min-width:0}.stat:first-child{border:0;padding-left:0}.stat-number{display:flex;align-items:baseline;gap:2px;white-space:nowrap;font-size:29px;letter-spacing:-1px}.stat-number strong{font-size:34px;font-weight:800;letter-spacing:-1.5px;font-variant-numeric:tabular-nums}.stat-number span{font-size:16px;font-weight:400;letter-spacing:0}.stat p{margin:1px 0 0;font-size:17px;color:var(--muted)}.search{display:flex;gap:8px;align-items:center;background:rgba(113,70,43,.1);border-radius:13px;padding:6px 9px;margin:12px 0 23px;height:45px}.filter{width:39px;height:32px;background:#b88a5f;color:white;border-radius:9px;display:grid;place-items:center;box-shadow:0 2px 4px #ab7b5240}.filter svg{width:21px;height:21px}.search input{background:none;border:0;outline:none;min-width:0;flex:1;font-size:15px}.search input::placeholder{color:#8f7f73}.search>svg{width:21px;height:21px;color:#7b6a5c}.cards{display:grid;gap:14px}.bean-card{position:relative;background:var(--panel);border-radius:17px;min-height:128px;padding:19px 17px;display:flex;flex-direction:column;box-shadow:0 3px 18px #e9b99b09}.card-title{font-size:24px;font-weight:750;margin-right:30px;word-break:break-word;line-height:1.35}.badge{display:inline-block;align-self:flex-start;font-size:11px;font-weight:650;padding:2px 5px;border-radius:3px;margin-top:1px;color:#24412a;background:#8ac782;line-height:1.3}.badge.warning{background:#f4cd68;color:#6a4408}.badge.danger{background:#ec7770;color:#661b1a}.bean-info{align-self:flex-end;line-height:1.5;font-weight:600;font-size:14px;margin-top:4px}.card-menu{position:absolute;right:9px;top:9px;width:30px;height:36px;display:grid;place-items:center}.card-menu svg{width:22px}.bean-photo{width:56px;height:56px;object-fit:cover;border-radius:10px;float:left;margin-right:10px}.empty{text-align:center;padding:56px 12px;color:#9d8776;font-size:14px;line-height:1.8}.empty svg{width:42px;height:42px;margin-bottom:10px}.empty p{margin:4px 0}.empty button{color:var(--brown);font-weight:650;margin-top:10px}.nav{position:fixed;bottom:0;width:min(100%,480px);background:rgba(255,247,240,.91);backdrop-filter:blur(18px);border-top:1px solid #b99a7826;display:flex;justify-content:space-around;padding:9px 12px calc(12px + var(--safe));z-index:20;min-height:82px}.nav button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:51px;min-width:65px;color:#6b5c51;font-size:13px;font-weight:650}.nav button.active{color:#874809}.nav svg{width:29px;height:29px;stroke-width:2}.sub{padding-top:calc(env(safe-area-inset-top,0px) + 13px);padding-bottom:calc(30px + var(--safe))}.sub-header{display:grid;grid-template-columns:40px 1fr 40px;align-items:center;margin:0 0 28px;min-height:45px}.sub-header h1{font-size:21px;letter-spacing:0;text-align:center}.sub-header .icon-button{width:32px}.photo-add{display:flex;align-items:center;justify-content:center;gap:8px;font-size:17px;color:#8c7867;height:66px;margin:-6px 0 18px;width:100%}.photo-add img{height:64px;width:64px;object-fit:cover;border-radius:10px}.section-label{display:flex;align-items:center;justify-content:space-between;width:100%;border-radius:9px;padding:10px 9px;background:rgba(119,81,52,.065);color:#a06e40;font-size:13px;margin:14px 0 0}.section-label svg{height:17px;width:17px}.form-row{display:flex;align-items:center;gap:12px;border-bottom:1px solid var(--line);min-height:53px;padding:10px 5px;font-size:17px}.form-row>label,.form-row>.row-label{flex-shrink:0}.form-row>input,.form-row>select{flex:1;min-width:0;width:0;background:none;border:0;text-align:right;outline:none;font-size:17px;padding:5px 0}.form-row input::placeholder,textarea::placeholder{color:#b5a89c}.form-row select{appearance:none}.form-row input[type=date],.form-row input[type=datetime-local]{font-size:15px;font-weight:600}.period{margin-left:auto;display:flex;align-items:center;gap:9px}.period input{border:0;background:#fff5ed70;border-radius:6px;width:49px;text-align:center;padding:4px;font-size:17px}.radios{display:flex;gap:16px;margin-left:auto;font-size:16px;font-weight:600}.radios label{display:flex;gap:7px;align-items:center;cursor:pointer}.radios input{accent-color:var(--brown);width:18px;height:18px;margin:0}.switch{position:relative;display:block;margin-left:auto;width:45px;height:28px}.switch input{position:absolute;opacity:0}.switch span{display:block;background:#aba9a5;border-radius:20px;transition:.2s;height:28px}.switch span:after{content:'';display:block;position:absolute;width:24px;height:24px;top:2px;left:2px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #0003;transition:.2s}.switch input:checked+span{background:#985719}.switch input:checked+span:after{transform:translateX(17px)}.note{display:block;padding:20px 5px 0;font-size:17px}.note textarea{display:block;width:100%;resize:vertical;min-height:76px;padding:9px 0;border:0;background:none;font-size:16px;line-height:1.6;outline:none}.primary{display:block;background:var(--brown);color:#fff;border-radius:50px;width:100%;font-weight:700;font-size:18px;min-height:52px;padding:13px 16px;box-shadow:0 2px 4px #83421020}.save-wrap{margin-top:15px}.brew-form .form-row{min-height:61px}.bean-select{margin-left:auto;max-width:65%;text-align:right;color:#9c8978;display:flex;align-items:center;justify-content:flex-end;gap:5px;font-size:17px;padding:6px 0}.bean-select.chosen{color:var(--ink);font-weight:600}.bean-select svg{width:15px;height:15px}.stars{margin-left:auto;display:flex;gap:1px}.stars button{font-size:29px;padding:1px 2px;color:#ac9f92;line-height:1}.stars button.on{color:#e8b21d}.field-hint{font-size:12px;color:#9c826c;text-align:right;margin:7px 5px}.record-head{margin-bottom:12px}.record-head h1{font-size:36px}.record-tools{display:flex;align-items:center;gap:7px}.drink-tab{background:#fff7ef7a;border:1px solid #fffcf8;border-radius:12px;padding:8px 14px;font-size:15px;font-weight:650;box-shadow:inset 0 0 0 3px #ffede1}.month-link{display:flex;align-items:center;justify-content:space-between;margin:15px 1px 8px;color:#9b7656;font-size:12px}.month-link button{display:flex;align-items:center;gap:4px;color:#825124}.month-link svg{width:15px;height:15px}.date-strip{display:flex;gap:5px;overflow-x:auto;scrollbar-width:none;scroll-snap-type:x mandatory;margin:0 -16px;padding:0 16px 8px;touch-action:pan-x}.date-strip::-webkit-scrollbar{display:none}.day{flex:0 0 calc((100% - 30px)/7);height:72px;border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;scroll-snap-align:center;font-size:15px;font-weight:700;background:#e3c9b815;color:#9f938b}.day .day-num{min-width:30px;border-radius:14px}.day svg{width:27px;height:27px;fill:currentColor;stroke:none}.day:disabled svg{opacity:.14}.day.has-record{color:var(--ink)}.day.selected{background:#b6917824}.day.selected .day-num{color:white;background:var(--brown)}.record-stats{margin:4px 0 16px;padding-bottom:8px}.record-stats .stat-number strong{font-size:35px}.record-stats .stat{padding-left:22px}.record-stats .stat:first-child{padding-left:0}.record-card{position:relative;background:rgba(255,253,251,.8);border-radius:17px;padding:16px 15px;cursor:pointer}.record-card h2{font-size:21px;padding-right:22px;font-weight:750;word-break:break-word}.record-meta{font-size:13px;color:#9a9289;margin-top:3px;display:flex;flex-wrap:wrap;gap:15px}.brew-metrics{display:flex;gap:14px;flex-wrap:wrap;margin:12px 0 8px;font-size:13px;font-weight:650}.brew-metrics span{display:flex;align-items:center;gap:4px}.brew-metrics svg{width:15px;height:18px}.rating{color:#e6b217;font-size:22px;letter-spacing:1px}.record-note{font-size:15px;color:#8f8982;line-height:1.6;margin:5px 0 0;white-space:pre-wrap;overflow-wrap:anywhere}.record-divider{border-top:1px solid var(--line);margin:0 -16px 15px}.backdrop{position:fixed;inset:0;background:#24150e48;z-index:50;display:flex;align-items:flex-end;justify-content:center;backdrop-filter:blur(3px)}.sheet{width:min(100%,480px);max-height:88dvh;overflow-y:auto;background:linear-gradient(140deg,#fff0e5,#fffaf5);border-radius:23px 23px 0 0;padding:18px 20px calc(24px + var(--safe));box-shadow:0 -10px 40px #4022101a}.sheet-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:17px}.sheet h2{font-size:20px}.sheet-head .icon-button{width:28px;height:30px}.sheet-head svg{width:22px;height:22px}.picker-bean{display:flex;justify-content:space-between;gap:12px;width:100%;text-align:left;background:#f0daca55;padding:15px;border-radius:12px;margin:9px 0}.picker-bean strong{display:block;font-size:17px}.picker-bean small{display:block;color:#9c7e67;margin-top:5px}.picker-bean .weight{color:#825124;white-space:nowrap;font-weight:650;font-size:14px}.sheet-option{display:flex;align-items:center;justify-content:space-between;padding:16px 8px;width:100%;border-bottom:1px solid var(--line);text-align:left;font-size:16px}.sheet-option.selected{color:var(--brown);font-weight:700}.danger-text{color:#b54838}.sheet .cancel{margin-top:12px;color:#8d7765;padding:14px;width:100%;font-weight:600}.calendar-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.calendar-head strong{font-size:18px}.calendar-head button{width:42px;height:38px;display:grid;place-items:center}.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:5px}.week-label{text-align:center;color:#b49b89;font-size:12px;padding:8px 0}.calendar-day{height:42px;border-radius:9px;color:#c0afa2;position:relative;font-size:15px}.calendar-day.has-record{color:#211a15;font-weight:700;background:#ecd4bf44}.calendar-day.has-record:after{content:'';position:absolute;bottom:5px;left:calc(50% - 2px);height:4px;width:4px;border-radius:50%;background:var(--brown)}.calendar-day.selected{background:var(--brown);color:white}.calendar-day.selected:after{background:white}.calendar-hint{color:#9c8471;font-size:12px;margin:18px 0 2px}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px 18px;padding:20px 0;border-top:1px solid var(--line);margin-top:18px}.detail-grid small{display:block;font-size:12px;color:#ab8a71;margin-bottom:5px}.detail-grid strong{font-size:17px;font-weight:600}.detail-note{white-space:pre-wrap;font-size:15px;line-height:1.7;color:#867362;padding:10px 0 20px;overflow-wrap:anywhere}.detail-actions{display:flex;gap:10px}.detail-actions button{border:1px solid #c7957040;background:#e7c7ae30;border-radius:12px;padding:13px;flex:1;font-weight:600}.photo-input{display:none}#toast{position:fixed;bottom:calc(103px + var(--safe));left:50%;transform:translate(-50%,16px);opacity:0;background:#3c241de8;color:white;padding:11px 18px;border-radius:11px;font-size:14px;z-index:100;transition:.2s;max-width:90vw;pointer-events:none;text-align:center}#toast.visible{opacity:1;transform:translate(-50%,0)}.env-empty{font-size:13px;color:#a28d7c;padding:18px 8px}.form-error{background:#ffe3dc;color:#ab4031;padding:11px 13px;border-radius:9px;margin:13px 0;font-size:13px}.storage-note{font-size:11px;text-align:center;color:#b5a393;margin-top:28px}.desktop-name{display:none}@keyframes appear{from{opacity:.6;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}
@media(min-width:700px){body{background:radial-gradient(ellipse at 30% 20%,#f4dccb,#eee7e0)}#app{box-shadow:0 0 80px #5c32131b;min-height:100dvh}.screen{padding-top:40px}.sub{padding-top:22px}}
@media(max-width:370px){.stat-number strong{font-size:29px}.stat{padding-left:13px}.stat p{font-size:15px}.form-row{font-size:15px}.form-row>input,.form-row>select{font-size:15px}.stars button{font-size:25px}.brew-metrics{gap:10px}.drink-tab{padding:8px 10px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;scroll-behavior:auto!important;transition:none!important}}
.nav button{flex:1}.record-add{display:flex;align-items:center;gap:5px;background:var(--brown);color:#fff;padding:10px 13px;border-radius:22px;font-size:14px;font-weight:650;white-space:nowrap;min-height:40px}.record-add svg{width:17px;height:17px}.record-tools{gap:6px}@media(max-width:370px){.record-add{padding:10px;font-size:13px}.record-tools{gap:4px}}
/* Keep the readable date separate from the native iOS picker, whose value can center itself. */
.date-control{position:relative;margin-left:auto;min-width:0;flex:1;display:flex;justify-content:flex-end;align-items:center;min-height:33px}.date-text{display:block;text-align:right;font-size:15px;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap;pointer-events:none}.date-control input{position:absolute;inset:0;width:100%;height:100%;border:0;margin:0;padding:0;opacity:0;cursor:pointer;min-width:0;color:transparent;background:transparent;font-size:16px;appearance:none;-webkit-appearance:none}.date-control:focus-within .date-text{outline:2px solid #a6663180;outline-offset:4px;border-radius:3px}
#warehouse-title{font:inherit;letter-spacing:inherit;padding:0;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;touch-action:pan-y;cursor:default}
.bean-heading{display:flex;gap:13px;align-items:flex-start;padding-right:24px}.bean-title-stack{flex:1;min-width:0;padding-top:1px}.bean-heading .card-title{margin-right:0}.bean-heading .badge{margin-top:5px;max-width:100%}.bean-heading .bean-photo{width:88px;height:88px;float:none;margin:0;flex-shrink:0;border-radius:12px}.bean-info{font-size:16px;margin-top:12px;line-height:1.55}.bean-card{min-height:140px}
.record-mode-caption{font-size:12px;color:#a58266;margin:0 2px 8px}.record-filters{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:6px 0 15px}.bean-record-filter{display:flex;align-items:center;gap:7px;min-width:0;max-width:75%;background:#ead3c155;padding:9px 11px;border-radius:11px;color:#835126;font-size:14px}.bean-record-filter>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.bean-record-filter svg{height:17px;width:17px}.bean-record-filter svg:last-child{height:13px;width:13px}.record-order{display:flex;align-items:center;gap:4px;font-size:12px;color:#9b775b;white-space:nowrap;padding:8px 0}.record-order svg{width:15px;height:15px}.overview-summary{display:flex;justify-content:space-between;gap:8px;color:#9c7b62;font-size:12px;padding:0 0 17px;flex-wrap:wrap}.option-description{display:block;color:#a38c79;font-size:12px;font-weight:400;margin-top:5px;line-height:1.5}
.backup-summary{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;background:#ecd4bf44;border-radius:14px;padding:18px}.backup-summary small{display:block;color:#a3876e;font-size:12px;margin-bottom:5px}.backup-summary strong{font-size:19px;font-weight:650}.transfer-help{font-size:14px;color:#92765f;line-height:1.8;margin:17px 0}.secondary{display:block;width:100%;min-height:49px;padding:12px;border-radius:24px;background:#ead3c144;border:1px solid #c69e7c44;color:#875024;font-size:16px;font-weight:600;margin-top:10px}.transfer-footnote{font-size:12px;color:#b29a86;text-align:center;margin:17px 0 0}
@media(max-width:370px){.bean-heading .bean-photo{width:80px;height:80px}.bean-heading{gap:10px}.bean-info{font-size:15px}.date-text{font-size:14px}}