.lv2{overflow-x:clip}.lv2 .hand{font-family:var(--hand);font-weight:400}.lv2 .center{text-align:center;margin-inline:auto}.lv2 .chapter{font:600 13px/1 var(--text);letter-spacing:.12em;text-transform:uppercase;color:var(--margin);margin:0 0 14px}.lv2 .pill{letter-spacing:.04em;background:var(--highlight);color:#1f2b6c;vertical-align:1px;border-radius:999px;margin-left:8px;padding:3px 9px;font-size:11px;display:inline-block}.lv2 h2{max-width:16em}.lv2 .ink{display:inline-block}.lv2 .reveal-up{will-change:transform, opacity}.lv2-js .hero2 h1 .ink{clip-path:inset(-40% 100% -40% -4%)}.lv2-js .hero2 .magnet,.lv2-js .hero2 .reveal-up,.lv2-js .hero2-date,.lv2-js .hero-phrase .tl,.lv2-js .hero-en{opacity:0}.sheet{--seyes:13px;--major:calc(var(--seyes) * 4);background-color:var(--sheet);background-image:linear-gradient(to right, var(--line-minor) 1px, transparent 1px), linear-gradient(to bottom, var(--line-major) 1px, transparent 1px), linear-gradient(to bottom, var(--line-minor) 1px, transparent 1px);background-size:var(--major) 100%, 100% var(--major), 100% var(--seyes);box-shadow:var(--shadow);padding:var(--major) 28px var(--major) 96px;border-radius:6px 6px 18px 18px;position:relative}.sheet:before{content:"";background:var(--margin);opacity:.8;transform-origin:top;width:2px;transform:scaleY(var(--margin-scale,1));position:absolute;top:0;bottom:0;left:74px}.sheet:after{content:"";background:radial-gradient(circle, var(--page) 6px, transparent 7px) 0 0 / 16px 72px repeat-y;width:16px;position:absolute;top:40px;bottom:40px;left:22px}.sheet-line{line-height:var(--major);margin:0;position:relative}.pen{z-index:40;pointer-events:none;opacity:0;transform-origin:0 0;filter:drop-shadow(0 8px 10px #1f2b6c40);width:86px;height:86px;position:fixed;top:0;left:0}.pen .pen-body{fill:#1f2b6c}.pen .pen-grip{fill:#11184a}.pen .pen-nib{fill:#d9a520}.pen .pen-slit{stroke:#7a5a08;stroke-width:1.4px}.pen .pen-hole{fill:#7a5a08}.pen .pen-clip{fill:#c9ced9}:root[data-theme=dark] .pen .pen-body{fill:#e8ebff}:root[data-theme=dark] .pen .pen-grip{fill:#b8bfe6}.hero2{flex-direction:column;justify-content:center;min-height:calc(100svh - 84px);padding:24px 0 72px;display:flex;position:relative}.hero2-grid{grid-template-columns:minmax(0,6fr) minmax(0,6fr);align-items:center;gap:48px;width:100%;display:grid}.hero2-date{color:var(--margin);margin:0 0 6px;font-size:20px}.hero2 h1{font:400 clamp(30px, 3.5vw, 52px)/1.34 var(--hand);letter-spacing:-.005em;margin:0 0 24px}.hero2 h1 .ink{white-space:nowrap;width:max-content;display:block}.hero2 .lede{color:var(--ink-soft);max-width:30em;margin:0 0 30px;font-size:clamp(17px,1.7vw,20px)}.hero2 .cta{flex-wrap:wrap;align-items:center;gap:14px 20px;display:flex}.hero2 .cta a.text{color:var(--ink-soft);text-underline-offset:4px;font-size:15px}.hero2-stage{height:clamp(360px,44vw,480px);position:relative}.hero-sheet{--seyes:14px;padding:calc(var(--major) * 1) 24px 0 96px;position:absolute;inset:22% 2% 20% 6%;transform:rotate(-2deg)}.hero-phrase{white-space:nowrap;font-size:40px;font-family:var(--hand)}.hero-phrase .tl{display:inline-block}.hero-phrase .gap{width:.35em;display:inline-block}.hero-en{font:400 16px/var(--major) var(--text);color:var(--ink-soft)}.magnet{left:var(--x);top:var(--y);z-index:3;font:700 46px/1 var(--text);color:var(--c);transform:rotate(var(--r));text-shadow:0 2px 0 color-mix(in srgb, var(--c) 60%, #000), 0 10px 14px #1f2b6c38;-webkit-text-stroke:1px color-mix(in srgb, var(--c) 70%, #000);will-change:transform, opacity;-webkit-user-select:none;user-select:none;position:absolute}.scroll-hint{left:50%;bottom:calc(var(--ruler-h,0px) + 18px);letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft);flex-direction:column;align-items:center;gap:8px;margin:0;font-size:12px;display:flex;position:absolute;transform:translate(-50%)}.scroll-hint i{background:linear-gradient(var(--ink-soft), transparent);transform-origin:top;width:2px;height:34px;animation:1.8s ease-in-out infinite hint}@keyframes hint{0%{opacity:1;transform:scaleY(0)}70%{opacity:1;transform:scaleY(1)}to{opacity:0;transform:scaleY(1)}}.scene{align-items:center;min-height:100svh;padding:64px 0;display:flex}.scene .wrap{width:100%}.scene-grid{grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:center;gap:56px;display:grid}.scene-grid.reverse{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}.scene-grid.reverse>.scene-copy{order:2}.scene-copy h2{margin-bottom:16px}.scene-copy p{color:var(--ink-soft);max-width:30em;margin:0 0 12px;font-size:18px}.scene-copy .try-it{font:400 17px/1.5 var(--hand);color:var(--margin);margin-top:18px}.scene-stack{flex-direction:column;gap:28px;display:flex}.sheet-lesson{--seyes:15px;padding-top:calc(var(--major) * 1);padding-bottom:calc(var(--major) * 1)}.sheet-lesson .date{color:var(--ink);font-size:22px}.sheet-lesson .lesson-title{color:var(--ink);font-size:34px;display:inline-block}.sheet-lesson .rule{width:calc(100% + 12px);height:10px;position:absolute;bottom:2px;left:-4px;right:-8px;overflow:visible}.sheet-lesson .rule path{fill:none;stroke:var(--margin);stroke-width:3px;stroke-linecap:round;vector-effect:non-scaling-stroke}.sheet-lesson .eq{font:400 46px/var(--major) var(--hand);white-space:nowrap}.sheet-lesson .eq .lt{color:var(--ink)}.sheet-lesson .s.a{color:var(--syl-a)}.sheet-lesson .s.b{color:var(--syl-b)}.say-word{font:inherit;line-height:inherit;cursor:pointer;-webkit-text-decoration:underline 2px var(--line-major);text-decoration:underline 2px var(--line-major);text-underline-offset:9px;background:0 0;border:0;border-radius:10px;padding:0 4px;transition:background-color .15s,text-decoration-color .15s}.say-word:hover,.say-word:focus-visible{background:var(--line-minor);-webkit-text-decoration-color:var(--ink-soft);text-decoration-color:var(--ink-soft)}.gloss{font:400 15px/1 var(--text);color:var(--ink-soft);vertical-align:6px;margin-left:16px}.sheet-big{--seyes:30px;padding:calc(var(--major) * 1) 40px calc(var(--major) * 2) 110px}.sheet-big:before{left:88px}.big-words{font:500 72px/var(--major) var(--text);white-space:normal}.big-words .bw{white-space:nowrap;display:inline-block}.big-words .sy{display:inline-block}.big-words .ch{transition:none;display:inline-block}.arcs,.circle{pointer-events:none;width:100%;height:100%;position:absolute;inset:0;overflow:visible}.arcs path{fill:none;stroke:var(--ink);stroke-width:3px;stroke-linecap:round;opacity:0}.circle{opacity:0;width:140px;height:80px;inset:0 auto auto 0}.circle path{fill:none;stroke:var(--margin);stroke-width:3.2px;stroke-linecap:round}.teacher{opacity:0;color:var(--margin);white-space:nowrap;margin:0;font-size:24px;line-height:1.3;position:absolute;top:0;left:0}.teacher small{font:500 14px/1.4 var(--text);color:var(--ink-soft);margin-top:2px;display:block}.beats{counter-reset:beat;grid-template-columns:repeat(3,1fr);gap:24px;margin:0;padding:0;list-style:none;display:grid}.beats li{counter-increment:beat;color:var(--ink-soft);align-items:flex-start;gap:12px;font-size:16px;transition:opacity .3s;display:flex}.beats li p{margin:0}.beats li:before{content:counter(beat);font:400 34px/1 var(--hand);color:var(--margin);flex:none}.beats b{color:var(--ink)}.sheet-listen{--seyes:13px;padding-top:calc(var(--major) * 2.5);padding-bottom:calc(var(--major) * 2.4)}.mini-player{align-items:center;gap:12px;display:flex;position:absolute;top:16px;left:96px;right:24px}.mp-play{background:var(--margin);color:#fff;border-radius:50%;flex:none;place-items:center;width:44px;height:44px;display:grid;box-shadow:0 3px #b3363a}.mp-play svg{width:18px;height:18px}.mp-meta{flex:1;min-width:0;font-size:14px}.mp-meta b{font-weight:600;display:block}.mp-bar{background:var(--line-minor);border-radius:99px;height:5px;margin-top:6px;display:block;overflow:hidden}.mp-bar i{background:var(--margin);width:0;height:100%;display:block}.mp-time{color:var(--ink-soft);font-variant-numeric:tabular-nums;font-size:13px}.listen-text{font:400 25px/var(--major) var(--text)}.lw{border-radius:8px;margin:0 -1px;padding:2px 3px;transition:background .12s,box-shadow .12s}.lw .sy:nth-of-type(odd){color:var(--syl-a)}.lw .sy:nth-of-type(2n){color:var(--syl-b)}.lw .sy{border-radius:4px;transition:background .1s}.lw.reading{background:var(--reading);box-shadow:inset 0 -3px 0 var(--reading-edge)}.lw .sy.on{background:var(--highlight);color:#1f2b6c}.lw.hovered{background:var(--line-minor)}.cursor{z-index:7;opacity:0;pointer-events:none;width:30px;height:30px;position:absolute;top:0;left:0}.cursor svg{width:100%;height:100%}.cursor path{fill:var(--ink);stroke:var(--sheet);stroke-width:1.6px;stroke-linejoin:round}.tip2{z-index:6;opacity:0;pointer-events:none;background:var(--ink);color:var(--sheet);font:500 16px/1.3 var(--text);white-space:nowrap;border-radius:9px;padding:7px 12px;position:absolute;top:0;left:0;transform:translate(-50%,-100%)}.tip2:after{content:"";background:inherit;width:10px;height:10px;position:absolute;bottom:-5px;left:50%;transform:translate(-50%)rotate(45deg)}.note-card{z-index:5;opacity:0;background:var(--card);border:2px solid var(--card-edge);border-radius:14px;gap:2px;padding:10px 14px;font-size:14px;display:grid;position:absolute;bottom:16px;right:24px;box-shadow:0 16px 34px -18px #1f2b6c80}.note-card b{font-size:17px}.note-card span{color:var(--ink-soft)}.beat-text{min-height:7.5em;position:relative}.beat-text p{opacity:0;transition:opacity .35s;position:absolute;inset:0 0 auto}.beat-text p.on{opacity:1}.try{padding:96px 0 72px}.try h2{margin-bottom:40px}.annotation2{z-index:3;width:max-content;max-width:calc(100% - 150px);color:var(--margin);margin:0 0 8px 150px;font-size:24px;line-height:1.3;position:relative}.annotation2 small{font:500 15px/1.4 var(--text);color:var(--ink-soft);display:block}.annotation2 svg{width:60px;height:90px;color:var(--margin);position:absolute;top:14px;left:-54px;overflow:visible}.annotation2 svg path{stroke-dasharray:200}.board-wrap{padding:72px 0}.board{color:#f2efe3;background:radial-gradient(1200px 400px at 20% 0,#ffffff0f,#0000 60%),radial-gradient(900px 500px at 90% 100%,#0000002e,#0000 60%),repeating-linear-gradient(115deg,#ffffff05 0 2px,#0000 2px 7px),#24473d;border:16px solid #a86b3c;border-radius:10px;padding:56px 56px 72px;position:relative;box-shadow:inset 0 0 0 3px #7c4a24,inset 0 0 60px #00000059,0 30px 60px -30px #0000008c}.board:after{content:"";background:linear-gradient(#b87b48,#8a5530);border-radius:0 0 6px 6px;height:14px;position:absolute;bottom:-16px;left:6%;right:6%}.chalk{color:#f2efe3;text-shadow:0 0 1px #f2efe399,0 0 8px #f2efe31f;font-family:var(--hand);font-weight:400}.board h2.chalk{max-width:none;margin:0 0 32px;font-size:clamp(30px,4vw,44px)}.pains2{gap:30px;margin:0;padding:0;list-style:none;display:grid}.pains2 li{border-bottom:2px dashed #f2efe32e;grid-template-columns:minmax(0,6fr) minmax(0,5fr);align-items:start;gap:16px 48px;padding-bottom:26px;display:grid}.pains2 li:last-child{border-bottom:0;padding-bottom:0}.pains2 q{quotes:none;font-size:clamp(19px,2vw,24px);line-height:1.55}.pains2 .answer{color:#f2efe3c7;margin:0;font-size:16px}.pains2 .answer b{color:#ffe27a;margin-bottom:4px;font-size:17px;font-weight:600;display:block}.sponge{z-index:2;background:linear-gradient(#f2c14e 0 60%,#3d3d3d 60%);border-radius:5px;width:74px;height:22px;position:absolute;bottom:-30px;right:10%}.chalk-stick{z-index:2;background:#f7f5ee;border-radius:4px;width:46px;height:9px;position:absolute;bottom:-24px;right:22%;transform:rotate(-4deg)}.sheet-voice{--seyes:13px;padding-top:calc(var(--major) * 2);padding-bottom:calc(var(--major) * 2)}.mic{background:var(--margin);color:#fff;border-radius:50%;place-items:center;width:48px;height:48px;display:grid;position:absolute;top:14px;left:96px}.mic svg{z-index:1;width:22px;height:22px;position:relative}.mic .ring{border:3px solid var(--margin);opacity:0;border-radius:50%;animation:2s ease-out infinite ring;position:absolute;inset:0}.mic .ring.r2{animation-delay:1s}@keyframes ring{0%{opacity:.6;transform:scale(1)}to{opacity:0;transform:scale(1.9)}}.voice-text{font:500 28px/var(--major) var(--text)}.vw{color:var(--ink-soft);opacity:.55;transition:color .2s,opacity .2s}.vw.ok{color:var(--reading-edge);opacity:1}.thumb{opacity:0;z-index:4;font-size:40px;position:absolute;top:0;left:0}.score{opacity:0;align-items:center;gap:10px;display:flex;position:absolute;top:12px;right:26px}.score svg{width:48px;height:48px;transform:rotate(-90deg)}.score circle{fill:none;stroke-width:5px}.score .track{stroke:var(--line-minor)}.score .fill{stroke:var(--reading-edge);stroke-linecap:round;stroke-dasharray:113.1;stroke-dashoffset:113.1px}.score b{font-variant-numeric:tabular-nums;font-size:20px}.stars{color:var(--line-major);letter-spacing:2px;font-size:20px}.stars i{font-style:normal;display:inline-block}.stars i.on{color:#f0a91a}.voice-panel{margin-top:calc(var(--major) * .75);position:relative}.demo-card{background:var(--card);border:2px solid var(--card-edge);box-shadow:var(--shadow);border-radius:18px;max-width:480px;padding:16px 20px 14px}.demo-note{color:var(--margin);margin:0 0 2px;font-size:21px}.demo-turn{margin:0 0 14px;font-size:16px}.try-now svg{width:18px;height:18px}.try-now{background:var(--margin);color:#fff;box-shadow:0 3px #b3363a}.demo-card small{color:var(--ink-soft);margin-top:10px;font-size:13px;display:block}.live-on .demo-card,.live-on .thumb,.live-on .score{display:none!important}.live-on .vw{color:var(--ink);opacity:1;cursor:pointer;border-radius:8px;margin:0 -2px;padding:1px 3px;transition:background .15s,color .15s}.live-on .vw:hover{background:var(--line-minor)}.vw.al-current{box-shadow:0 0 0 3px var(--highlight);background:var(--highlight)!important;color:#1f2b6c!important}.vw.al-current.al-stuck{animation:.9s ease-in-out infinite alternate aloud-stuck}.vw.al-ok,.vw.al-retry{color:#2f9e62!important}.vw.al-helped,.vw.al-missed{color:#c8412f!important}.vw.al-missed{text-decoration:line-through}.aloud-ui[hidden],.aloud-done[hidden]{display:none}.aloud-ui{max-width:520px}.aloud-status{margin:0 0 6px;font-weight:600}.aloud-heard{color:var(--ink-soft);min-height:1.5em;margin:0 0 4px;font-size:15px}.aloud-heard span{text-transform:uppercase;letter-spacing:.1em;margin-right:6px;font-size:11px;font-weight:600}.aloud-help{color:var(--ink-soft);margin:0 0 12px;font-size:13px}.aloud-done{grid-template-columns:auto 1fr;align-items:center;gap:12px 18px;max-width:560px;display:grid}.done-score{width:72px;height:72px;position:relative}.done-score svg{width:100%;height:100%;transform:rotate(-90deg)}.done-score circle{fill:none;stroke-width:5px}.done-score .track{stroke:var(--line-minor)}.done-score .fill{stroke:var(--reading-edge);stroke-linecap:round;stroke-dasharray:113.1;stroke-dashoffset:113.1px;transition:stroke-dashoffset .9s ease-out}.done-score b{white-space:nowrap;font-variant-numeric:tabular-nums;place-items:center;font-size:16px;display:grid;position:absolute;inset:0}.done-msg{color:var(--margin);margin:0;font-size:24px;line-height:1.3}.done-stars{color:#f0a91a;letter-spacing:3px;margin:2px 0 0;font-size:22px}.done-detail{color:var(--ink-soft);margin:2px 0 0;font-size:14px}.done-actions{flex-wrap:wrap;grid-column:1/-1;gap:10px;display:flex}.more2 .diction .tip{opacity:1;white-space:normal;color:var(--ink-soft);font:400 14px/1.5 var(--text);background:0 0;padding:0;position:static;transform:none}.more2 .diction .tip:after{display:none}.shelf2{align-items:flex-end;gap:6px;height:320px;margin:12px 0 36px;padding:0 24px;display:flex;position:relative;overflow:hidden}.spine{min-width:34px;max-width:66px;height:var(--h);background:linear-gradient(90deg, #0000002e, transparent 18%, transparent 78%, #00000038), var(--c);border-radius:4px 4px 2px 2px;flex:1 1 0;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden;box-shadow:inset 0 6px #ffffff2e,inset 0 -10px #0000001f}.spine span{color:#fff;font:600 16px/1 var(--text);white-space:nowrap;letter-spacing:.01em;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)rotate(-90deg)}.plank{z-index:1;background:linear-gradient(#c58a55,#95603a);border-radius:3px;height:14px;position:absolute;bottom:0;left:0;right:0;box-shadow:0 10px 20px -12px #00000080}.shelf2 .spine{margin-bottom:14px}.counter-row{flex-wrap:wrap;align-items:center;gap:22px 36px;display:flex}.counter{align-items:baseline;gap:14px;margin:0;display:flex}.counter .count{font:700 clamp(56px, 8vw, 88px)/1 var(--text);letter-spacing:-.04em;color:var(--ink);font-variant-numeric:tabular-nums}.counter span{color:var(--ink-soft);font-size:18px}.counter em{color:var(--ink);font-style:normal;font-weight:600}.ladder2{gap:6px;display:flex}.ladder2 span{background:var(--card);border:2px solid var(--card-edge);border-radius:999px;padding:5px 13px;font-size:14px;font-weight:600}.ladder2 span:first-child{background:var(--highlight);border-color:var(--highlight);color:#1f2b6c}.weekly{font:400 19px/1.4 var(--hand);color:var(--margin);margin:0}.bon-point{text-align:center;width:74px;height:74px;font:400 14px/1.05 var(--hand);color:#7a3b00;background:radial-gradient(circle at 35% 30%,#fff3b0,#f6c343 60%,#e0a21a);border-radius:50%;place-items:center;display:grid;position:absolute;top:-18px;right:-14px;transform:rotate(12deg);box-shadow:0 0 0 3px #fff,0 0 0 5px #e0a21a,0 10px 18px -8px #0006}.closing2{padding:72px 20px 110px}.sheet-closing{--seyes:14px;text-align:center;padding:calc(var(--major) * 2) 40px calc(var(--major) * 1.5) 96px}.sheet-closing h2{font:400 clamp(28px, 4vw, 46px)/1.4 var(--hand);max-width:18em;margin:0 auto 18px}.sheet-closing .intro{margin:0 auto 28px}.stamp{border:4px double var(--margin);width:124px;height:124px;color:var(--margin);opacity:.9;font:400 18px/1.1 var(--hand);text-align:center;white-space:nowrap;border-radius:50%;place-items:center;display:grid;position:absolute;bottom:30px;right:40px;transform:rotate(-14deg)}.stamp:before{content:"★";font-size:16px;position:absolute;top:10px}.stamp:after{content:"★";font-size:16px;position:absolute;bottom:10px}@media (width<=900px){.hero2-grid,.scene-grid,.scene-grid.reverse{grid-template-columns:1fr;gap:28px}.scene-grid.reverse>.scene-copy{order:0}.hero2{min-height:0;padding-top:12px}.hero2-stage{height:300px}.magnet{font-size:34px}.hero-phrase{font-size:30px}.beats,.pains2 li{grid-template-columns:1fr;gap:10px}.scene{min-height:0;padding:40px 0}.scene-copy p{font-size:16px}.beat-text{min-height:6.5em}.scroll-hint{display:none}}@media (width<=640px){.sheet{--seyes:10px;padding-left:50px;padding-right:16px}.sheet:before{left:34px}.sheet:after{display:none}.hero-sheet{--seyes:11px;padding-left:50px;left:0;right:0}.hero-phrase{font-size:24px}.magnet,.sheet-lesson .eq{font-size:28px}.sheet-lesson .lesson-title{font-size:22px}.sheet-lesson .date{font-size:16px}.gloss{margin-left:10px;font-size:13px}.sheet-big{--seyes:17px;padding-left:52px;padding-right:16px}.sheet-big:before{left:34px}.big-words{font-size:40px}.teacher{font-size:18px}.mini-player{left:50px;right:12px}.listen-text{font-size:19px}.voice-text{font-size:20px}.mic{left:50px}.score{right:12px}.board{border-width:10px;padding:34px 22px 50px}.annotation2{max-width:calc(100% - 96px);margin-left:96px;font-size:19px}.shelf2{gap:4px;height:240px;padding:0 8px}.spine{min-width:26px}.spine span{font-size:12px}.spine:nth-child(n+9),.spine:nth-child(n+11){display:none}.stamp{width:84px;height:84px;font-size:13px;bottom:10px;right:10px}.sheet-closing{padding-left:50px;padding-right:16px;padding-top:calc(var(--major) * 3)}.bon-point{width:62px;height:62px;font-size:12px;top:-22px;right:-6px}}@media (prefers-reduced-motion:reduce){.scroll-hint i,.mic .ring{animation:none}}body:has(.ruler){--ruler-h:46px;padding-bottom:var(--ruler-h)}.ruler{--p:0;z-index:28;height:var(--ruler-h);background:linear-gradient(to bottom, #ffffff8c, #fff0 40%), color-mix(in srgb, var(--sheet) 94%, transparent);-webkit-backdrop-filter:blur(8px);border-top:1px solid color-mix(in srgb, var(--ink) 18%, transparent);position:fixed;bottom:0;left:0;right:0;box-shadow:0 -10px 24px -18px #1f2b6c73}:root[data-theme=dark] .ruler{background:color-mix(in srgb, var(--sheet) 95%, transparent)}.ruler-track{cursor:pointer;height:100%;margin:0 34px;position:relative}.ruler-ticks{width:100%;height:16px;position:absolute;top:0;left:0;overflow:visible}.ruler-ticks line{stroke:var(--ink);vector-effect:non-scaling-stroke}.ruler-ticks .t-min{stroke-width:1px;opacity:.35}.ruler-ticks .t-mid{stroke-width:1.2px;opacity:.55}.ruler-ticks .t-major{stroke-width:2px;opacity:.85}.ruler-ink{background:var(--syl-a);transform-origin:0;width:100%;height:3px;transform:scaleX(var(--p));border-radius:3px;position:absolute;top:-1.5px;left:0}.ruler-level,.ruler-sticker{left:calc(var(--at,-100) * 1%);white-space:nowrap;transition:color .2s,background-color .2s,opacity .2s,filter .2s;position:absolute;transform:translate(-50%)}.ruler-level{letter-spacing:.02em;color:var(--ink-soft);border-radius:999px;padding:1px 7px;font-size:12px;font-weight:700;top:20px}.ruler-level[data-level=Beginner]{transform:translate(-12px)}.ruler-level[data-level=B2]{transform:translate(calc(12px - 100%))}.ruler-level.reached{background:var(--highlight);color:#1f2b6c;animation:.45s cubic-bezier(.3,1.8,.5,1) ruler-pop}.ruler-level[data-level=Beginner].reached{color:var(--ink);background:0 0;animation:none}.ruler-level[data-level=B2].reached{animation-name:ruler-pop-end}.ruler-sticker{filter:grayscale();opacity:.4;font-size:17px;line-height:1;top:18px}.ruler-sticker.reached{filter:none;opacity:1;animation:.6s cubic-bezier(.3,1.6,.5,1) ruler-hop}@keyframes ruler-pop{40%{transform:translate(-50%)scale(1.35)}}@keyframes ruler-pop-end{40%{transform:translate(calc(12px - 100%))scale(1.35)}}@keyframes ruler-hop{35%{transform:translate(-50%)translateY(-10px)rotate(-12deg)scale(1.4)}}.ruler-pen{left:calc(var(--p) * 100%);pointer-events:none;filter:drop-shadow(0 4px 5px #1f2b6c40);width:40px;height:40px;position:absolute;top:0;transform:translate(-10px,-33px)}.ruler-pen .pen-body{fill:#1f2b6c}.ruler-pen .pen-grip{fill:#11184a}.ruler-pen .pen-nib{fill:#d9a520}.ruler-pen .pen-slit{stroke:#7a5a08;stroke-width:1.4px}.ruler-pen .pen-clip{fill:#c9ced9}:root[data-theme=dark] .ruler-pen .pen-body{fill:#e8ebff}body:has(.ruler) .to-top{bottom:calc(var(--ruler-h) + 46px)}@media (width<=640px){body:has(.ruler){--ruler-h:40px}.ruler-track{margin:0 22px}.ruler-ticks .t-min{display:none}.ruler-level{padding:1px 6px;font-size:11px;top:18px}.ruler-sticker{font-size:15px;top:16px}.ruler-pen{width:28px;height:28px;transform:translate(-7px,-23px)}body:has(.ruler) .sticky{bottom:calc(var(--ruler-h) + 28px);transform:translateY(calc(100% + var(--ruler-h) + 48px))}body:has(.ruler) .sticky.show{transform:none}body:has(.ruler) .to-top{bottom:calc(var(--ruler-h) + 96px)}}@media (prefers-reduced-motion:reduce){.ruler-level.reached,.ruler-sticker.reached{animation:none}}
