*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#f4f0e7;color:#302b25;font:16px/1.8 Arial,"Microsoft YaHei",sans-serif}a{color:inherit;text-underline-offset:5px}header,main,footer{max-width:1240px;margin:auto;padding:25px 36px}header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #d8d0c1}.brand{font-weight:bold;letter-spacing:2px;font-size:23px;text-decoration:none}nav{display:flex;gap:27px;font-size:13px}nav a{text-decoration:none}.hero{display:grid;grid-template-columns:1.05fr 1fr;gap:65px;align-items:center;padding:55px 0 60px}.eyebrow{color:#986446;letter-spacing:3px;font-size:11px}h1{font-size:66px;line-height:1.15;letter-spacing:-2px;font-weight:500;margin:26px 0}h1 em{font-style:normal;color:#a15b3a}p{color:#746a5d}.button,button{font:inherit;cursor:pointer;display:inline-block;background:#352f27;color:#fff8e9;border:1px solid #352f27;border-radius:2px;padding:12px 22px;text-decoration:none}.outline{background:transparent;color:#352f27}.hero img{width:100%;height:auto}.caption{font-size:11px;color:#8a7b69;letter-spacing:2px}.band{display:flex;justify-content:space-between;border-block:1px solid #d8d0c1;padding:18px 0;font-size:12px;letter-spacing:2px}.section{padding:48px 0}h2{font-size:32px;font-weight:500;line-height:1.4;margin:10px 0}h3{font-weight:500}.section-title{display:flex;justify-content:space-between;align-items:end}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:25px;margin:28px 0}.card{text-decoration:none;border-bottom:1px solid #c9beac;padding-bottom:20px;transition:transform .2s}.card:hover{transform:translateY(-4px)}.card img{width:100%;height:auto;display:block}.card h3{font-size:23px;margin:13px 0 5px}.card p{font-size:13px}.tag{font-size:11px;color:#946141;letter-spacing:1px}.filters{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}.filters button{font-size:12px;background:transparent;color:#625544;border-color:#cec3b2;padding:8px 17px}.filters button.active{background:#352f27;color:#fff8e9}.tools{display:grid;grid-template-columns:1fr 1fr;gap:40px;background:#e7dfd0;padding:35px}.tools h2{font-size:27px}label{display:inline-block;font-size:13px;margin:8px 12px 8px 0}input,select{display:block;border:1px solid #bdb09b;background:#faf8f2;padding:10px;font:inherit;max-width:100%}input{width:110px}.result{font-size:35px;color:#9c5736;margin:10px 0}.article{max-width:800px;margin:30px auto}.article h1{font-size:45px}.article h2{margin-top:38px;font-size:28px}.meta{font-size:12px;color:#8a7a65}.params{display:flex;gap:25px;flex-wrap:wrap;padding:22px 0;border-block:1px solid #d1c6b3}.params strong{display:block;color:#302b25}.params span{font-size:12px;color:#83715d}figure{margin:25px 0}figure img{width:100%;height:auto}figcaption{font-size:12px;color:#8a7a65}li{margin:16px 0}table{border-collapse:collapse;width:100%;margin:22px 0}td,th{padding:14px 8px;text-align:left;border-bottom:1px solid #d4c9b7}th{font-size:13px}details{padding:18px 0;border-bottom:1px solid #d4c9b7}summary{cursor:pointer}footer{border-top:1px solid #cfc3b0;font-size:12px}footer a{margin-right:22px}.skip{position:absolute;left:-9999px}.skip:focus{left:12px;background:white}a:focus-visible,button:focus-visible{outline:3px solid #b65d31;outline-offset:4px}[hidden]{display:none!important}@media(max-width:720px){header,main,footer{padding:20px}header{align-items:start;flex-direction:column;gap:15px}nav{gap:18px;flex-wrap:wrap}.hero,.tools{grid-template-columns:1fr;gap:25px}.hero{padding:30px 0}.grid{grid-template-columns:1fr 1fr;gap:16px}h1{font-size:43px}.article h1{font-size:35px}.band{font-size:10px;gap:10px}.section-title{display:block}.tools{padding:22px}.card h3{font-size:20px}td{font-size:13px}}@media(max-width:440px){.grid{grid-template-columns:1fr}}@media print{header,footer,button{display:none}}
body{font-family:Arial,Helvetica,sans-serif}.brand{font-size:20px;letter-spacing:1px}.hero{gap:50px}.hero h1{font-size:62px}.hero img{height:520px;object-fit:cover;object-position:center 60%;border-radius:3px}.card{padding:0 0 22px;background:#ebe4d7;overflow:hidden}.card>p,.card>h3,.card>span{margin-left:18px;margin-right:18px}.photo-panel{position:relative;width:100%;overflow:hidden;background:#e5dbc9}.photo-panel img{position:absolute!important;width:200%!important;height:200%!important;max-width:none!important;object-fit:fill!important}.card figure{margin:0 0 20px}.article .step-photo{margin:22px 0}.article li{padding-bottom:18px}.brewing-tip{background:#e9e1d3;border-left:3px solid #a36c48;padding:14px 18px;margin:15px 0}.brewing-tip strong{font-size:12px;letter-spacing:1px;color:#845034}.brewing-tip p{margin:6px 0;color:#62513f;font-size:15px}.brew-notes{margin-top:40px;padding:25px;background:#e9e1d3;border-radius:4px}.brew-notes label{display:block;font-weight:bold}.brew-notes textarea{display:block;width:100%;padding:15px;border:1px solid #bcae97;background:#fffdf7;color:#302b25;font:inherit;line-height:1.8;resize:vertical}.brew-notes textarea:focus{outline:2px solid #a36c48;outline-offset:2px}.notes-actions{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-top:12px}#note-status{font-size:12px;color:#65513a}figcaption{font-size:12px}.article h1{overflow-wrap:anywhere}.article p{line-height:1.9}.table-wrap{overflow-x:auto}@media(max-width:720px){.hero h1{font-size:44px}.hero img{height:400px}.brand{font-size:20px}nav{font-size:12px;gap:14px}.tools{padding:22px}.article h1{font-size:36px}}@media print{.brew-notes{display:none}}
