/* Hakku: paper, ink and drawn ingredients. Existing cabinet geometry is retained. */
:root{--paper:#dfd7c7;--white:#eae2d4;--ink:#293e46;--muted:#535e57;--line:#bfb39f;--green:#304e59;--sage:#e5e8da;--ochre:#936638;--hakku-red:#a34b3d;--hakku-indigo:#293e46;font-family:'Segoe UI',Arial,sans-serif;background:var(--paper);color:var(--ink);color-scheme:light}
body{background:radial-gradient(ellipse at 90% 0,#c5b79a55,transparent 55%),var(--paper)}
body:before{opacity:.1;filter:saturate(.7);background-position:center bottom}
body:after{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.2;background-image:repeating-linear-gradient(0deg,#8069430a 0 1px,transparent 1px 4px)}
.shell{display:block;max-width:1440px;margin:auto}
.shell main{max-width:1280px;padding:32px clamp(20px,4.5vw,72px) 0}
.simple-header{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-bottom:23px;margin-bottom:25px;border-bottom:1px solid var(--line)}
.simple-header a.hakku-wordmark,.hakku-wordmark{display:inline-flex;align-items:center;gap:13px;text-decoration:none;font:normal 35px/1.1 Georgia,'Times New Roman',serif;letter-spacing:.04em;color:var(--ink)}
.hakku-seal{display:inline-grid;place-items:center;flex-shrink:0;width:32px;height:35px;border-radius:4px 3px 5px 2px;background:var(--hakku-red);color:#fff8e9;font:normal 24px/1 Georgia,serif;letter-spacing:0;box-shadow:inset 0 0 0 3px var(--hakku-red),inset 0 0 0 4px #f5e8cf9c;transform:rotate(-3deg)}
.simple-header>span{font-size:11px;letter-spacing:.09em;color:var(--muted)}
.main-tabs{display:block;margin:0 0 34px;border-bottom:1px solid var(--line)}
.section-tabs{display:flex;gap:clamp(14px,3vw,40px);align-items:stretch;border-bottom:1px solid var(--line)}
.section-tabs .secondary-button{position:relative;border:0;border-radius:0;background:transparent;color:var(--muted);padding:13px 0 17px;font-size:14px;white-space:nowrap;min-height:46px}
.section-tabs [aria-pressed=true]{color:var(--ink);background:transparent;font-weight:600}
.section-tabs [aria-pressed=true]:after{content:'';position:absolute;bottom:-1px;left:0;right:0;height:3px;background:var(--hakku-red)}
.section-tabs .secondary-button:hover{background:transparent;color:var(--hakku-red)}
.account-tools{display:flex;flex-wrap:wrap;align-items:center;gap:4px 16px;padding:12px 0}
.account-tools>.secondary-button{border:0;background:transparent;color:var(--muted);padding:7px 0;min-height:34px;font-size:12px;text-decoration:none}
.account-tools>.secondary-button:hover{color:var(--hakku-red);text-decoration:underline;text-underline-offset:4px}
.account-tools .profile-activity{margin-left:auto}
.account-tools .profile-name{font-size:12px}
.profile-notifications{font-size:12px;background:#e6ddcd;border-color:var(--line);border-radius:4px;padding:7px 10px}
.profile-notifications.has-unread{border-color:var(--hakku-red);background:#f7e8d9}
.notification-count{background:var(--hakku-red)}
.section-heading h1,#recipes-area>h1,.hub-title{font:normal clamp(30px,3vw,40px)/1.15 Georgia,serif;letter-spacing:-.025em;color:var(--ink)}
.section-heading{gap:16px;align-items:center}
.section-heading #result-count{color:var(--muted);font-size:12px}
.view-switch{background:#e9e2d3;border:1px solid #d8cebb;border-radius:4px;padding:3px;width:240px}
.view-switch .nav-button{border-radius:2px;min-height:38px}
.view-switch .selected{background:var(--white);color:var(--ink);box-shadow:0 1px 3px #293e4610}
.more-controls>summary{font-size:13px;min-height:34px;padding:8px 0;color:var(--muted)}
.primary-button{background:var(--green);color:#fffaf0;border:1px solid var(--green);border-radius:4px;box-shadow:0 2px 0 #172d3320;min-height:42px;padding:11px 17px;font-size:14px}
.primary-button:hover{background:#233e49;border-color:#233e49}
.secondary-button{background:#e6ddcd;border-color:var(--line);border-radius:4px;color:var(--ink)}
.secondary-button:hover{background:#e9e6d9;border-color:#a9ad9a}
.text-button{color:var(--green);text-underline-offset:4px}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid var(--hakku-red);outline-offset:4px}
input,textarea,select{background:var(--white);color:var(--ink);border-color:#b8b6a7;border-radius:3px;accent-color:var(--green)}
.login-panel,.edit-dialog,.recipe-card,.panel,.pro-sheet{background-color:var(--white);border:1px solid var(--line);border-radius:5px;box-shadow:0 5px 20px #55452c08}
.panel h2,.recipe-card h2,.edit-dialog h2{font-family:Georgia,serif;font-weight:400;color:var(--ink);letter-spacing:-.025em}
.edit-dialog{padding:28px;max-width:min(840px,calc(100vw - 32px));max-height:calc(100dvh - 40px);border-top:4px solid var(--hakku-red)}
.edit-dialog::backdrop{background:#24363f80;backdrop-filter:blur(3px)}
.edit-dialog .edit-form{background:transparent}
.place-heading{border-bottom:1px solid #bdb69f;padding-bottom:11px;margin-bottom:7px}
.place-heading h2{font:normal 22px/1.2 Georgia,serif;letter-spacing:-.02em}
.place-heading>span{background:transparent;border:1px solid var(--line);border-radius:3px;min-width:27px;font-size:12px;color:var(--muted)}
.cabinet .project-label>.project-name{color:#293e46}
.storage-grid{gap:28px}
.discovery{margin-top:36px;border-top:1px solid var(--line);padding-top:20px}
.discovery h2{font:normal 26px Georgia,serif}
footer{color:var(--muted);border-top:1px solid var(--line);font-size:11px;padding-top:16px;margin-top:34px}
.signed-out:before,.signed-out:after{display:none}
.signed-out .shell{max-width:none}
.signed-out #main{max-width:none;padding:0}
.auth-page{min-height:100dvh;grid-template-columns:minmax(0,1.1fr) minmax(380px,1fr);background:var(--white)}
.auth-visual{position:relative;isolation:isolate;overflow:hidden;min-height:760px;padding:48px clamp(32px,5vw,80px) 28px;background:#d4c9b3;color:var(--ink);border-right:1px solid var(--line);justify-content:flex-start}
.auth-visual:before{content:'';position:absolute;z-index:-1;width:340px;height:340px;border-radius:50%;right:-110px;bottom:80px;background:#bc766322}
.auth-visual:after{content:'';position:absolute;inset:0;z-index:-2;pointer-events:none;background:repeating-linear-gradient(90deg,transparent 0 calc(25% - 1px),#8a785d12 calc(25% - 1px) 25%)}
.auth-brand.hakku-wordmark{margin:0;font-size:42px;gap:15px}
.auth-brand .hakku-seal{width:36px;height:40px;font-size:28px}
.auth-copy{margin-top:72px;position:relative;z-index:1}
.auth-eyebrow{font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:#6b6b59;margin:0 0 18px}
.auth-visual h1{font:normal clamp(42px,4.6vw,68px)/1.06 Georgia,serif;letter-spacing:-.035em;max-width:520px;margin:0 0 18px;color:var(--ink)}
.auth-copy>p:last-child{font-size:15px;line-height:1.7;color:var(--muted);max-width:330px;margin:0}

.auth-card{width:min(100%,440px);padding:48px 32px;align-self:center}
.auth-card:before{content:'';display:block;width:35px;height:3px;background:var(--hakku-red);margin-bottom:27px}
.auth-card h2{font:normal 37px/1.15 Georgia,serif;letter-spacing:-.03em;color:var(--ink)}
.auth-card>p{line-height:1.7;margin-bottom:27px}
.auth-card input:not([type=checkbox]){border-radius:3px;background:#eee7da;border-color:#bdb9aa;min-height:48px}
.auth-card .edit-form{gap:16px}
.auth-card .auth-submit{margin-top:4px;min-height:49px;border-radius:3px}
.auth-card .text-button{color:var(--green);min-height:28px}
.auth-card a{text-underline-offset:4px;color:var(--green)}
.auth-card .auth-check{font-size:12px}
.auth-card input:focus-visible,.auth-card button:focus-visible{outline-color:var(--hakku-red)}
.legal-page{max-width:1000px;padding:32px clamp(20px,4.5vw,60px)}
.legal-page .panel{padding:clamp(22px,4vw,48px);line-height:1.75}
.legal-page h1{font:normal clamp(34px,5vw,48px)/1.15 Georgia,serif;letter-spacing:-.03em;margin:0 0 25px}
.legal-page h2{font-size:25px;margin-top:30px}
@media(min-width:1600px){.auth-visual{min-height:100dvh}}
@media(max-width:900px){.account-tools .profile-activity{flex:1 1 100%;margin:5px 0 0;max-width:none}.account-tools .profile-activity-row{justify-content:flex-start}.auth-visual{padding-inline:32px}.auth-copy{margin-top:60px}.auth-visual h1{font-size:46px}}
@media(max-width:760px){.auth-page{grid-template-columns:1fr;min-height:100dvh}.auth-visual{min-height:0;padding:26px 26px 29px;border-right:0;border-bottom:1px solid var(--line)}.auth-brand.hakku-wordmark{font-size:32px}.auth-brand .hakku-seal{width:28px;height:31px;font-size:22px}.auth-copy{margin-top:28px;padding-right:62px}.auth-eyebrow{display:none}.auth-visual h1{font-size:35px;max-width:340px;margin-bottom:0}.auth-copy>p:last-child{display:none}.auth-visual:before{width:160px;height:160px;bottom:-50px;right:-40px}.auth-card{padding:30px 26px 40px;width:min(100%,460px)}.auth-card:before{margin-bottom:20px;width:27px}.auth-card h2{font-size:32px}.auth-card>p{margin-bottom:23px}}
@media(max-width:600px){.shell main{padding:22px 18px 0}.simple-header{padding-bottom:18px;margin-bottom:15px}.simple-header a.hakku-wordmark{font-size:29px;gap:10px}.hakku-seal{width:27px;height:30px;font-size:22px}.simple-header>span{font-size:10px;letter-spacing:0}.section-tabs{gap:22px;overflow-x:auto;scrollbar-width:thin;padding:0 2px}.section-tabs .secondary-button{font-size:13px;flex-shrink:0;min-height:46px}.main-tabs{margin-bottom:26px}.account-tools{gap:2px 14px;padding-block:9px}.account-tools>.secondary-button{font-size:12px;min-height:34px}.section-heading h1{font-size:31px}.place-heading h2{font-size:21px}.edit-dialog{padding:20px;max-height:calc(100dvh - 24px)}.storage-grid{gap:24px}.section-heading>.primary-button{font-size:12px;padding:10px 12px}.profile-activity .profile-name{font-size:12px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
@media print{body{background:white}.main-tabs,.primary-button,.view-switch,.more-controls{display:none}.simple-header{border-color:#888}.shell main{padding:0}.panel,.recipe-card{box-shadow:none}}
@media(max-width:600px){.section-tabs{overflow-y:hidden;scrollbar-color:#aaa18e transparent}.section-tabs::-webkit-scrollbar{height:3px}.section-tabs::-webkit-scrollbar-thumb{background:#aaa18e;border-radius:3px}.account-tools .profile-activity{flex:0 1 auto;max-width:calc(100% - 65px);margin:4px 0}.account-tools>.secondary-button:last-child{margin-left:auto}.account-tools .profile-activity-row{gap:8px}.profile-notifications{padding:7px 8px}}
@media(max-width:760px){.auth-copy{padding-right:10px}}

/* Selected soy-brewery landscape: decorative watermark, separate from form content. */
.auth-page{position:relative;isolation:isolate;background:var(--paper)}
.auth-page:before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:url("illustrasjoner/hakku-soy-village.webp") center/cover no-repeat;opacity:.43}
.auth-visual{background:transparent;border-right:0}
.auth-visual:before{display:none}
.auth-visual:after{opacity:.3}
.auth-card{background:#eae2d4ed;border:1px solid #bfb39f;border-top:3px solid var(--hakku-red);border-radius:5px;box-shadow:0 12px 40px #293e4614;backdrop-filter:blur(4px);margin:36px 28px;width:min(calc(100% - 56px),440px)}
.auth-card:before{display:none}
@media(max-width:760px){.auth-page:before{background-position:35% center;opacity:.4}.auth-visual{min-height:220px;background:linear-gradient(180deg,#dfd7c7d9,#dfd7c74d);border-bottom:0}.auth-card{width:calc(100% - 32px);margin:0 16px 24px;padding:28px 24px}}

/* Clearer everyday reading across sign-in, navigation and forms. */
:root{--ink:#202e32;--muted:#3d4945;font-size:16px}
body{font-size:16px;line-height:1.5}
.section-tabs .secondary-button{font-size:16px}
.account-tools>.secondary-button,.account-tools .profile-name,.profile-activity .profile-name,.profile-notifications{font-size:14px}
.simple-header>span,.section-heading #result-count,.place-heading>span,footer{font-size:14px}
.view-switch .nav-button,.more-controls>summary,.primary-button,.secondary-button{font-size:15px}
.text-button,.auth-card .text-button,.auth-card a{color:var(--ink);font-size:15px}
.edit-form label,.recipe-controls label,.auth-card .auth-check{font-size:15px;color:var(--ink)}
.edit-form input:not([type=checkbox]):not([type=radio]),.edit-form select,.edit-form textarea{font-size:16px}
.edit-form legend,.edit-help,.card-meta,.tags,.type-pill{font-size:14px;color:var(--muted)}
.auth-eyebrow{font-size:13px;color:var(--muted)}
.auth-copy>p:last-child,.auth-card>p{font-size:16px;color:var(--muted)}
.cabinet .project-label>.project-name{font-size:14px;line-height:16px;max-height:32px;color:var(--ink)}
.cabinet .project-label{top:4px;gap:2px}
.cabinet .project-label .ferment-progress{font-size:12px;line-height:14px;color:var(--ink)}
.cabinet .unit-count{font-size:13px;line-height:17px;color:var(--ink)}
@media(max-width:600px){.section-heading{flex-wrap:wrap;gap:12px}.section-heading>.primary-button{font-size:15px}.section-tabs{gap:20px}.simple-header>span{font-size:12px}.account-tools{gap:4px 12px}}
.simple-header .hakko-logo{display:block;width:210px;height:auto;max-height:160px;object-fit:contain;object-position:left center}.auth-brand .hakko-logo{display:block;width:min(100%,380px);height:auto;max-height:280px;object-fit:contain;object-position:left top}.auth-brand.hakku-wordmark{display:block;width:100%}.auth-brand+.auth-copy{margin-top:32px}.simple-header{align-items:center}@media(max-width:760px){.auth-brand .hakko-logo{width:240px;max-height:175px}.auth-brand+.auth-copy{margin-top:20px}}@media(max-width:600px){.simple-header .hakko-logo{width:170px;max-height:125px}.simple-header{gap:16px}.simple-header>span{flex-shrink:0}}
/* Keep the signed-in logo beside the workspace rather than above it. */
.signed-in .simple-header{padding-bottom:12px;margin-bottom:12px}.signed-in .simple-header .hakko-logo{width:130px;max-height:70px}
@media(min-width:1100px){.signed-in>.shell{position:relative;max-width:1580px;padding-left:180px}.signed-in .shell main{max-width:1400px;padding:26px clamp(24px,3vw,48px) 0}.signed-in .simple-header{min-height:24px;justify-content:flex-end}.signed-in .simple-header .hakku-wordmark{position:absolute;left:12px;top:26px;width:160px}.signed-in .simple-header .hakko-logo{width:160px;max-height:none}}
@media(max-width:600px){.signed-in .simple-header .hakko-logo{width:110px;max-height:60px}.signed-in .simple-header{gap:12px;padding-bottom:8px;margin-bottom:8px}}