/* Garden study: a shared visual system for students and teachers. */
:root{--green:#235c46;--green-deep:#184533;--deep:#184533;--ink:#243f34;--ink-2:#506257;--muted:#778277;--line:#e8e3d5;--line-strong:#d9d3bf;--paper-3:#fffdf8;--shadow:0 5px 18px rgba(68,65,38,.055);--r-card:18px}
html{background:#f6f4eb}
body{padding:16px 24px;background:radial-gradient(ellipse at 12% 10%,#e9eedf66,transparent 45%),#f7f5ee}
.app-shell{max-width:1512px;border-radius:24px;background:#fcfbf6;box-shadow:0 16px 60px #4d573c10}
.app-shell::before,.app-shell::after{display:none}
.brandbar{padding:14px 28px;background:#fcfbf6;border-color:#e3dece}
.app-main{grid-template-columns:224px minmax(0,1fr)}
.side{position:relative;isolation:isolate;padding:24px 16px;background:linear-gradient(#f0f3e8c9,#f9f9f0);overflow:hidden}
.side::after{content:"";position:absolute;inset:190px -100px 0 -60px;background:url('assets/deco-br.webp') bottom left/440px auto no-repeat;opacity:.55;z-index:-1;pointer-events:none}
.side .nav{gap:10px;position:sticky;top:24px}
.side .nav button{min-height:50px;border-radius:12px;padding:12px 18px;gap:16px;font-size:15px;font-weight:600}
.side .nav button.active{background:linear-gradient(120deg,#326e50,#1e503c);box-shadow:inset 0 1px 0 #ffffff30,0 5px 12px #25513a19}
.nav-icon{width:22px;height:22px;display:block;stroke:currentColor;fill:none;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}
.side .side-art{height:140px;margin-top:280px;border:0;background-size:cover;opacity:.72;mask-image:linear-gradient(transparent,#000 30%,#000 75%,transparent)}
.side .sidefoot,.side .side-quote{background:#fcfbf699;border-radius:10px;padding:12px;font-size:11px}
.workspace{padding:20px 28px 24px}
.workspace main{max-width:1160px;padding-bottom:45px}
.crumb{margin-bottom:14px;color:#6a7970;letter-spacing:.12em}
h1,h2,h3{color:var(--ink);font-family:var(--serif);font-weight:650}
.eyebrow{font-size:10px;letter-spacing:.32em;color:#4a7b5e}
.home-hero{min-height:290px;grid-template-columns:minmax(0,1.5fr) minmax(220px,.8fr);padding:28px 40px;border:1px solid #e4e6d7;border-radius:20px;isolation:isolate;background:linear-gradient(90deg,#f7f7ed 15%,#f0f4e5 65%,#dde8ce)}
.home-hero::before{content:"";position:absolute;inset:0;background:url('assets/deco-tl.webp') 85% -120px/420px no-repeat,url('assets/deco-br.webp') right bottom/430px no-repeat;opacity:.7;z-index:-1;pointer-events:none}
.home-hero::after{width:300px;height:300px;right:16px;bottom:-45px;border:9px solid #c1ccb37a;outline:1px solid #a6b79855;background:linear-gradient(135deg,#fafff955,#d3e0c855);z-index:-1}
.home-copy h1{font-size:clamp(27px,2.8vw,38px);line-height:1.45;margin-top:14px;letter-spacing:.03em}
.home-copy p{font-size:13px;max-width:570px;line-height:1.85}
.home-actions{margin-top:22px}
.home-ling{align-self:end;margin:-25px -10px -29px 0}
.home-ling picture{width:218px;max-height:320px}
.home-ling img{height:320px;object-fit:contain;object-position:bottom}
.home-meta{display:none}
.study-strip{display:grid;grid-template-columns:1.3fr repeat(3,1fr);gap:16px;align-items:center;margin:18px 0 6px;padding:20px 24px;background:#fffdf7;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow)}
.study-strip>a{color:var(--green);text-decoration:none;font-family:var(--serif);font-size:18px;font-weight:650}
.study-metric{border-left:1px solid var(--line);padding-left:20px;display:grid;gap:4px}
.study-metric strong{font-size:18px;font-family:var(--serif);color:var(--green)}
.study-metric span{font-size:12px;color:var(--muted)}
.sectionhead{margin:24px 0 12px;gap:12px}
.sectionhead h2{font-size:22px;display:flex;align-items:center;gap:16px}
.sectionhead h2::after{content:"";width:40px;height:1px;background:#ccc4ab}
.card,.q,.entry{background:#fffdf8;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow)}
.card{padding:24px}
.continue-card{flex-wrap:nowrap;gap:22px;background:#fffdf8;padding:16px 20px}
.continue-art{flex:0 0 180px;height:116px;border-radius:13px;background:url('assets/art-plum.jpg') center/cover}
.cc-main{min-width:0}.cc-main h2{font-size:24px}.cc-main .badge{font-size:10px}
.continue-progress{flex:0 0 150px;font-size:12px;color:var(--muted)}
.continue-progress progress{width:100%;margin-top:9px}
.cards{gap:18px}
.course.card{padding:0;overflow:hidden;box-shadow:0 4px 14px #41462808}
.courseart{height:115px;background-position:center 40%}
.coursebody{padding:20px}.coursebody h3{font-size:22px}.py-inline{font-family:inherit;font-size:11px;letter-spacing:.04em}
.coursebody .muted{line-height:1.75}.coursebody .meta{font-size:11px}
.btn{min-height:44px;border-radius:12px;padding:11px 20px;font-size:14px;box-shadow:inset 0 1px 0 #ffffff22,0 3px 8px #28513c12;transition:background .18s,box-shadow .18s,transform .18s}
.btn:not(.alt):not(.outline){background:linear-gradient(135deg,#347252,#20543d);border:1px solid #285d43}
.btn.alt,.btn.outline{background:#fcfbf4;border:1px solid #dad7c5;color:var(--green);box-shadow:0 2px 4px #56563805}
.btn:active{transform:translateY(1px)}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #7b9b67;outline-offset:3px}
.badge,.chip{border-radius:999px}.badge{background:#edf1e4;color:#456246;border:1px solid #e3e7d7}
.badge.warm{background:#faf0da;color:#886523;border-color:#eee0bc}
.page-title,.s-hero{position:relative;isolation:isolate;border:1px solid var(--line);border-radius:18px;padding:26px 30px;margin-bottom:22px;background:linear-gradient(105deg,#fbfaf2,#f2f5e9);overflow:hidden}
.page-title::after,.s-hero::after{content:"";position:absolute;inset:0 0 0 auto;width:210px;background:url('assets/deco-tl.webp') right center/240px no-repeat;opacity:.32;z-index:-1;pointer-events:none}
.page-title h1,.s-hero h1{font-size:clamp(24px,2.6vw,32px);line-height:1.5}
.page-title p,.s-hero .lede{font-size:13px;line-height:1.85;max-width:760px;color:var(--ink-2)}
.toolbar{gap:12px;margin:20px 0}.searchbar,.search{background:#fffef9;border-color:var(--line-strong);border-radius:13px;box-shadow:0 3px 10px #37432905}
input,select,textarea{background:#fffefa;border:1px solid #dedfce;border-radius:10px;color:var(--ink);min-height:44px;padding:11px 13px;font-size:14px;max-width:100%}
textarea{line-height:1.8;min-height:110px}
.form-grid label,.form-inline label{color:#4c6251;line-height:1.7;gap:8px}
.tabs{padding:5px;background:#f0f2e7;border:1px solid #e5e8da;border-radius:12px;gap:4px}
.tabs button{border-radius:8px;min-height:40px}.tabs button.active{background:#fffdf8;box-shadow:0 2px 6px #344c3610;color:var(--green)}
.stats{gap:14px}.stats .card{position:relative;overflow:hidden;padding:22px}.stats strong{font-family:var(--serif);color:var(--green);font-size:30px}.stats .card::after{content:"";position:absolute;width:64px;height:64px;border-radius:50%;right:-20px;top:-22px;background:#eaf0df}
.class-card{margin-bottom:20px}.class-code{background:#edf2e4;border:1px dashed #b7c6a8;padding:10px 16px;border-radius:10px}
.table-scroll{border:1px solid var(--line);border-radius:12px;box-shadow:none}th{background:#f3f4e9;color:#61725f;font-size:12px}th,td{padding:14px 16px}tbody tr:hover{background:#f7f8ef}tr:last-child td{border-bottom:0}
.details summary{min-height:44px;padding:12px;color:var(--green);border-radius:8px;background:#f5f6ec}.details[open] summary{margin-bottom:16px}
.test-level{background:linear-gradient(145deg,#fffef9,#f2f5e8);position:relative;overflow:hidden}.test-level .level-mark{color:#9caf85;opacity:.7}.test-level p{line-height:1.9}
.lesson-head{padding:20px 0}.lesson-body{line-height:1.9}.lesson-body .quote,.one-line{background:#f7f2e3;border-color:#e9dfc5}.kv-block{border-color:var(--line)}.kv-row:nth-child(even){background:#f8f9f1}
.side-note,.guide{background:#f1f5e8;border:1px solid #dfe6d2;border-radius:16px}.sticky{top:20px}
.quiz-wrap{max-width:840px}.choice,.opt{border-radius:12px;border-color:#dfe3d1;background:#fffef9}.quiz-top{padding:14px 0}.result-top{background:linear-gradient(#f0f5e7,#fffdf8)}
.answer-item{border-radius:14px;background:#f3f6eb;border-color:#e1e7d4}.answer-item.wrong{background:#fcf5e7;border-color:#ecdfc2}
.post{border-radius:18px}.post h3{font-size:21px}.post-body{color:#43594a}.reply{background:#f8f9f1;padding:14px;border-radius:10px;margin-top:10px}.post-meta{gap:10px}
.quick .q{padding:22px;transition:border-color .18s,transform .18s}.quick .q .ico2{background:#ecf1e2;border-radius:10px;color:var(--green);width:38px;height:38px;display:grid;place-items:center}.quick .q strong{font-family:var(--serif);font-size:18px}
.empty{padding:36px 22px;background:#fafbf4;border:1px dashed #dbe2cf;border-radius:16px}.empty h3{font-size:21px}.empty p{max-width:520px;margin:10px auto;line-height:1.8}.ling-empty{opacity:.9}
.auth-art{background:linear-gradient(135deg,#eff3e6,#f9f8ed);position:relative}.auth-art .auth-figure{justify-content:center;min-height:310px}.auth-figure .ling-body-img{width:230px}.auth-pane{background:#fcfbf5}.authbox{background:#fffdf8;border:1px solid var(--line);padding:30px;border-radius:22px;box-shadow:var(--shadow)}
.app-shell>.ling-fab,.app-shell>.ling-panel{position:fixed}
@media(hover:hover){.course:hover,.quick .q:hover{transform:translateY(-3px);box-shadow:0 8px 22px #3d542414;border-color:#cbd7b9}.btn:hover{box-shadow:0 5px 12px #28513c20}}
@media(min-width:981px){.side .nav{z-index:2}}
@media(max-width:1180px){.app-main{grid-template-columns:196px minmax(0,1fr)}.workspace{padding:18px 22px}.continue-art{flex-basis:130px}.continue-progress{flex-basis:110px}.home-hero{padding:26px}.home-copy h1{font-size:30px}}
@media(max-width:980px){.app-main{grid-template-columns:1fr}.side{display:none}.workspace{padding:18px 20px 100px}.home-hero{grid-template-columns:minmax(0,1fr) 210px}.brandbar{padding:12px 18px}.bb-sep{display:none}}
/* Match the sidebar breakpoint so tablets never lose all navigation. */
@media(min-width:701px) and (max-width:980px){.app-shell>nav.mobile{display:flex;position:fixed;inset:auto 0 0;z-index:100;background:#fffdf8fa;border-top:1px solid var(--line);padding:8px 16px calc(8px + env(safe-area-inset-bottom));justify-content:space-around}.mobile button{display:flex;flex:1;align-items:center;justify-content:center;gap:8px;min-height:48px;border:0;border-radius:10px;background:none;color:var(--ink-2)}.mobile button.active{background:#eaf1df;color:var(--green)}.app-shell>.ling-fab{bottom:88px}.app-shell>.ling-panel{bottom:164px}}
@media(max-width:700px){body{padding:0}.app-shell{border:0;border-radius:0;min-height:100dvh}.brandbar{padding:12px 16px}.brandbar .brand{font-size:17px}.brandbar .brandicon{width:34px;height:34px}.bb-right{gap:8px}.chip-user{display:none}.workspace{padding:14px 16px calc(96px + env(safe-area-inset-bottom))}.workspace main{padding-bottom:18px}.home-hero{min-height:265px;padding:24px 20px;grid-template-columns:minmax(0,1fr) 110px;gap:0}.home-copy h1{font-size:26px}.home-copy p{font-size:12px;max-width:230px}.home-ling{margin:0 -15px -24px -20px;pointer-events:none}.home-ling picture{width:145px}.home-ling img{height:225px;max-width:145px}.home-hero::after{width:180px;height:180px;right:-65px}.home-actions{gap:8px;position:relative;z-index:2}.home-actions .btn{font-size:12px;padding:10px 12px}.study-strip{grid-template-columns:repeat(3,1fr);gap:8px;padding:16px 12px}.study-strip>a{grid-column:1/-1;font-size:16px;margin-bottom:7px}.study-metric{padding-left:10px}.study-metric strong{font-size:16px}.study-metric span{font-size:11px}.sectionhead h2{font-size:20px}.sectionhead .small{font-size:10px}.continue-card{display:grid;grid-template-columns:78px minmax(0,1fr);gap:12px;padding:14px}.continue-art{width:78px;height:100%;min-height:100px;grid-row:span 2}.continue-card .cc-main{min-width:0}.continue-card h2{font-size:21px}.continue-card p{font-size:12px}.continue-card .meta{font-size:10px;flex-wrap:wrap}.continue-progress{display:none}.cc-act{grid-column:2}.cc-act .btn{width:100%;min-height:40px}.course.card{display:grid;grid-template-columns:90px minmax(0,1fr)}.courseart{height:100%;min-height:180px;border-radius:0}.courseart .tag{font-size:9px;left:7px;right:7px;top:12px;padding:5px;white-space:normal;max-width:100%}.coursebody{padding:16px}.coursebody h3{font-size:20px}.card{padding:18px}.page-title,.s-hero{padding:22px 20px}.page-title h1,.s-hero h1{font-size:24px}.page-title::after{width:100px;opacity:.15}.form-inline label{min-width:100%}.stats .card{padding:17px}.stats strong{font-size:26px}.quick .q{padding:18px}.lesson-head{padding-top:8px}.authbox{padding:22px}.auth-art .auth-figure{display:flex;min-height:230px}.auth-figure .ling-body-img{width:155px}.auth-figure .ling-bubble{left:55%;bottom:90px;font-size:11px}.app-shell>nav.mobile{position:fixed;z-index:100;box-shadow:0 -4px 16px #2e51300b}.mobile button .ico{font-size:19px}.mobile button.active{background:#eaf1e2}.nav-icon{width:21px;height:21px}.site-footer{flex-direction:column;gap:6px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Rebuilt composition: explicit image sizing, normal-flow dialogue, one scene. */
.auth{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,1fr);min-height:100svh;background:#faf9f2}
.auth .auth-art{display:grid;grid-template-rows:auto auto minmax(360px,1fr) auto;gap:24px;padding:48px clamp(28px,5vw,90px) 28px;min-height:100svh;background:linear-gradient(140deg,#f2f4e7,#faf9ef)}
.auth-art>div:not(.auth-figure){max-width:580px}
.auth-art h1{font-size:clamp(28px,3vw,42px);line-height:1.4;margin-top:10px}
.auth-art>div>p{max-width:480px;font-size:14px;line-height:1.85}
.auth .auth-art .auth-figure{display:grid;grid-template-columns:minmax(200px,1fr) minmax(140px,.65fr);align-items:center;justify-content:center;gap:12px;position:relative;isolation:isolate;min-height:360px;padding:0;flex:none}
.auth-figure::before{content:"";position:absolute;inset:0 -30px -10px;background:linear-gradient(90deg,#f5f5e988,transparent),url('assets/garden-window.svg') center/cover;border-radius:50% 50% 18px 18px;z-index:-1;opacity:.65}
.auth .auth-figure .ling-body-img{display:block;position:relative;width:100%;height:clamp(340px,43vh,470px);max-width:320px;justify-self:center;animation:lingBreathe 7s ease-in-out infinite}
.auth .auth-figure .ling-body-img img{display:block;width:100%;height:100%;object-fit:contain;object-position:center bottom}
.auth .auth-figure .ling-bubble{position:static;inset:auto;align-self:start;margin:64px 0 0;max-width:210px;padding:16px;font-size:14px;background:#fffdf6;border-radius:16px;line-height:1.9}
.auth .auth-figure .ling-bubble::after{display:none}
.auth .auth-pane{padding:40px clamp(24px,4vw,70px);display:flex;align-items:center;justify-content:center}
.auth .authbox{width:100%;max-width:460px;padding:32px;box-sizing:border-box}
.auth .authbox h2{font-size:32px;line-height:1.4;margin:24px 0 10px;word-break:normal}
.authbox>.help:last-child{font-size:11px;line-height:1.75}
.home-hero{min-height:272px;grid-template-columns:minmax(0,1.4fr) minmax(220px,.9fr);padding:26px 36px;background:#eff3e3;isolation:isolate}
.home-hero::before{inset:0;opacity:1;background:linear-gradient(90deg,#f7f7ed 0%,#f7f7edf5 30%,#f4f5e699 52%,transparent 72%),url('assets/garden-window.svg') right center/auto 120% no-repeat}
.home-hero::after{display:none}
.home-ling{margin:-14px 0 -26px;align-self:end;justify-content:center}
.home-ling picture{width:230px;height:284px;max-height:none}
.home-ling img{display:block;width:100%;height:100%;object-fit:contain}
.side::after{mix-blend-mode:multiply;opacity:.78;inset:180px -85px 0 -80px;background-size:420px}
.study-strip{grid-template-columns:1.15fr 86px repeat(3,1fr);padding:16px 20px;gap:16px}
.goal-ring{width:76px;height:76px;border-radius:50%;background:conic-gradient(#41865b var(--goal-angle),#e7eada 0);display:grid;place-items:center}
.goal-ring>div{width:62px;height:62px;background:#fffdf7;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center}
.goal-ring strong{font:600 19px var(--serif);color:var(--green)}.goal-ring span{font-size:10px;color:var(--muted)}
.continue-card{padding:12px 16px;gap:20px;min-height:132px}.continue-art{height:104px;flex-basis:180px;background:url('assets/garden-window.svg') 45% 20%/cover}.continue-card .cc-main h2{font-size:23px}.continue-card .cc-main .meta{font-size:11px}.continue-card .cc-main p{font-size:12px;margin-top:5px}.continue-card .cc-act .btn{min-height:42px}
#view[data-route="home"]>.cards .course{position:relative;min-height:170px;background:#fffdf8}
#view[data-route="home"]>.cards .courseart{position:absolute;inset:0 0 0 auto;width:46%;height:100%;opacity:.6;mask-image:linear-gradient(90deg,transparent,#000);pointer-events:none}
#view[data-route="home"]>.cards .courseart .tag{display:none}
#view[data-route="home"]>.cards .coursebody{position:relative;z-index:1;padding:20px}
#view[data-route="home"]>.cards .coursebody h3{font-size:21px}
#view[data-route="home"]>.cards .coursebody .py-inline{display:none}
#view[data-route="home"]>.cards .coursebody p{min-height:0;font-size:12px;max-width:85%}
#view[data-route="home"]>.cards .coursebody .small-gap{margin-top:10px}
#view[data-route="home"]>.cards .coursebody .btn{width:auto;font-size:11px;min-height:32px;padding:5px 12px}
@media(min-width:1181px){.workspace{padding:16px 26px}.home-copy h1{font-size:34px}.home-copy p{font-size:12px}.sectionhead{margin:20px 0 10px}.side{padding-top:22px}}
@media(max-width:1100px){.auth .auth-art{padding:30px;gap:20px}.auth .auth-art .auth-figure{grid-template-columns:1fr;gap:0}.auth .auth-figure .ling-body-img{height:350px}.auth .auth-figure .ling-bubble{margin:8px 0 0;justify-self:center;max-width:300px;align-self:auto}.study-strip{grid-template-columns:1fr 76px repeat(3,1fr);gap:10px}.study-metric{padding-left:12px}}
@media(max-width:700px){.auth{grid-template-columns:1fr}.auth .auth-art{min-height:auto;grid-template-rows:auto auto auto;padding:24px 22px;gap:16px}.auth-art h1{font-size:28px}.auth-art>span{display:none}.auth .auth-art .auth-figure{min-height:220px;grid-template-columns:minmax(120px,1fr) minmax(120px,1fr);gap:12px}.auth .auth-figure .ling-body-img{height:240px;width:160px;max-width:100%}.auth .auth-figure .ling-bubble{margin:0;align-self:center;font-size:12px}.auth .auth-pane{padding:20px 18px 36px}.auth .authbox{padding:24px;max-width:480px}.auth .authbox h2{font-size:28px}.home-hero{grid-template-columns:minmax(0,1fr) 110px;min-height:260px;padding:22px 18px}.home-hero::before{background:linear-gradient(90deg,#f6f7eb 0%,#f6f7ebe0 45%,transparent),url('assets/garden-window.svg') right/auto 100% no-repeat}.home-ling{margin:0 -10px -22px -18px}.home-ling picture{width:138px;height:215px}.home-copy h1{font-size:25px}.home-copy p{font-size:12px}.study-strip{grid-template-columns:76px repeat(3,1fr);padding:14px 10px;gap:6px}.study-strip>a{grid-column:1/-1}.study-metric{padding-left:6px}.study-metric strong{font-size:14px}.study-metric span{font-size:10px}.goal-ring{width:64px;height:64px}.goal-ring>div{width:52px;height:52px}.continue-art{height:100%;width:78px}.continue-card{padding:14px;gap:12px}#view[data-route="home"]>.cards .course{display:block;min-height:166px}#view[data-route="home"]>.cards .coursebody{padding:18px}}