:root{--ink:#35231e;--wine:#702c46;--cream:#fff;--paper:#fff;--line:#e4e0de;--green:#e4ecd4;--gold:#95622e}*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font:17px/1.55 system-ui,sans-serif}a{color:var(--wine)}a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible{outline:3px solid #a75c31;outline-offset:3px}img{display:block;width:100%;height:auto}h1,h2,h3{font-family:Georgia,serif;line-height:1.12}h1{font-size:clamp(32px,4.2vw,61px);margin:.1em 0}h2{font-size:clamp(25px,3.3vw,40px);margin:.2em 0 .5em}h3{font-size:1.42rem}.hero span,.eyebrow{font-size:.78rem;letter-spacing:.14em;font-weight:800;color:var(--wine)}section.chapter{scroll-margin-top:12px;border-top:1px solid var(--line);padding:24px 0}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr));gap:14px}.card,details,.quiz,.player,.speech{background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:14px 18px;margin:8px 0;overflow-wrap:anywhere}.card img{border-radius:10px;aspect-ratio:1;object-fit:cover}.card p{margin:.45em 0}.speech{border-left:5px solid #ac6757}.speech.shop-role{border-left-color:#718155}.speech.active{background:var(--green);box-shadow:0 0 0 2px #718155}.tag{color:var(--wine);font-weight:800;font-size:.83rem}.fr{font-size:1.18em;font-weight:700}.muted{color:#705748}.pill{display:inline-block;background:#f5f4f4;border-radius:6px;padding:4px 8px;margin:3px}.button,button{display:inline-block;background:var(--wine);color:white;border:1px solid var(--wine);border-radius:8px;padding:.5rem .75rem;font:inherit;cursor:pointer;text-decoration:none;max-width:100%;margin:3px 1px}.secondary,button.secondary{background:var(--paper);color:var(--wine)}button[aria-pressed=true]{background:#465d37;color:white}input,select{font:inherit;max-width:100%;padding:.45em;border:1px solid #9e806b;border-radius:6px;background:#fff}input[type=text],input[type=search]{width:min(100%,37rem)}summary{cursor:pointer;font-weight:700}audio{width:100%}.feedback{display:block;margin:.55em 0;font-weight:600}.good{color:#3a6027}.wrong{color:#8a2940}.shop-panel{background:#f7f7f7;padding:1rem;border-radius:14px}.shop-panel li{margin:.3rem 0}footer{padding:1.4rem;background:#412921;color:#fff2df;text-align:center}footer a{color:#fff2df;margin-left:1em}mark{background:#f9e4a0;color:inherit;padding:0 .1em}table{border-collapse:collapse;width:100%}td,th{padding:.4rem;text-align:left;border-bottom:1px solid var(--line)}[hidden]{display:none!important}.quiz fieldset{border:0;padding:0;margin:0;min-width:0}.quiz label{display:block;margin:.25em 0}.chapter:nth-child(3n)>.eyebrow{color:#52653f}

.brand{position:relative;text-align:center;background:#fff}
.brand img{width:100%;height:auto}
.brand a{position:absolute;left:27%;top:67%;width:44%;height:13%}
.brand a:hover{box-shadow:inset 0 -2px #d5a548}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.voice{text-align:center;background:#fff;color:#8c5d19;padding:clamp(12px,2vw,26px) 12px}
.voice strong,.voice span{display:block;font-family:Georgia,serif;line-height:1.25}
.voice strong{font-size:clamp(16px,1.7vw,23px)}
.voice span{font-size:clamp(20px,2.45vw,34px);margin-top:.3rem;font-weight:700}

html{scroll-behavior:smooth}
main{margin:auto;padding:0 clamp(12px,2.5vw,40px) 36px}
.lesson-layout{display:grid;grid-template-columns:minmax(240px,17.5vw) minmax(0,1fr);gap:clamp(16px,2.5vw,36px);align-items:start}
.lesson-content{min-width:0}
.hero-photo{margin:0;position:relative;background:white;border-radius:12px;overflow:hidden}
.hero-photo img{width:100%;height:auto}
.hero-photo ol{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.3rem;text-align:center}
.hero-photo figcaption{padding:.5rem 0;border-bottom:1px solid var(--line)}
.hero-photo li{font-size:clamp(.72rem,1.15vw,1.08rem);line-height:1.15;padding:.35em .25em;background:#fff;color:#35231e;font-weight:700}
.hero-copy{padding:14px 0 8px}
.hero-copy p{margin:.35em 0}
.lesson-nav{position:sticky;top:12px;border:1px solid var(--line);border-radius:12px;background:#fff;max-height:calc(100dvh - 24px);overflow:auto}
.nav-title{margin:.7rem .75rem .35rem;font-weight:800}
#nav{margin:0;padding:0 .4rem .55rem;list-style:none}
#nav a{display:flex;gap:.55rem;align-items:baseline;border-radius:7px;padding:.43rem .5rem;font-size:.89rem;text-decoration:none}
#nav a:hover,#nav a[aria-current="location"]{background:#f3efef}
#nav a[aria-current="location"]{font-weight:750}
.nav-label small,#nav summary small{display:block;font-size:.8em;font-weight:400;color:#705748}
#nav a span{color:#705748;font-size:.72rem}
#nav details{border:0;margin:0 .4rem;padding:0 0 .25rem 1rem;font-size:.75rem}
#nav details ul{margin:0;padding:0;list-style:none}
#nav-toggle{display:none}
.card,.quiz:has(img){background:white}
.card img,.quiz img{aspect-ratio:1;object-fit:contain}
.shop-grid .card{display:flex;flex-direction:column;margin:0}
.shop-grid .card h3{margin:.5em 0 .2em}
.product-controls{margin-top:auto}
.product-controls input{width:4.5rem}
.product-controls label,.product-controls button{display:block}
.price{font-weight:700}
.price small{font-weight:400}
#intro,#anatomy-part-0,#anatomy-part-1,#shop-part-0,#ingredients{scroll-margin-top:70px}

@media(max-width:900px){
  .lesson-layout{display:block}
  .lesson-nav{top:0;z-index:2;max-height:72dvh;margin-bottom:10px}
  .nav-title{display:none}
  #nav-toggle{display:block;width:calc(100% - 12px);margin:6px;text-align:left}
  #nav-toggle[aria-expanded="false"]~#nav{display:none}
  #nav a{min-height:42px}
  section.chapter{scroll-margin-top:65px}
}
@media(max-width:470px){
  .hero-photo ol{grid-template-columns:repeat(2,minmax(0,1fr));overflow-wrap:anywhere}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

#words .card,#showcase .card{text-align:center;background:#fff}
#words .card img,#showcase .card img{margin:0 auto .75rem;background:#fff}
#words .card h3,#showcase .card h3{margin:.5em 0 .25em}
#transcript .speech p{margin:.2em 0}
.transcript-ru{color:#644f48}

.hero-image{position:relative}
.hero-markers{position:absolute;inset:0;pointer-events:none}
.hero-markers span{position:absolute;transform:translate(-50%,-50%);display:grid;place-items:center;width:clamp(1rem,2.4vw,1.8rem);aspect-ratio:1;border:1px solid #f5df9c;border-radius:50%;background:#382319;color:white;font:700 clamp(.6rem,1.3vw,.9rem)/1 system-ui}
.hero-photo ol{counter-reset:dessert}
.hero-photo li::before{counter-increment:dessert;content:counter(dessert) " · ";color:#80552d}
.object-grid .card,.verb-grid .card{text-align:center}
.object-grid img{aspect-ratio:1;object-fit:contain}
.verb-grid .card{display:flex;flex-direction:column;align-items:center}
.verb-grid .card img{object-fit:cover;aspect-ratio:4/3}
.verb-grid h3,.object-grid h3,.expression-grid h3{margin:.65rem 0 .35rem}
.verb-grid .card button{margin-top:auto}
.expression-example{border-top:1px solid var(--line);margin-top:1em;padding-top:.45em}
#verb-dialog{width:min(1100px,calc(100% - 24px));max-height:calc(100dvh - 24px);margin:auto;padding:0;border:1px solid #b79359;border-radius:18px;color:var(--ink);background:#fff;overscroll-behavior:contain}
#verb-dialog::backdrop{background:rgb(37 24 29 / .72)}
.plate-toolbar{position:sticky;top:0;display:flex;justify-content:flex-end;gap:.5rem;padding:.5rem clamp(10px,2vw,22px);background:#fff;border-bottom:1px solid #e3d2b0;z-index:1}
.plate-header{display:grid;grid-template-columns:1fr 1fr;background:#2f2936;color:#fff5dd;align-items:center}
.plate-header img{height:100%;max-height:330px;min-height:150px;object-fit:cover}
.plate-heading{padding:1rem clamp(12px,4vw,48px);overflow-wrap:anywhere}
.plate-heading h2{color:#f7db98;font-size:clamp(2rem,7vw,5rem);font-style:italic;margin:0}
.plate-heading p{margin:.45rem 0}
.plate-heading p:first-child{font-size:.67rem;letter-spacing:.15em;font-weight:700}
.plate-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(10px,2vw,20px);padding:clamp(12px,3vw,32px);background:linear-gradient(130deg,#fffdf6,#fff 60%)}
.verb-panel{min-width:0;border:1px solid #dec8a3;border-radius:10px;padding:clamp(10px,2vw,21px);background:white;overflow-wrap:anywhere}
.verb-panel h3{color:#762e47;margin:.15em 0 .5em}
.verb-panel:nth-child(3){grid-column:1/-1}
.plate-examples{columns:2;column-gap:2rem;margin:.6rem 0;padding-inline-start:1.3rem}
.plate-examples li{break-inside:avoid;margin:0 0 .75em}
.example-ru{display:block;color:#614e49}
.plate-large .plate-grid{font-size:1.25em;grid-template-columns:1fr}
.plate-large .plate-examples{columns:1}
#dessert-words,#actions,#shop-vocabulary,#verb-practice{scroll-margin-top:70px}
@media(max-width:640px){.plate-grid{grid-template-columns:1fr}.plate-examples{columns:1}}
@media(max-width:900px){
  .lesson-nav{overflow:visible}
  #nav-toggle[aria-expanded="true"]~#nav{
    position:absolute;inset-block-start:100%;inset-inline-start:0;width:min(24rem,100%);
    max-height:calc(90dvh - 55px);overflow:auto;background:#fff;border:1px solid var(--line);
    border-radius:0 0 12px 12px;box-shadow:0 14px 24px #38231936;
  }
}
