@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;500;600;700;800;900&family=Noto+Serif+KR:wght@500;600;700;900&family=Yuji+Boku&display=swap');
:root{color-scheme:light;--paper:#f7f5f0;--panel:#fffefa;--ink:#192b3d;--muted:#707771;--line:#d9d7ce;--accent:#a52c35;--blue:#35688e;--serif:'Noto Serif KR',serif}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:14px 'Noto Sans KR',sans-serif}button,input,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;border:0;color:inherit}button:hover:not(:disabled){filter:brightness(.93)}button:disabled{cursor:not-allowed;opacity:.45}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid var(--blue);outline-offset:4px}[hidden]{display:none!important}a{color:inherit}h1,h2,h3,p{margin-top:0}.topbar{min-height:88px;margin:0 4%;border-bottom:2px solid var(--ink);display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{display:flex;align-items:center;gap:13px;text-decoration:none;letter-spacing:1.5px;font-size:23px;font-weight:900}.brand-icon{display:grid;place-items:center;width:36px;height:40px;border:2px solid var(--accent);color:var(--accent);font-family:var(--serif);font-size:18px;letter-spacing:-2px;transform:rotate(-3deg)}.beta{font-size:9px;letter-spacing:1px;font-weight:500;border-left:1px solid var(--line);padding-left:14px;color:var(--muted)}.top-note{font-family:var(--serif);font-size:12px;letter-spacing:1px;color:var(--muted)}.header-actions{display:flex;align-items:center;gap:20px}.quiet{background:transparent;font-size:12px;padding:9px 0}.xp-pill{background:var(--ink);color:white;font-size:11px;padding:9px 12px;font-weight:700}main{max-width:1450px;margin:auto;padding:0 4%}.dojo-hero{display:grid;grid-template-columns:1fr 1.05fr .4fr;align-items:center;min-height:435px;border-bottom:1px solid var(--line);gap:20px}.hero-copy{padding:34px 0}.eyebrow{font-size:10px;letter-spacing:2px;color:var(--accent);font-weight:700}.hero-copy h1{font-family:var(--serif);font-size:clamp(50px,6.2vw,86px);line-height:1.02;letter-spacing:-4px;font-weight:900;margin:23px 0}.hero-copy h1 em{font-style:normal;color:var(--accent)}.title-seal{font-size:14px;letter-spacing:4px;writing-mode:vertical-rl;line-height:1.5;display:inline-block;border:2px solid var(--accent);padding:9px 3px;color:var(--accent);margin-left:24px;transform:rotate(-5deg)}.hero-copy p{font-size:12px;line-height:2;color:#626c71;margin-bottom:24px}.primary{display:inline-flex;gap:26px;align-items:center;justify-content:center;padding:13px 20px;background:var(--accent);color:white;font-size:12px;font-weight:600;border-radius:2px}.primary span{margin-left:auto}.outline{background:transparent;border:1px solid var(--line);padding:12px 17px;font-size:12px;margin-top:15px}.gi-art{position:relative;min-width:0;display:grid;place-items:center;height:380px}.gi-art svg{position:relative;z-index:1;width:100%;height:100%;transform:rotate(-7deg);filter:drop-shadow(8px 14px 5px #18263212)}.art-ring{position:absolute;aspect-ratio:1;width:75%;border:1px solid #b1b9bb;border-radius:50%;background:repeating-linear-gradient(0deg,transparent,transparent 9px,#192b3d05 10px)}.art-ring:before{content:'';position:absolute;inset:20px;border:1px solid #b1b9bb55;border-radius:50%}.art-index{position:absolute;right:0;top:37px;font-family:var(--serif);font-size:50px;line-height:1.15;color:#192b3d0f}.art-caption{position:absolute;bottom:15px;font-size:8px;letter-spacing:2px;color:#76818a}.hero-stats{border-left:1px solid var(--line);padding-left:28px;display:grid;gap:10px;align-self:center}.hero-stats>span{font-size:10px;color:var(--muted)}.hero-stats>strong{font-family:var(--serif);font-size:42px;font-weight:500}.hero-stats>strong span{font:10px 'Noto Sans KR',sans-serif;color:var(--muted)}.hero-stats>strong.camera-stat{font:12px 'Noto Sans KR',sans-serif}.tiny-line{width:28px;height:1px;background:var(--accent);margin:16px 0}.chapter-heading{display:flex;align-items:center;justify-content:space-between;margin:28px 0 17px;gap:12px}.chapter-heading h2{font-family:var(--serif);font-weight:700;font-size:18px;margin:0;letter-spacing:-.5px}.chapter-heading>span{font-size:9px;letter-spacing:1.4px;color:var(--muted)}.chapter-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:17px}.chapter{text-align:left;padding:23px;border:1px solid var(--line);border-top:4px solid var(--ink);background:#eeece5;display:grid;gap:20px;min-width:0;transition:transform .2s}.chapter:hover{transform:translateY(-3px)}.chapter-top{display:flex;justify-content:space-between;font-size:9px;letter-spacing:1.1px;color:#777f80}.chapter-top>span{letter-spacing:0;color:var(--muted)}.chapter-name{font-family:var(--serif);font-size:28px;font-weight:700;display:flex;align-items:center;justify-content:space-between}.chapter-name i{font:22px sans-serif;font-style:normal;font-weight:300}.chapter-description{font-size:11px;color:var(--muted);margin-top:-9px}.chapter-bottom{border-top:1px solid #d5d6cf;padding-top:13px;display:flex;justify-content:space-between;font-size:9px;letter-spacing:1px}.chapter-bottom>span{letter-spacing:0;color:var(--muted)}.chapter.featured{background:var(--ink);color:#f8f7f2;border-top-color:var(--accent)}.chapter.featured .chapter-top,.chapter.featured .chapter-description,.chapter.featured .chapter-bottom>span{color:#c1cad0}.chapter.featured .chapter-top>span{background:var(--accent);color:white;padding:3px 7px;margin-top:-3px}.chapter.featured .chapter-bottom{border-color:#506071}.chapter.selected{outline:2px solid var(--accent);outline-offset:3px}.course-shelf{scroll-margin-top:22px}.course-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:17px}.lesson-card{background:var(--panel);padding:22px;border:1px solid var(--line)}.lesson-top{display:flex;justify-content:space-between;align-items:center;font:18px var(--serif);color:var(--accent)}.tag{font:9px 'Noto Sans KR',sans-serif;letter-spacing:.2px;border:1px solid var(--line);padding:4px 7px;color:var(--muted)}.lesson-symbol{height:95px;display:grid;place-items:center;font:38px var(--serif);letter-spacing:10px;color:var(--ink);background:repeating-linear-gradient(90deg,transparent,transparent 23px,#192b3d04 24px);margin:15px 0}.lesson-card>small{font-size:9px;letter-spacing:1.2px;color:var(--muted)}.lesson-card h3{font-family:var(--serif);font-size:21px;margin:6px 0 12px}.lesson-card p{font-size:11px;line-height:1.8;color:var(--muted);min-height:40px}.lesson-enter{width:100%;padding:12px 0;border-top:1px solid var(--line);text-align:left;font-size:11px;background:transparent;color:var(--accent);font-weight:700}.coming-panel{grid-column:1/-1;padding:35px;background:#eeece5;border:1px solid var(--line)}.coming-panel>span{font-size:9px;letter-spacing:1px;color:var(--muted)}.coming-panel h3{font-family:var(--serif);font-size:23px;margin:14px 0}.coming-panel p{font-size:12px;color:var(--muted)}.journey{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-top:28px;padding:20px 0;gap:25px}.journey-label{display:flex;gap:14px;align-items:center}.journey-icon{font-size:23px;color:var(--accent)}.journey h2{font-size:13px;margin-bottom:6px}.journey p{font-size:10px;color:var(--muted);margin:0}.journey-progress{width:30%}.journey-progress>div:first-child{display:flex;justify-content:space-between;font-size:10px}.journey-progress strong{color:var(--accent)}.journey-stamp{font:12px var(--serif);color:var(--accent);border:1px solid var(--accent);padding:10px 14px;transform:rotate(-2deg)}footer{display:flex;justify-content:space-between;font-size:9px;letter-spacing:1px;color:var(--muted);padding:25px 0}
.heading{display:flex;justify-content:space-between;align-items:center;padding-top:35px;gap:15px}.heading h1{font:700 32px var(--serif);margin:10px 0}.heading p{font-size:12px;color:var(--muted);margin:0}.session-label{display:grid;gap:8px;border-left:1px solid var(--line);padding-left:22px;font-size:11px}.session-label>span:last-child{color:var(--muted);font-size:10px}.tiny{font-size:9px;letter-spacing:1px;color:var(--muted)}.practice-context{border-left:3px solid var(--accent);padding:11px 14px;background:#a52c3507;font-size:11px;line-height:1.7;color:#765158;margin:20px 0}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:18px}.studio{background:var(--panel);border:1px solid var(--line);align-self:start}.studio-bar{display:flex;justify-content:space-between;padding:14px 17px;font-size:10px;color:var(--muted)}.studio-bar>span:first-child{display:flex;align-items:center;gap:7px}#status-dot{width:6px;height:6px;border-radius:50%;background:#999}#status-dot.active{background:var(--accent)}.viewport{position:relative;aspect-ratio:16/10;overflow:hidden;background:radial-gradient(ellipse at center,#283b50,#172535);color:#f6f4ef}#video,#overlay{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}#overlay{z-index:2}.stage-grid{position:absolute;inset:0;background-image:linear-gradient(#ffffff04 1px,transparent 1px),linear-gradient(90deg,#ffffff04 1px,transparent 1px);background-size:40px 40px;pointer-events:none}.stage-top,.stage-bottom{position:absolute;left:18px;right:18px;z-index:3;display:flex;justify-content:space-between;align-items:center;font-size:9px;gap:10px;pointer-events:none}.stage-top{top:18px;color:#c7d4df}.live-pill{padding:7px 9px;border:1px solid #ffffff35;background:#132031b3;letter-spacing:1px}.stage-bottom{bottom:15px}.stage-bottom>span,.legend{background:#172535d9;padding:6px 8px}.legend{display:flex;gap:12px;white-space:nowrap}.legend span{display:flex;gap:5px;align-items:center}.legend i{height:6px;width:6px;border-radius:50%;display:inline-block}.target-dot{background:#f2a06b}.user-dot{background:#80baff}.welcome{position:absolute;inset:0;z-index:4;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center}.camera-icon{width:60px;height:60px;border:1px solid #b6c2cd66;display:grid;place-items:center;margin-bottom:18px}.camera-icon svg{width:35px;stroke:#f2a06b;stroke-width:1.5}.welcome h2{font:600 22px var(--serif);margin-bottom:12px}.welcome p{font-size:11px;line-height:1.9;color:#b7c3cd;margin-bottom:23px}.demo-link{background:none;color:#d8e1e8;font-size:11px;margin-top:15px}.permission-note{font-size:9px;color:#849bad;margin-top:13px}.transport{display:flex;justify-content:space-between;align-items:center;padding:14px;border-bottom:1px solid var(--line);gap:10px}.transport>div{display:flex;gap:10px;align-items:center}.small{padding:10px 14px;font-size:11px;gap:16px}.icon-button{width:33px;height:33px;border:1px solid var(--line);background:transparent;font-size:21px}.transport #timer{font-size:11px;font-variant-numeric:tabular-nums;color:var(--muted)}.toggle{display:flex;align-items:center;gap:6px;font-size:10px;cursor:pointer;position:relative}.toggle input{position:absolute;opacity:0;z-index:1;width:28px;height:18px;cursor:pointer}.toggle>span{width:27px;height:16px;border-radius:9px;background:#bbb;position:relative}.toggle>span:before{content:'';width:10px;height:10px;background:white;border-radius:50%;position:absolute;top:3px;left:3px}.toggle input:checked+span{background:var(--blue)}.toggle input:checked+span:before{transform:translateX(11px)}.toggle input:focus-visible+span{outline:2px solid var(--blue);outline-offset:3px}.notice{font-size:10px;line-height:1.8;padding:12px 15px;color:var(--muted)}.notice.error{color:var(--accent)}.retry-tracking{margin:0 15px 13px;color:var(--accent)}.panel{display:flex;flex-direction:column;gap:15px}.target-panel,.score-panel{border:1px solid var(--line);background:var(--panel);padding:18px}.section-title{display:flex;align-items:center;justify-content:space-between;gap:9px}.section-title h2{font-size:12px;font-weight:600;margin:0}.section-title>span{font-size:9px;color:var(--muted)}#step-label{color:var(--accent)}.target-preview{height:160px;position:relative;margin:10px 0 14px;background:#f0eee7}.target-preview canvas{height:100%;width:100%;object-fit:contain}.target-preview>span{position:absolute;bottom:0;left:50%;transform:translateX(-50%);font-size:8px;background:var(--ink);color:white;padding:4px 7px;white-space:nowrap}.target-name{display:flex;align-items:center;gap:8px}.target-name>span:first-child{font:12px var(--serif);color:var(--accent)}.target-name h3{font:600 18px var(--serif);margin:0}.level{font-size:8px;color:var(--muted);margin-left:auto}.target-panel p{font-size:11px;line-height:1.9;color:var(--muted);margin:10px 0 15px;min-height:40px}.hold-row{display:flex;justify-content:space-between;font-size:9px;color:var(--muted)}.hold-row strong{font-weight:500;color:var(--ink);font-variant-numeric:tabular-nums}.progress{height:4px;background:#dddcd4;margin:10px 0}.progress>div{height:100%;width:0;background:var(--accent);transition:width .1s}.step-controls{display:flex;justify-content:space-between;align-items:center}.step-controls>span{font-size:8px;color:var(--muted)}.step-controls button{font-size:10px}.badge{background:#ebe9e2;padding:3px 6px;font-size:9px}.score-main{display:flex;align-items:center;gap:9px;margin:13px 0}.score-main>strong{font-family:var(--serif);font-size:50px;font-weight:600;line-height:1.1}.score-main>span{font-size:14px;color:var(--muted)}.score-main small{display:block;font:9px 'Noto Sans KR',sans-serif;margin-top:5px}.spark{width:43px;margin-left:auto;fill:none;stroke:var(--accent);stroke-width:2}.metrics{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line);padding-top:12px;gap:15px}.metrics>div{display:flex;justify-content:space-between;font-size:10px;color:var(--muted)}.metrics strong{font-size:11px;color:var(--ink)}.score-panel p{font-size:10px;line-height:1.8;color:var(--muted);margin:12px 0 0}.routine{margin-top:25px}.routine h2 span{font-size:9px;margin-left:9px;font-weight:400;color:var(--muted)}.pose-list{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:14px}.pose-card{display:flex;align-items:center;gap:13px;border:1px solid var(--line);padding:12px;text-align:left;background:var(--panel)}.pose-card.selected{border-color:var(--accent);box-shadow:inset 3px 0 var(--accent);background:#a52c3505}.pose-card canvas{width:65px;height:53px}.card-copy{display:grid;gap:5px}.card-copy small{font-size:8px;letter-spacing:1px;color:var(--accent)}.card-copy strong{font-size:12px;font-weight:600}.card-copy>span{font-size:9px;color:var(--muted)}.completion{margin-left:auto;color:var(--accent)}.countdown{position:absolute;inset:0;display:grid;place-items:center;color:#f2a06b;font-size:85px;font-family:var(--serif);z-index:5;text-shadow:0 3px 25px #000}
dialog{background:var(--paper);color:var(--ink);border:1px solid var(--line);padding:35px;max-width:580px;max-height:90vh;overflow:auto;width:calc(100% - 32px)}dialog::backdrop{background:#142235b8;backdrop-filter:blur(4px)}dialog h2{font:700 27px var(--serif);margin:13px 0 8px}dialog p,dialog ol{font-size:12px;line-height:1.9;color:var(--muted)}dialog ol{padding-left:20px}.close{position:absolute;right:12px;top:12px}.roman{font-size:10px;letter-spacing:1px}.grip-diagram{border:1px solid var(--line);padding:20px;text-align:center;background:#eeece5;margin:18px 0}.grip-diagram>div{display:flex;align-items:center;justify-content:center;gap:25px;font:50px var(--serif);color:var(--accent)}.grip-diagram b{font-size:27px;font-weight:400;color:var(--ink)}.grip-diagram strong{display:block;margin:12px 0 7px;font-size:12px}.grip-diagram small{font-size:9px;color:var(--muted)}.source-link{color:var(--blue);font-size:11px;text-underline-offset:3px}.quiz-block{margin-top:22px;padding-top:20px;border-top:1px solid var(--line)}.quiz-block h3{font-size:14px;margin:10px 0}#quiz-choices{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.quiz-choice{background:transparent;border:1px solid var(--line);padding:12px 4px;font-size:10px}.quiz-choice.correct{border-color:var(--blue);background:#35688e15}.quiz-choice.incorrect{border-color:var(--accent);background:#a52c3510}#quiz-feedback{min-height:24px;font-size:10px;margin:10px 0 18px}.lesson-limit{font-size:10px;margin:15px 0 0}.result-medal{color:var(--accent);font-size:55px;text-align:center;margin:12px}.result-medal+div{text-align:center}#result-dialog{text-align:center}#result-dialog .outline{margin-left:10px}
@media(min-width:1450px){.viewport{aspect-ratio:16/9}}@media(max-width:1050px){.top-note,.beta{display:none}.dojo-hero{grid-template-columns:1fr 1fr}.hero-stats{display:none}.chapter-name{font-size:24px}.chapter-description{font-size:10px}.workspace{grid-template-columns:minmax(0,1fr) 270px}.viewport{aspect-ratio:4/3}.pose-card{gap:5px;padding:9px}.pose-card canvas{width:45px}.stage-bottom{font-size:8px;left:10px;right:10px}.journey-stamp{display:none}.journey-progress{width:40%}}@media(max-width:760px){.topbar{min-height:70px}.brand{font-size:17px;gap:8px}.header-actions{gap:12px}.quiet{font-size:10px}.xp-pill{font-size:9px;padding:7px}.dojo-hero{min-height:310px;gap:0}.hero-copy h1{font-size:52px;letter-spacing:-3px}.hero-copy p{font-size:10px}.gi-art{height:270px}.art-caption,.art-index{display:none}.title-seal{display:none}.primary{font-size:10px;padding:12px;gap:12px}.chapter-grid,.course-grid{grid-template-columns:1fr}.chapter{gap:14px;padding:20px}.chapter-name{font-size:25px}.chapter-description{font-size:11px}.chapter-heading>span{font-size:8px}.chapter-heading h2{font-size:16px}.lesson-symbol{height:65px}.lesson-card p{min-height:0}.journey-progress{width:35%}.journey p{font-size:8px}.journey h2{font-size:11px}.journey-progress>div:first-child{font-size:8px}.journey-label{gap:8px}.workspace{grid-template-columns:1fr}.panel{display:grid;grid-template-columns:1fr 1fr}.session-label{display:none}.heading h1{font-size:28px}.heading p{font-size:10px}.target-panel,.score-panel{padding:12px}.step-controls>span,.level{display:none}.score-main>strong{font-size:40px}.metrics{grid-template-columns:1fr;gap:8px}.pose-list{grid-template-columns:1fr}.pose-card canvas{width:65px}.target-preview{height:130px}.welcome h2{font-size:18px}.transport{padding:12px 9px}.transport>div{gap:6px}.transport .primary{gap:9px}.routine>.section-title>span{font-size:8px}.lesson-dialog{padding:27px 22px}.stage-bottom{font-size:8px}footer{font-size:8px;gap:10px}.hero-copy .primary{font-size:9px}.hero-copy .eyebrow{font-size:8px}.hero-copy{padding:30px 0}.art-ring{width:95%}}

/* Ink dojo: unboxed calligraphy, margin notes and a training ledger. */
:root{--paper:#f5f2e9;--panel:#f9f6ef;--ink:#292824;--muted:#858177;--line:#d4cec0;--accent:#982f2f;--blue:#354e67;--brush:'Yuji Boku','Yu Mincho',serif}
body{background-color:var(--paper);background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23534735' opacity='.045' filter='url(%23n)' d='M0 0h160v160H0z'/%3E%3C/svg%3E")}
.topbar{border-bottom:1px solid var(--line);min-height:78px}.brand{font:600 18px var(--serif);letter-spacing:3px}.brand-icon{font:26px var(--brush);letter-spacing:0;width:32px;height:36px}.header-actions{gap:23px}.xp-pill{background:transparent;color:var(--accent);border-left:1px solid var(--line);padding-left:20px;font-family:var(--serif)}
.ink-hero{min-height:390px;display:grid;grid-template-columns:1fr 2fr 1fr;align-items:center;position:relative;border-bottom:1px solid var(--line)}.margin-note{writing-mode:vertical-rl;font:22px var(--brush);letter-spacing:8px;justify-self:center;color:#666159;height:225px}.margin-note span{font:10px var(--serif);letter-spacing:3px;margin-right:13px;color:var(--muted)}.calligraphy-piece{min-width:0;height:385px;display:grid;place-items:center;position:relative}.enso{position:absolute;width:100%;height:100%;color:#8c857833;max-width:570px}.brush-title{font:170px var(--brush);letter-spacing:-15px;line-height:1.2;margin:-20px 0 0;position:relative;transform:rotate(-5deg);white-space:nowrap;font-synthesis:none}.ink-seal{font:20px var(--brush);line-height:1.2;color:var(--accent);border:2px solid var(--accent);padding:5px 4px;position:absolute;right:12%;bottom:80px;transform:rotate(3deg)}.right-note{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:35px}.right-note>span{writing-mode:vertical-rl;letter-spacing:6px;font:14px var(--serif);line-height:1.8}.ink-link{background:none;border-bottom:1px solid var(--accent);color:var(--accent);font:11px var(--serif);padding:10px 0}.ink-link span{margin-left:14px}.chapter-heading{margin-top:30px}.chapter-heading h2{font-size:16px;letter-spacing:2px;font-weight:500}.chapter-heading>span{letter-spacing:1px;font:10px var(--serif)}.chapter-grid{gap:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.chapter{background:transparent;border:0;border-right:1px solid var(--line);padding:22px 35px 20px;gap:10px;position:relative}.chapter:last-child{border-right:0}.chapter:hover{transform:none;background:#29282404}.chapter.selected{outline:none;background:#982f2f04;box-shadow:inset 0 -2px var(--accent)}.chapter-top{font:14px var(--brush);color:var(--accent)}.chapter-top>span{font:9px var(--serif);letter-spacing:1px;color:var(--muted)}.chapter-calligraphy{font:54px var(--brush);display:block;margin:0;line-height:1.45;letter-spacing:4px;transform:rotate(-2deg);text-align:center}.chapter-name{font:600 18px var(--serif);letter-spacing:1px}.chapter-name i{font-size:16px;color:var(--accent)}.chapter-description{margin:0;font-size:10px;line-height:1.8;color:var(--muted)}.chapter-bottom{padding-top:8px;border:0;font:9px var(--serif);color:var(--accent)}.course-grid{display:block;border-top:1px solid var(--line)}.lesson-card{display:grid;grid-template-columns:28px 1.1fr 1.15fr 1.2fr 95px;align-items:center;gap:20px;border:0;border-bottom:1px solid var(--line);background:transparent;padding:27px 14px}.lesson-index{font:21px var(--brush);color:var(--accent)}.lesson-title-group>small{font-size:8px;letter-spacing:1px;color:var(--muted)}.lesson-title-group h3{font:600 19px var(--serif);margin:5px 0 8px}.tag{border:0;padding:0;color:var(--accent);font:9px var(--serif)}.lesson-kanji{font:32px var(--brush);white-space:nowrap;letter-spacing:-2px;opacity:.75}.lesson-card p{margin:0;min-height:0;font-size:10px}.lesson-enter{border:0;font:11px var(--serif);text-align:right;padding:10px 0}.coming-panel{background:transparent;border:0;padding:35px 14px}.coming-panel h3{font-weight:500}.journey{margin-top:30px;padding:18px 0;border-top:0}.journey-icon{font:24px var(--brush);color:var(--accent)}.journey h2{font-family:var(--serif);font-weight:500}.journey-stamp{border:2px solid var(--accent);font:11px var(--serif);padding:8px 11px}.progress{height:3px}.primary{border-radius:0;background:var(--accent);font-family:var(--serif)}.outline{font-family:var(--serif)}.heading h1{font-weight:500}.heading .eyebrow{color:var(--muted)}.studio,.target-panel,.score-panel{background:#f9f6ef99;border-color:var(--line)}.viewport{background:radial-gradient(ellipse at center,#35424e,#222c35)}.practice-context{font-family:var(--serif);background:transparent}.pose-card{background:transparent;border:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.pose-card.selected{box-shadow:inset 0 -2px var(--accent);border-color:var(--line);background:#982f2f04}.lesson-dialog{border-top:4px solid var(--accent)}.grip-diagram{background:transparent;border-left:0;border-right:0}.grip-diagram>div{font-family:var(--brush)}.quiz-choice{font-family:var(--serif)}footer{font-family:var(--serif);letter-spacing:2px}
@media(max-width:1050px){.ink-hero{grid-template-columns:.65fr 2fr .65fr}.lesson-card{grid-template-columns:25px 1fr 1fr 90px}.lesson-card p{display:none}.chapter{padding:22px}.brush-title{font-size:155px}.ink-seal{right:7%}}
@media(max-width:760px){.ink-hero{grid-template-columns:30px 1fr 30px;min-height:300px}.calligraphy-piece{height:290px}.brush-title{font-size:125px;letter-spacing:-12px}.margin-note{font-size:13px;height:180px;letter-spacing:5px}.margin-note span{display:none}.right-note{height:180px;justify-content:start}.right-note>span{font-size:10px;letter-spacing:4px}.right-note .ink-link{display:none}.ink-seal{font-size:13px;bottom:57px;right:0;padding:3px}.enso{width:120%;max-width:none}.chapter-grid{display:block}.chapter{width:100%;border-right:0;border-bottom:1px solid var(--line);display:grid;grid-template-columns:76px 1fr;column-gap:20px;row-gap:6px;padding:18px 10px}.chapter:last-child{border-bottom:0}.chapter-top{grid-column:2;grid-row:1}.chapter-calligraphy{grid-column:1;grid-row:1/5;font-size:38px;align-self:center;writing-mode:vertical-rl;justify-self:center;letter-spacing:0}.chapter-name{grid-column:2;grid-row:2;font-size:18px}.chapter-description{grid-column:2;font-size:9px}.chapter-bottom{grid-column:2;padding-top:0}.lesson-card{grid-template-columns:20px 1fr 80px;gap:10px;padding:23px 2px}.lesson-kanji{display:none}.lesson-title-group h3{font-size:17px}.lesson-enter{font-size:10px}.brand{font-size:14px;letter-spacing:1px}.brand-icon{font-size:23px;width:29px}.header-actions{gap:12px}.xp-pill{font-size:9px;padding:5px 0 5px 10px}.journey-progress{width:36%}.lesson-card p{display:none}}

.target-dot{background:#cf626b}.countdown{color:#cf626b}.camera-icon svg{stroke:#cf626b}.lesson-characters{font:43px var(--brush);letter-spacing:2px;margin-top:20px}.result-medal{font:62px var(--brush);color:var(--accent)}

/* One continuous, pressure-shaped ink stroke; no overlapping ring segments. */
.enso{color:#353029;opacity:.94}.margin-note{font-size:30px;letter-spacing:10px;height:auto;line-height:1.8;color:var(--ink)}.right-note>span{font-size:13px;letter-spacing:3px;line-height:2.2}.right-note{gap:25px}
@media(max-width:760px){.margin-note{font-size:18px;letter-spacing:6px}.right-note>span{font-size:10px;letter-spacing:1px;line-height:1.6}.right-note{height:auto}.enso{width:116%}}

.video-dialog{width:min(880px,94vw);max-width:94vw}.video-dialog iframe{display:block;width:100%;aspect-ratio:16/9;border:0;background:#191b20;margin:20px 0}.video-dialog p{font-size:13px;color:#706b63}.transport{flex-wrap:wrap;gap:12px}.transport>div{flex-wrap:wrap}.opponent-status{position:absolute;top:58px;left:50%;transform:translateX(-50%);padding:8px 16px;background:#1b202bdd;color:#f7ead2;border:1px solid #e2d0aa55;border-radius:4px;text-align:center;white-space:nowrap;pointer-events:none}.opponent-status[data-tap="true"]{background:#922e36;color:white;font-size:24px}.welcome~.opponent-status{visibility:visible}.viewport:has(.welcome:not([hidden])) .opponent-status{visibility:hidden}

.lesson-reference{border:1px solid var(--line);padding:20px;background:#f9f6ef99}.lesson-reference h3{font:600 20px var(--serif);margin:15px 0 5px}.lesson-reference p{font-size:12px;line-height:1.8}.lesson-reference .roman{font-size:10px;color:var(--muted)}.lesson-reference .grip-diagram{padding:10px 0;margin:12px 0}.lesson-reference .grip-diagram>div{font-size:28px}.lesson-reference .source-link{font-size:11px}

#grip-preview{width:100%;height:auto;display:block}.lesson-reference .grip-labels{font:11px var(--serif);display:flex;justify-content:space-around;gap:8px}.lesson-reference .grip-diagram small{font-size:10px}

.lesson-reference .grip-labels span{font:11px var(--serif);white-space:nowrap}.lesson-reference .grip-labels b{font:14px var(--serif)}.lesson-reference .grip-diagram strong{font-size:11px}.lesson-reference{padding:16px}.lesson-reference #grip-note{margin-bottom:8px}
.viewport:has(.welcome:not([hidden])) #overlay{opacity:.18}

/* A dojo interior: plaster above cedar boards, raised columns and tatami. */
:root {
  --paper: #f3f3ed;
  --panel: #faf9f3;
  --muted: #686b60;
  --line: #c5c8b8;
}
body {
  position: relative;
  min-height: 100vh;
  isolation: isolate;
  background: #a4b294;
}
.dojo-room {
  --wall-height: clamp(440px, 52vh, 560px);
  --wood-height: 210px;
  --floor-top: calc(var(--wall-height) + var(--wood-height));
  position: absolute;
  inset: 0;
  z-index: -1;
  overflow: hidden;
  pointer-events: none;
}
.dojo-wall {
  position: absolute;
  inset: 0 0 auto;
  height: var(--wall-height);
  background:
    radial-gradient(ellipse at 50% 30%, #fffef9b3, transparent 75%),
    url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23534735' opacity='.035' filter='url(%23n)' d='M0 0h160v160H0z'/%3E%3C/svg%3E"),
    linear-gradient(90deg, #d6d8d1, #f1f1eb 18%, #eeeee8 82%, #d0d3cc);
  box-shadow: inset 0 12px 25px #303c3020;
}
.dojo-wainscot {
  position: absolute;
  top: var(--wall-height);
  width: 100%;
  height: var(--wood-height);
  border-top: 9px solid #ad7b43;
  border-bottom: 17px solid #73502f;
  background:
    linear-gradient(180deg, #422a2533, transparent 12%, transparent 78%, #39241440),
    repeating-linear-gradient(90deg, #3b251943 0 1px, #f1c78945 1px 3px, transparent 3px 30px, #3b251966 30px 32px),
    repeating-linear-gradient(91deg, transparent 0 5px, #63391818 6px, transparent 8px 13px),
    linear-gradient(90deg, #9c703f, #bf9259 35%, #ad7d45 65%, #966738);
  box-shadow: 0 -2px 4px #493d3426, inset 0 2px #edc38c, 0 7px 8px #263a3040;
}
.dojo-floor {
  position: absolute;
  inset: var(--floor-top) 0 0;
  perspective: 650px;
  background: #a3b396;
}
.dojo-tatami {
  position: absolute;
  inset: 0 -35% -100vh;
  transform: rotateX(35deg);
  transform-origin: center top;
  background:
    repeating-linear-gradient(0deg, #3f574f66 0 2px, #edf0d633 2px 4px, transparent 4px 150px),
    repeating-linear-gradient(90deg, #3f574f66 0 2px, #edf0d633 2px 4px, transparent 4px 280px),
    repeating-linear-gradient(0deg, #ffffff0b 0 1px, #5166480c 1px 3px),
    conic-gradient(#aab99b 25%, #9dab8b 0 50%, #aab99b 0 75%, #9dab8b 0) 0 0 / 560px 300px;
  box-shadow: inset 0 14px 30px #30433140;
}
.dojo-pillar {
  position: absolute;
  top: 0;
  height: var(--floor-top);
  width: clamp(25px, 3.5vw, 58px);
  background: linear-gradient(90deg, #d1d3cb 0 8%, #f7f7f0 10%, #eeeee6 76%, #c4c7bd 79%, #bfc3b9);
  border-left: 1px solid #ffffff80;
  box-shadow: 12px 0 14px #31332922, -3px 0 7px #3943310d;
}
.dojo-pillar::after {
  content: '';
  position: absolute;
  inset: auto -2px 0;
  height: 20px;
  background: linear-gradient(90deg, #80603d, #b58a56 12%, #a77a46 78%, #735330 80%);
  box-shadow: 0 3px 4px #293b3033;
}
.dojo-pillar-left { left: 1%; }
.dojo-pillar-right { right: 1%; }
.topbar {
  background: #f7f7f02b;
  border-color: #a8afa04d;
}
.ink-hero { border-bottom-color: transparent; }

#home-screen > .chapter-heading {
  margin-top: 100px;
  margin-bottom: 0;
  padding: 18px 26px;
  background: #f7f6edf2;
  border-top: 3px solid #87633e;
}
.chapter-grid {
  background: #f7f6edf5;
  box-shadow: 0 10px 20px #25372520;
}
.chapter:hover { background: #637d5012; }
.chapter.selected { background: #637d501a; }
.course-shelf {
  margin-top: 24px;
  padding: 1px 26px 12px;
  background: #f7f6edf5;
  box-shadow: 0 6px 18px #25372518;
}
.journey {
  padding: 20px 26px;
  background: #eff2e7ed;
  border: 1px solid #e1e6d5;
}
footer { color: #303e2e; }
#practice-screen {
  margin-top: 24px;
  padding: 0 26px 26px;
  background: #f5f5edf5;
  box-shadow: 0 8px 24px #25372520;
}
@media (max-width: 760px) {
  .dojo-room {
    --wall-height: 420px;
    --wood-height: 180px;
  }
  .dojo-pillar { width: 17px; }
  .dojo-pillar-left { left: 0; }
  .dojo-pillar-right { right: 0; }
  #home-screen > .chapter-heading { margin-top: 80px; padding: 16px 14px; }
  .chapter-grid { background: #f7f6edf2; }
  .course-shelf { padding: 1px 14px 12px; }
  .journey { padding: 18px 12px; }
  #practice-screen { padding: 0 10px 18px; }
}
@media (max-width: 480px) {
  #practice-screen .panel { grid-template-columns: minmax(0, 1fr); }
}

/* A framed archival portrait on the upper-right wall. */
.right-note {
  align-self: stretch;
  justify-content: flex-start;
  padding-top: 22px;
  gap: 18px;
}
.founder-portrait {
  align-self: flex-end;
  width: 106px;
  margin: 0 16px 0 0;
  padding: 0;
  border: 6px ridge #443a2f;
  background: #eee9da;
  box-shadow: 3px 6px 8px #252a2933, inset 0 0 0 1px #fff9;
}
.founder-portrait img {
  display: block;
  width: 100%;
  height: auto;
}
@media (max-width: 760px) {
  .dojo-room { --wall-height: 480px; }
  .ink-hero { padding-top: 110px; }
  .right-note { align-self: center; padding-top: 0; }
  .founder-portrait {
    position: absolute;
    top: 12px;
    right: 0;
    width: 70px;
    margin: 0;
    border-width: 4px;
  }
}

/* The partner is static; only the translucent instructor hands and user markers move. */
#partner { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
#overlay { pointer-events:none; }
.viewport:has(.welcome:not([hidden])) #overlay { opacity:1; }
#video { inset:auto auto 14px 14px; width:22%; max-width:150px; height:auto; aspect-ratio:4/3; object-fit:cover; border:1px solid #ffffff40; border-radius:4px; z-index:3; }
.live-score { position:absolute; z-index:4; top:54px; right:14px; width:156px; padding:12px; color:#eaf4fa; background:#14212bed; border:1px solid #7694a155; border-radius:4px; pointer-events:none; }
.live-score > span { display:block; font-size:10px; line-height:1.6; }
.live-score > strong { display:block; font:600 42px var(--serif); line-height:1.25; margin:3px 0 6px; font-variant-numeric:tabular-nums; }
.live-score p { font-size:10px; line-height:1.7; margin:8px 0 0; color:#c4d6df; }
.live-score[data-level="good"] { border-color:#7fcb9c; }
.live-score[data-level="good"] > strong { color:#a4edbc; }
.live-score[data-level="near"] > strong { color:#f7d18c; }
.live-score[data-level="adjust"] > strong { color:#f4a5a5; }
.opponent-status { top:auto; bottom:49px; max-width:90%; white-space:normal; font-size:11px; }
.stage-bottom { bottom:10px; }
.stage-bottom > span { max-width:60%; line-height:1.5; }
.legend { font-size:9px; }
.target-dot { background:#eef6fb; box-shadow:0 0 0 1px #8097a6; }
.demo-button { margin:0; padding:9px 12px; font-size:11px; }
.demo-button[aria-pressed="true"] { border-color:var(--accent); color:var(--accent); }
@media(max-width:760px) {
  .viewport { aspect-ratio:3/4; }
  .live-score { top:49px; right:9px; width:107px; padding:8px; }
  .live-score > strong { font-size:31px; }
  .live-score > span,.live-score p { font-size:9px; }
  .live-score p { margin-top:5px; }
  .opponent-status { bottom:53px; padding:6px 9px; font-size:10px; }
  .stage-top { left:9px; right:9px; font-size:8px; }
  .stage-bottom { left:9px; right:9px; font-size:8px; }
  .legend { gap:7px; font-size:8px; }
  #video { bottom:52px; left:9px; }
}

.viewport:has(.welcome:not([hidden])) .opponent-status { visibility:visible; }

.studio > .welcome { position:static; width:auto; padding:12px 15px; flex-direction:row; justify-content:space-between; gap:12px; text-align:left; border-bottom:1px solid var(--line); }
.studio > .welcome p { margin:0; color:var(--muted); font-size:11px; }
.studio > .welcome .primary { padding:10px 13px; font-size:10px; white-space:nowrap; }
@media(max-width:480px) {
  .studio > .welcome { flex-wrap:wrap; padding:10px; }
  .studio > .welcome p { font-size:10px; }
}

/* Keep score and guidance outside the enlarged partner's hands and collar. */
.studio > .live-score { position:static; width:auto; margin:0; border-radius:0; display:grid; grid-template-columns:72px 1fr 1.6fr; column-gap:14px; align-items:center; }
.studio > .live-score > strong { grid-column:1; grid-row:1/3; margin:0; }
.studio > .live-score > span { grid-column:2; }
.studio > .live-score > p { grid-column:3; grid-row:1/3; margin:0; }
@media(max-width:760px) {
 .studio > .live-score { grid-template-columns:56px 1fr; padding:10px 12px; }
 .studio > .live-score > strong { grid-row:1/4; }
 .studio > .live-score > p { grid-column:2; grid-row:3; margin-top:3px; }
}