:root{--ivory:#fbf6ea;--ink:#1c2230;--navy:#111a2c;--gold:#b88a3d;--gold-soft:#d9b873;--line:#d8c69d;--line-soft:#eee2c7;--muted:#7a7264;--white:#fffdf8;--danger:#9b4a3a;--serif:"Shippori Mincho", "Zen Old Mincho", serif;--sans:"Zen Kaku Gothic New", system-ui, sans-serif;--display:"Playfair Display", Georgia, serif;--figure:"Inter", "Zen Kaku Gothic New", system-ui, sans-serif;--radius:8px;--radius-sm:4px;--shadow:0 18px 38px #111a2c14;--shadow-soft:0 6px 16px #111a2c0f;--maxw:1140px}*,:before,:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{background:var(--ivory);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;margin:0;font-size:15px;line-height:1.7}button{font:inherit;cursor:pointer}input,select,textarea{font:inherit;color:inherit}.wrap{max-width:var(--maxw);flex-direction:column;min-height:100vh;margin:0 auto;display:flex}.hero{text-align:center;border-bottom:1px solid var(--line);padding:30px 18px 18px}.hero__brand{justify-content:center;align-items:center;gap:16px;display:flex}.hero__logo{flex-shrink:0;width:auto;height:clamp(64px,16vw,100px);display:block}.hero__title{min-width:0;font-family:var(--display);letter-spacing:.005em;color:var(--ink);text-align:left;margin:0;font-size:clamp(34px,9.5vw,60px);font-weight:700;line-height:.98}.hero__lead{max-width:620px;color:var(--muted);margin:14px auto 0;font-size:14px;line-height:1.85}.toolbar{z-index:20;background:color-mix(in srgb, var(--ivory) 88%, transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--line-soft);flex-wrap:wrap;justify-content:center;gap:8px;padding:12px 14px;display:flex;position:sticky;top:0}.toolbar__btn{border:1px solid var(--line);background:var(--white);min-height:42px;color:var(--ink);border-radius:var(--radius-sm);align-items:center;gap:6px;padding:0 16px;font-weight:700;transition:background .15s,color .15s,border-color .15s,transform 50ms;display:inline-flex}.toolbar__btn:hover{border-color:var(--gold);color:var(--gold)}.toolbar__btn:active{transform:translateY(1px)}.toolbar__btn--primary{background:var(--navy);color:#fff;border-color:var(--navy)}.toolbar__btn--primary:hover{color:#fff;background:#1b2740}main{flex:1;gap:14px;padding:16px 14px 36px;display:grid}.card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}.card__head{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:12px;padding:16px;display:flex}.card__title{font-family:var(--sans);letter-spacing:.02em;margin:0;font-size:20px;font-weight:700}.card__tag{color:var(--gold);white-space:nowrap;font-size:12px;font-weight:700}.card__body{padding:16px}.field-label{color:var(--muted);letter-spacing:.04em;margin-bottom:5px;font-size:12px;font-weight:700;display:block}.input{border:1px solid var(--line);border-radius:var(--radius-sm);background:#fff;width:100%;min-height:44px;padding:10px 12px;font-weight:600;transition:border-color .15s,box-shadow .15s}.input:focus{border-color:var(--gold);box-shadow:0 0 0 3px color-mix(in srgb, var(--gold) 18%, transparent);outline:none}textarea.input{resize:vertical;min-height:96px;font-weight:500;line-height:1.8}.base{grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px;display:grid}.ing-head{border-bottom:1px solid var(--line);color:var(--muted);letter-spacing:.04em;grid-template-columns:1fr 70px 84px 30px;gap:8px;padding:0 0 6px;font-size:11px;font-weight:700;display:grid}.ing-head span:nth-child(2),.ing-head span:nth-child(3){text-align:right}.ing{border-bottom:1px solid var(--line-soft);grid-template-columns:1fr 70px 84px 30px;align-items:center;gap:8px;padding:9px 0;display:grid}.ing__main{min-width:0}.ing__name{border-radius:var(--radius-sm);background:0 0;border:1px solid #0000;width:100%;min-height:38px;padding:4px 6px;font-weight:700}.ing__name:focus{border-color:var(--gold);background:#fff;outline:none}.ing__name::placeholder{color:#b9b1a1;font-weight:500}.ing__kind{color:var(--muted);padding:0 6px;font-size:11px;font-weight:700;display:block}.ing__num{border:1px solid var(--line);border-radius:var(--radius-sm);text-align:right;width:100%;min-height:38px;font-family:var(--figure);font-variant-numeric:tabular-nums;background:#fff;padding:6px 8px;font-weight:600}.ing__num:focus{border-color:var(--gold);box-shadow:0 0 0 3px color-mix(in srgb, var(--gold) 16%, transparent);outline:none}.ing__del{border:1px solid var(--line);width:30px;height:30px;color:var(--muted);background:#fff;border-radius:50%;place-items:center;line-height:1;transition:color .15s,border-color .15s;display:grid}.ing__del:hover{color:var(--danger);border-color:var(--danger)}.ing-add{grid-template-columns:1fr auto;gap:8px;margin-top:12px;display:grid}.ing-add select{min-height:42px}.ing-add__btn{border:1px dashed var(--gold);border-radius:var(--radius-sm);background:color-mix(in srgb, var(--gold) 8%, #fff);min-height:42px;color:var(--gold);padding:0 16px;font-weight:700}.ing-add__btn:hover{background:color-mix(in srgb, var(--gold) 16%, #fff)}.btns{grid-template-columns:1fr 1fr;gap:8px;margin-top:14px;display:grid}.btns button{border-radius:var(--radius-sm);background:var(--navy);color:#fff;letter-spacing:.02em;border:0;min-height:48px;font-weight:700;transition:background .15s,transform 50ms}.btns button:hover{background:#1b2740}.btns button:active{transform:translateY(1px)}.btns button.is-ghost{color:var(--navy);border:1px solid var(--navy);background:0 0}.btns button.is-ghost:hover{background:color-mix(in srgb, var(--navy) 6%, #fff)}.sum{grid-template-columns:1fr 1fr;gap:8px;margin-top:12px;display:grid}.sum>div{border:1px solid var(--line);border-radius:var(--radius-sm);padding:14px}.sum span{color:var(--muted);letter-spacing:.06em;font-size:11px;font-weight:700;display:block}.sum strong{font-family:var(--figure);letter-spacing:-.01em;font-variant-numeric:tabular-nums;font-size:32px;font-weight:700;line-height:1.05;display:block}.sum small{color:var(--muted);font-size:12px;font-weight:600}.dims{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.answer{background:var(--navy);color:#fff;border-radius:var(--radius-sm);grid-template-columns:1fr auto;align-items:end;gap:8px;margin-top:14px;padding:18px;display:grid}.answer__meta span{color:var(--gold-soft);font-size:11px;font-weight:700;display:block}.answer__meta small{color:#cfd6e4;font-size:12px}.answer__value{font-family:var(--figure);letter-spacing:-.02em;color:#f3d690;font-variant-numeric:tabular-nums;font-size:52px;font-weight:700;line-height:.95}.answer__unit{color:var(--gold-soft);align-self:end;padding-bottom:6px;font-size:12px;font-weight:700}.hint{color:var(--muted);margin:10px 2px 0;font-size:12px}.footer{text-align:center;border-top:1px solid var(--line-soft);color:var(--muted);letter-spacing:.06em;padding:24px 16px 32px;font-size:11px}.footer__sns{border:1px solid var(--line);width:44px;height:44px;color:var(--muted);border-radius:50%;justify-content:center;align-items:center;margin-bottom:12px;transition:color .15s,border-color .15s,background .15s,transform 50ms;display:inline-flex}.footer__sns:hover{color:var(--gold);border-color:var(--gold);background:color-mix(in srgb, var(--gold) 8%, transparent)}.footer__sns:active{transform:translateY(1px)}.footer__copy{margin:0}.modal-overlay{z-index:50;background:#111a2c6b;place-items:center;padding:18px;display:grid;position:fixed;inset:0}.modal{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);width:100%;max-width:460px;max-height:86vh;box-shadow:var(--shadow);overflow:auto}.modal__head{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;padding:16px;display:flex}.modal__title{font-family:var(--serif);margin:0;font-size:20px;font-weight:700}.modal__close{color:var(--muted);background:0 0;border:0;font-size:24px;line-height:1}.modal__body{padding:12px 16px 18px}.saved{border-bottom:1px solid var(--line-soft);justify-content:space-between;align-items:center;gap:10px;padding:12px 4px;display:flex}.saved__name{font-weight:700}.saved__date{color:var(--muted);font-size:11px}.saved__actions{flex-shrink:0;gap:6px;display:flex}.saved__btn{border:1px solid var(--line);border-radius:var(--radius-sm);background:#fff;min-height:38px;padding:0 12px;font-size:13px;font-weight:700}.saved__btn--load{background:var(--navy);color:#fff;border-color:var(--navy)}.saved__btn--del:hover{color:var(--danger);border-color:var(--danger)}.saved-empty{color:var(--muted);text-align:center;padding:24px 0}.toast-wrap{z-index:80;pointer-events:none;flex-direction:column;align-items:center;gap:8px;display:flex;position:fixed;bottom:24px;left:50%;transform:translate(-50%)}.toast{background:var(--navy);color:#fff;box-shadow:var(--shadow);border:1px solid color-mix(in srgb, var(--gold) 40%, transparent);border-radius:999px;padding:12px 20px;font-size:14px;font-weight:700;animation:.25s toast-in}@keyframes toast-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.guide{padding:0 14px 28px}.guide summary{cursor:pointer;font-family:var(--serif);color:var(--gold);font-weight:700;list-style:none}.guide summary::-webkit-details-marker{display:none}.guide__content{border:1px solid var(--line);border-radius:var(--radius);background:var(--white);margin-top:12px;padding:16px;font-size:13px;line-height:1.9}.guide__content h3{font-family:var(--serif);margin:12px 0 4px;font-size:15px}.guide__content h3:first-child{margin-top:0}.guide__content ol,.guide__content ul{color:var(--ink);margin:0;padding-left:1.3em}@media (width>=850px){.hero{padding:50px 28px 26px}main{grid-template-columns:1.25fr .85fr;align-items:start;padding:22px 28px 48px}.calc-card{grid-row:span 2}.memo-card,.guide{grid-column:1/-1}.guide{padding:0 28px 36px}}@media print{@page{size:A4 portrait;margin:14mm 13mm 15mm}html,body{background:#fff!important}body{color:#000;-webkit-print-color-adjust:exact;print-color-adjust:exact;font-size:10.5pt}.wrap{max-width:100%;min-height:0;margin:0;padding:0;display:block}.toolbar,.ing-add,.btns,.ing__del,.modal-overlay,.toast-wrap,.guide,.footer__sns,.no-print{display:none!important}.hero{text-align:left;border-bottom:1.5pt solid #000;margin-bottom:5mm;padding:0 0 5mm}.hero__brand{justify-content:flex-start;gap:3mm}.hero__logo{height:16mm}.hero__title{color:#000;font-size:26pt;line-height:1}.hero__lead{color:#333;max-width:100%;margin-top:3mm;font-size:8.5pt}main{gap:0;padding:0;display:block}.card{break-inside:auto;border:.75pt solid #888;border-radius:3pt;margin-bottom:5mm;box-shadow:none!important;background:#fff!important}.vol-card,.memo-card{break-inside:avoid}.card__head{break-inside:avoid;break-after:avoid;border-bottom:.75pt solid #888;padding:3mm 4mm}.card__title{font-size:12pt}.card__tag{color:#555}.card__body{padding:3mm 4mm}.input{-webkit-text-fill-color:#000;min-height:0;padding:.5mm 0;box-shadow:none!important;color:#000!important;background:0 0!important;border:0!important}select.input{appearance:none}#recipe-name{font-size:13pt;font-weight:700}.field-label{color:#555}.base{margin-bottom:4mm}.ing-head,.ing{grid-template-columns:1fr 18mm 22mm;gap:3mm}.ing-head{border-color:#000}.ing-head span:nth-child(4){display:none}.ing{break-inside:avoid;border-bottom:.5pt solid #ccc;padding:1.5mm 0}.ing__name,.ing__num{-webkit-text-fill-color:#000;padding:0;box-shadow:none!important;color:#000!important;background:0 0!important;border:0!important}.ing__kind{color:#777}.sum{break-inside:avoid;margin-top:4mm}.sum>div{border:.75pt solid #000}.sum strong,.sum span,.sum small{color:#000}.answer{break-inside:avoid;border:1pt solid #000;color:#000!important;background:#fff!important}.answer__meta span,.answer__meta small,.answer__unit,.answer__value{color:#000!important}.hint{color:#555}textarea.input{height:auto;min-height:0;overflow:visible}.footer{color:#555;text-align:left;border-top:.75pt solid #888;margin-top:4mm;padding:3mm 0 0}}