:root{--paper:#f4eee2;--paper-deep:#ebe3d3;--card:#fbf8f1;--ink:#1c1d2b;--ink-soft:#45443f;--muted:#6d6a63;--rule:#1c1d2b1f;--rule-soft:#1c1d2b0f;--rule-strong:#1c1d2b38;--seal:#d33a26;--gold:#b8862f;--shadow:0 1px 1px #3c280a0a, 0 12px 32px -12px #3c280a2e, 0 40px 80px -40px #3c280a40;--serif:var(--font-instrument-serif);--sans:var(--font-geist);--mono:var(--font-geist-mono);--kanji:"Noto Serif JP", "Hiragino Mincho ProN", "Yu Mincho", serif;color-scheme:light}:root[data-theme=dark]{--paper:#11100e;--paper-deep:#0b0a09;--card:#1a1916;--ink:#f1e9da;--ink-soft:#cdc4b4;--muted:#958f84;--rule:#f1e9da1f;--rule-soft:#f1e9da0d;--rule-strong:#f1e9da3d;--seal:#ff6a4d;--gold:#e8c27a;--shadow:0 1px 1px #0003, 0 12px 32px -12px #0009, 0 40px 80px -40px #000000b3;color-scheme:dark}*,:before,:after{box-sizing:border-box}html{background:var(--paper);-webkit-text-size-adjust:100%}body{background:var(--paper);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased;margin:0;font-size:17px;line-height:1.6;transition:background-color .4s,color .4s;overflow-x:clip}a{color:inherit}button{font:inherit;color:inherit}code{font-family:var(--mono);font-size:.86em}p code,dd code{background:var(--rule-soft);border:1px solid var(--rule);border-radius:5px;padding:.08em .36em}::selection{background:color-mix(in srgb, var(--seal) 28%, transparent)}:focus-visible{outline:2px solid var(--seal);outline-offset:3px}.sr-only{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.grain{z-index:100;pointer-events:none;opacity:.32;mix-blend-mode:multiply;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.35 0 0 0 0 0.3 0 0 0 0 0.22 0 0 0 0.55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");position:fixed;inset:0}:root[data-theme=dark] .grain{opacity:.22;mix-blend-mode:screen;filter:invert()}.nav{z-index:50;background:color-mix(in srgb, var(--paper) 78%, transparent);-webkit-backdrop-filter:blur(14px)saturate(1.2);border-bottom:1px solid var(--rule-soft);justify-content:space-between;align-items:center;gap:16px;padding:14px clamp(16px,4vw,40px);display:flex;position:sticky;top:0}.nav-brand{align-items:center;gap:12px;text-decoration:none;display:inline-flex}.nav-logo{flex:none;width:36px;height:36px;display:block}.nav-logo-dark,:root[data-theme=dark] .nav-logo-light{display:none}:root[data-theme=dark] .nav-logo-dark{display:block}.nav-name{font-family:var(--serif);letter-spacing:-.01em;font-size:26px;line-height:1}.nav-links{align-items:center;gap:4px;display:flex}.nav-links a,.nav-icon{height:36px;color:var(--ink-soft);cursor:pointer;background:0 0;border:0;border-radius:999px;justify-content:center;align-items:center;padding:0 12px;font-size:15px;text-decoration:none;transition:background-color .2s,color .2s;display:inline-flex}.nav-icon{width:36px;padding:0}.nav-links a:hover,.nav-icon:hover{color:var(--ink);background:var(--rule-soft)}.theme-toggle .icon-sun,:root[data-theme=dark] .theme-toggle .icon-moon{display:none}:root[data-theme=dark] .theme-toggle .icon-sun{display:block}.hero{text-align:center;flex-direction:column;align-items:center;padding:clamp(24px,4.5vh,56px) clamp(16px,4vw,40px) 0;display:flex;position:relative}.eyebrow{font-family:var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0 0 clamp(8px,2vh,20px);font-size:12.5px}.eyebrow [lang=ja]{font-family:var(--kanji);letter-spacing:.2em;color:var(--seal)}.eyebrow i{font-family:var(--serif);letter-spacing:0;text-transform:none;color:var(--ink);font-size:1.35em;font-style:italic}.hero-writing{flex-direction:column;align-self:stretch;align-items:center;display:flex;position:relative}.hero-headline{z-index:1;text-align:center;flex-direction:column;align-items:center;max-width:100%;font-size:min(clamp(52px,8vw,124px),16.9492vw - clamp(16px,4vw,40px)/2.95);line-height:1.06;display:flex;position:relative}.hero-headline-ink{justify-items:center;max-width:100%;padding-bottom:.14em;display:grid}.hero-headline-ink>*{grid-area:1/1;max-width:100%}.hero-headline-ghost{font-family:var(--font-parisienne);white-space:pre;color:var(--ink);opacity:.1;pointer-events:none;user-select:none}:root[data-theme=dark] .hero-headline-ghost{opacity:.13}.hero-headline-ghost[data-fading]{animation:4.2s cubic-bezier(.5,0,.75,.4) .3s forwards ghost-fade}@keyframes ghost-fade{to{opacity:0}}.write-placeholder{visibility:hidden;white-space:pre;max-width:100%;display:block;overflow:hidden}.hero-kanji{z-index:0;width:1em;color:var(--seal);opacity:.13;pointer-events:none;font-size:clamp(240px,34vw,480px);line-height:1;position:absolute;top:50%;left:50%;transform:translate(-50%,-52%)rotate(-6deg)}:root[data-theme=dark] .hero-kanji{opacity:.16}.replay{z-index:2;font-family:var(--mono);letter-spacing:.04em;color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:999px;align-items:center;gap:8px;padding:6px 12px;font-size:12px;transition:color .2s,background-color .2s;display:inline-flex;position:absolute;bottom:0;right:-12px}.replay:hover{color:var(--ink);background:var(--rule-soft)}.replay:disabled{opacity:0}.lede{max-width:640px;color:var(--ink-soft);text-wrap:pretty;margin:clamp(8px,1.5vh,16px) 0 0;font-size:clamp(17px,1.5vw,20px);line-height:1.6}.cta{flex-wrap:wrap;justify-content:center;align-items:center;gap:12px;margin-top:clamp(16px,2.6vh,28px);display:flex}.greetings{grid-template-columns:repeat(7,minmax(0,1fr));gap:12px;width:100%;max-width:1240px;margin-top:clamp(24px,4.5vh,48px);display:grid}.greeting{border:1px solid var(--rule);background:color-mix(in srgb, var(--card) 80%, transparent);border-radius:18px;flex-direction:column;min-height:clamp(128px,17vh,164px);margin:0;padding:14px 16px 12px;display:flex;box-shadow:0 1px 1px #3c280a08;container-type:inline-size}.greeting-ink{font-size:min(calc(clamp(34px, 3.2vw, 46px) * var(--scale)), calc(100cqi / var(--width,.01)));white-space:nowrap;flex:1;place-items:center;line-height:1.3;display:grid}.greeting-ink>*{animation:.6s both fade-in}.greeting-spinner{border:1.5px solid var(--muted);opacity:.35;border-right-color:#0000;border-radius:50%;width:18px;height:18px;animation:.6s both fade-in,1s linear infinite spin}.greeting figcaption{line-height:1.45;font-family:var(--mono);letter-spacing:.02em;color:var(--muted);flex-direction:column;font-size:11px;display:flex}.greeting figcaption span:first-child{color:var(--ink-soft)}.button{border:1px solid var(--rule-strong);border-radius:999px;align-items:center;gap:8px;height:46px;padding:0 22px;font-size:15.5px;font-weight:500;text-decoration:none;transition:transform .2s,background-color .2s,border-color .2s;display:inline-flex}.button:hover{border-color:var(--ink);transform:translateY(-1px)}.button-primary{border-color:var(--ink);background:var(--ink);color:var(--paper)}.button-primary svg{transition:transform .2s}.button-primary:hover svg{transform:translate(3px)}.install{border:1px dashed var(--rule-strong);background:color-mix(in srgb, var(--card) 60%, transparent);height:46px;font-family:var(--mono);cursor:pointer;border-radius:999px;align-items:center;gap:10px;padding:0 8px 0 18px;font-size:14px;display:inline-flex}.install-prompt{color:var(--seal)}.install-state{text-align:center;background:var(--rule-soft);color:var(--muted);text-transform:uppercase;letter-spacing:.06em;border-radius:999px;padding:5px 10px;font-size:11.5px;display:inline-grid}.install-state>*,.install-state:before,.install-state:after{grid-area:1/1}.install-state:before{content:attr(data-copied);visibility:hidden}.install-state:after{content:attr(data-failed);visibility:hidden}.chapter{max-width:1240px;margin:0 auto;padding:clamp(72px,11vh,128px) clamp(16px,4vw,40px) 0}.chapter-head{gap:14px;max-width:760px;margin-bottom:clamp(28px,4vh,44px);display:grid}.chapter-num{font-family:var(--mono);letter-spacing:.14em;color:var(--seal);font-size:13px}.chapter-num:after{content:"";vertical-align:middle;background:var(--seal);opacity:.6;width:40px;height:1px;margin-left:12px;display:inline-block}.chapter-head h2{font-family:var(--serif);letter-spacing:-.025em;text-wrap:balance;margin:0;font-size:clamp(40px,5vw,72px);font-weight:400;line-height:1}.chapter-head h2 em{color:var(--seal)}.chapter-head p{max-width:600px;color:var(--ink-soft);text-wrap:pretty;margin:0;font-size:17px}.controlled{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;display:grid}.controlled-card{border:1px solid var(--rule);background:var(--card);min-height:300px;box-shadow:var(--shadow);border-radius:24px;flex-direction:column;gap:16px;margin:0;padding:28px;display:flex}.controlled-ink{text-align:center;flex:1;place-items:center;font-size:clamp(34px,3.4vw,50px);line-height:1.35;display:grid}.controlled-ink-script{font-size:clamp(38px,3.8vw,56px)}.controlled-card figcaption{justify-content:space-between;align-items:baseline;gap:12px;font-size:13.5px;font-weight:500;display:flex}.controlled-card figcaption code{color:var(--muted);font-size:12px;font-weight:400}@keyframes tegaki-view-progress{0%{--tegaki-progress:0}to{--tegaki-progress:1}}.scroll-linked{animation-name:tegaki-view-progress;animation-timing-function:linear;animation-fill-mode:both;animation-timeline:view();animation-range:cover 10% cover 70%}.scrubber{font-family:var(--mono);align-items:center;gap:14px;font-size:12.5px;display:flex}.scrubber code{white-space:pre}.scrubber-total{color:var(--muted)}.scrubber input{appearance:none;cursor:pointer;background:0 0;flex:1;height:18px;margin:0}.scrubber input::-webkit-slider-runnable-track{background:linear-gradient(90deg, var(--seal) var(--fill), var(--rule) var(--fill));border-radius:3px;height:3px}.scrubber input::-moz-range-track{background:linear-gradient(90deg, var(--seal) var(--fill), var(--rule) var(--fill));border-radius:3px;height:3px}.scrubber input::-webkit-slider-thumb{border:2px solid var(--card);background:var(--seal);width:16px;height:16px;box-shadow:0 0 0 1px var(--seal);appearance:none;border-radius:50%;margin-top:-6.5px}.scrubber input::-moz-range-thumb{border:2px solid var(--card);background:var(--seal);width:12px;height:12px;box-shadow:0 0 0 1px var(--seal);border-radius:50%}.scripts-stage{border:1px solid var(--rule);background:radial-gradient(ellipse at 50% 42%, color-mix(in srgb, var(--seal) 7%, transparent), transparent 60%), var(--card);min-height:min(60vh,540px);box-shadow:var(--shadow);border-radius:28px;grid-template-rows:1fr auto;padding:clamp(20px,3vw,36px);display:grid;position:relative;overflow:hidden}.scripts-stage:before{content:"";background-image:linear-gradient(var(--rule-soft) 1px, transparent 1px), linear-gradient(90deg, var(--rule-soft) 1px, transparent 1px), repeating-linear-gradient(90deg, var(--rule) 0 6px, transparent 6px 14px), repeating-linear-gradient(0deg, var(--rule) 0 6px, transparent 6px 14px);pointer-events:none;background-position:50%,50%,0 42%,50% 0;background-repeat:repeat,repeat,no-repeat,no-repeat;background-size:72px 72px,72px 72px,100% 1px,1px 100%;position:absolute;inset:0;mask-image:radial-gradient(at 50% 45%,#000 20%,#0000 72%)}.scripts-word{text-align:center;place-items:center;font-size:clamp(76px,13vw,196px);line-height:1.25;display:grid;position:relative}.scripts-word>*{animation:.4s both fade-in}.scripts-loading{font-family:var(--mono);color:var(--muted);font-size:13px;animation:1.4s ease-in-out infinite pulse}.scripts-caption{flex-wrap:wrap;align-items:baseline;gap:8px 20px;animation:.5s both rise;display:flex;position:relative}.scripts-gloss{font-family:var(--serif);align-items:baseline;gap:12px;font-size:26px;display:inline-flex}.scripts-native{color:var(--seal)}.scripts-caption p{color:var(--ink-soft);flex:320px;margin:0;font-size:15px}.scripts-caption code{color:var(--muted);font-size:12px}.scripts-tabs{scrollbar-width:none;gap:6px;margin-top:18px;padding-bottom:4px;display:flex;overflow-x:auto}.scripts-tabs button{border:1px solid var(--rule);height:40px;color:var(--ink-soft);cursor:pointer;background:0 0;border-radius:999px;flex:none;padding:0 16px;font-size:14.5px;transition:background-color .25s,color .25s,border-color .25s;position:relative;overflow:hidden}.scripts-tabs button:hover{border-color:var(--rule-strong);color:var(--ink)}.scripts-tabs button.active{border-color:var(--ink);background:var(--ink);color:var(--paper)}.scripts-tab-progress{background:var(--seal);transform-origin:0;width:100%;height:2px;position:absolute;bottom:0;left:0;transform:scaleX(0)}.scripts-tab-progress[data-done]{animation:1.6s linear forwards fill}.plugs{grid-template-columns:repeat(12,minmax(0,1fr));gap:16px;display:grid}.plug{--fg:var(--ink);isolation:isolate;min-height:300px;color:var(--fg);box-shadow:var(--shadow);border-radius:24px;flex-direction:column;justify-content:space-between;margin:0;padding:26px 28px;display:flex;position:relative;overflow:hidden}.plug-ink{z-index:1;min-width:0;font-size:var(--size);text-align:center;white-space:pre;flex:1;place-items:center;line-height:1.2;display:grid;position:relative}.plug-ink>*{grid-area:1/1;animation:.6s both fade-in}.plug figcaption{z-index:2;justify-content:space-between;align-items:baseline;gap:12px;font-size:13.5px;font-weight:500;display:flex;position:relative}.plug figcaption code{opacity:.62;font-size:12px;font-weight:400}.plug-uses a{color:inherit;text-decoration:underline dotted;text-decoration-color:color-mix(in srgb, currentColor 45%, transparent);text-underline-offset:3px}.plug-uses a:hover,.plug-uses a:focus-visible{text-decoration-style:solid;text-decoration-color:currentColor}.plug-neon{--fg:#ffd6ea;background-color:#120c0e;background-image:radial-gradient(60% 55% at 50% 48%,#ff3d8b33,#0000 70%),radial-gradient(#0000 35%,#050203d9 100%),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='60'%3E%3Crect width='120' height='60' fill='%23100a0c'/%3E%3Crect x='1.5' y='1.5' width='57' height='27' rx='2' fill='%23291a1c'/%3E%3Crect x='61.5' y='1.5' width='57' height='27' rx='2' fill='%23241618'/%3E%3Crect x='-28.5' y='31.5' width='57' height='27' rx='2' fill='%232c1c1d'/%3E%3Crect x='31.5' y='31.5' width='57' height='27' rx='2' fill='%23221517'/%3E%3Crect x='91.5' y='31.5' width='57' height='27' rx='2' fill='%23291a1c'/%3E%3C/svg%3E");background-size:auto,auto,90px 45px;grid-column:span 7;min-height:420px}.plug-stitch{--fg:#2a3a55;background:linear-gradient(#ffffff12 1px,#0000 1px) 0 0/28px 28px,linear-gradient(90deg,#ffffff12 1px,#0000 1px) 0 0/28px 28px,#3f6b5a;grid-column:span 5;min-height:420px}.plug-stitch:before{content:"";z-index:0;aspect-ratio:1;background:radial-gradient(circle,#0000 62%,#503c1e29 100%),repeating-linear-gradient(0deg,#7864461a 0 1px,#0000 1px 3px),repeating-linear-gradient(90deg,#78644614 0 1px,#0000 1px 3px),#f1e9da;border-radius:50%;width:min(84%,350px);position:absolute;top:46%;left:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 9px #c99a5e,0 0 0 10px #a97a42,0 0 0 15px #d8ad73,0 0 0 16px #9c6e38,0 18px 30px 10px #00000059}.plug-hoop-screw{z-index:1;background:linear-gradient(#e9e6df,#9a968d 60%,#6f6b63);border-radius:5px;width:34px;height:22px;position:absolute;top:calc(46% - min(42%,175px) - 26px);left:50%;transform:translate(-50%);box-shadow:0 2px 4px #00000059}.plug-stitch .plug-ink{margin-bottom:8%}.plug-stitch figcaption{color:#e6efe9}.plug-order{--fg:#1c1d2b;background:radial-gradient(at 30% 20%,#fff9,#0000 60%),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.012 0.09' numOctaves='3' seed='4'/%3E%3CfeColorMatrix values='0 0 0 0 0.45 0 0 0 0 0.38 0 0 0 0 0.25 0 0 0 0.16 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23f)'/%3E%3C/svg%3E"),#f5efe1;grid-column:span 4}.plug-foil{--fg:#e9c77b;text-align:center;background:radial-gradient(at 50% 30%,#ffffff0d,#0000 60%),#10291f;grid-column:span 4}.plug-foil:before{content:"";pointer-events:none;border:1px solid #e9c77b73;border-radius:16px;position:absolute;inset:12px;box-shadow:inset 0 0 0 4px #10291f,inset 0 0 0 5px #e9c77b40}.plug-foil-top,.plug-foil-bottom{z-index:1;font-family:var(--serif);letter-spacing:.02em;color:#e9c77bb8;font-size:15px;font-style:italic;position:relative}.plug-foil-top{margin-top:6px}.plug-foil-bottom{font-family:var(--mono);letter-spacing:.22em;text-transform:uppercase;order:1;font-size:10.5px;font-style:normal}.plug-foil figcaption{order:2;margin-top:14px}.plug-annotate{--fg:#1d2a5c;box-shadow:0 1px 1px #3c280a14, 8px 14px 22px -10px #3c280a59, var(--shadow);background:linear-gradient(170deg,#fff08a,#ffe45c 60%,#f7d64a);border-radius:3px 3px 22px;grid-column:span 4;transform:rotate(-1.4deg)}.plug-tape{z-index:2;backdrop-filter:blur(1px);background:#ffffff73;width:108px;height:30px;position:absolute;top:-8px;left:50%;transform:translate(-50%)rotate(2.5deg);box-shadow:0 1px 2px #00000014}.plug-annotate figcaption{font-family:var(--mono);font-size:12px}.plug-burn{--fg:#3a2414;background:radial-gradient(at 50% 45%,#0000 45%,#6e401659 100%),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='p'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.02' numOctaves='4' seed='9'/%3E%3CfeColorMatrix values='0 0 0 0 0.5 0 0 0 0 0.3 0 0 0 0 0.1 0 0 0 0.22 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23p)'/%3E%3C/svg%3E"),#ecd9b0;grid-column:span 5}.plug-spray{--fg:#ff2e7e;background:radial-gradient(at 20% 110%,#00000059,#0000 55%),radial-gradient(at 90% -10%,#ffffff14,#0000 50%),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260'%3E%3Cfilter id='c'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' seed='3'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.35 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23c)'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='400' height='400'%3E%3Cfilter id='s'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.008' numOctaves='3' seed='12'/%3E%3CfeColorMatrix values='0 0 0 0 0.1 0 0 0 0 0.1 0 0 0 0 0.1 0 0 0 0.4 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23s)'/%3E%3C/svg%3E"),#6e716f;grid-column:span 7}.plug-spray:before{content:"";z-index:-1;background:linear-gradient(90deg,#0000 calc(66% - 1px),#00000040 calc(66% - 1px) 66%,#ffffff14 66% calc(66% + 1px),#0000 calc(66% + 1px));position:absolute;inset:0}.plug-spray figcaption{color:#eceae4}.plug-path{--fg:#c7321f;background:#f8f3e8;grid-column:span 4;min-height:340px}:root[data-theme=dark] .plug-path{background:#efe7d6}.plug-path [data-tegaki=root]{justify-self:unsafe center;translate:0 -3.52em;width:max-content!important;max-width:none!important}.plug-path .plug-ink{grid-template-columns:minmax(0,1fr);transform:rotate(-6deg);mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='m'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.55' numOctaves='2' seed='5'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -11 0 0 0 7.2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23m)'/%3E%3C/svg%3E")}.plug-path .plug-ink:before,.plug-path .plug-ink:after{content:"";aspect-ratio:1;border:.09em solid;border-radius:50%;grid-area:1/1;width:8.9em}.plug-path .plug-ink:after{border-width:.06em;width:5.5em}.plug-stamp-mark{aspect-ratio:1;width:1.45em;font-family:var(--kanji);place-items:center;font-size:1.85em;font-weight:700;line-height:1;display:grid}.plug-quill{--fg:#1d2a5c;background:repeating-linear-gradient(#0000 0 43px,#1d2a5c17 43px 44px),radial-gradient(at 70% 30%,#ffffffb3,#0000 60%),#f7f0e0;grid-column:span 8}.plug-ink3d{--fg:#2b2440;background:radial-gradient(70% 60% at 50% 18%,#ffffffe6,#0000 70%),linear-gradient(#efe9f6 0%,#f7f3fb 58%,#e6def0 100%);grid-column:span 12;min-height:340px}.own{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:16px;margin-top:16px;display:grid}.own-code{position:relative}.own-code pre{height:100%;padding:44px 26px 22px;font-size:13px}.own-label,.own-sheet:after{z-index:1;font-family:var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-size:11.5px;position:absolute;top:16px;left:20px}.own-side{flex-direction:column;gap:12px;display:flex}.own-sheet{min-height:280px;box-shadow:var(--shadow);background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='r'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.7' numOctaves='2' seed='7'/%3E%3CfeColorMatrix values='0 0 0 0 0.4 0 0 0 0 0.35 0 0 0 0 0.3 0 0 0 0.18 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23r)'/%3E%3C/svg%3E"),#f4efe4;border-radius:16px;flex:1;place-items:center;display:grid;position:relative}.own-sheet:after{content:"Output";color:#8b857a}.own-ink{white-space:pre;color:#0078bf;justify-self:stretch;justify-items:center;font-size:clamp(64px,7vw,108px);line-height:1.1;display:grid}.own-side .own-usage{padding:14px 18px;font-size:13px}@media (width<=960px){.plugs>*{grid-column:span 12}.own{grid-template-columns:minmax(0,1fr)}}.typeit-wrap{grid-template-columns:minmax(0,1fr) 200px;align-items:start;gap:24px;display:grid;position:relative}.typeit{--typeit-size:clamp(32px, 4.4vw, 56px)}.typeit-toolbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px;display:flex}.typeit-fonts{border:1px solid var(--rule);background:color-mix(in srgb, var(--card) 70%, transparent);border-radius:999px;padding:4px;display:inline-flex}.typeit-fonts button,.typeit-clear{height:34px;color:var(--ink-soft);cursor:pointer;background:0 0;border:0;border-radius:999px;padding:0 14px;font-size:14px;transition:background-color .2s,color .2s}.typeit-fonts button.active{background:var(--ink);color:var(--paper)}.typeit-clear:hover,.typeit-fonts button:not(.active):hover{color:var(--ink);background:var(--rule-soft)}.typeit-card{--margin:clamp(36px, 5vw, 64px);min-height:5.2lh;padding:.5lh clamp(20px, 3vw, 40px) .7lh calc(var(--margin) + clamp(14px, 2vw, 24px));box-shadow:var(--shadow);cursor:text;background-color:var(--card);background-image:linear-gradient(90deg, transparent calc(var(--margin) - 1px), color-mix(in srgb, var(--seal) 45%, transparent) calc(var(--margin) - 1px) var(--margin), transparent var(--margin)), repeating-linear-gradient(to bottom, transparent 0 calc(1lh - 1px), var(--rule) calc(1lh - 1px) 1lh);background-position:0 .5lh;border-radius:6px;line-height:1.4;position:relative}.typeit-card [data-tegaki=overlay]{outline:none;min-height:4lh;caret-color:var(--seal)!important}.typeit-placeholder{top:.5lh;left:calc(var(--margin) + clamp(14px, 2vw, 24px));font-family:var(--serif);color:var(--muted);pointer-events:none;font-size:.7em;font-style:italic;line-height:2;position:absolute}.marginalia{color:var(--seal);padding-top:120px;position:relative}.marginalia-arrow{fill:none;stroke:currentColor;stroke-width:2.2px;stroke-linecap:round;stroke-linejoin:round;width:120px;height:80px;margin-top:6px;margin-left:-12px}.marginalia-arrow path{stroke-dasharray:200;stroke-dashoffset:0}@supports (animation-timeline:view()){.marginalia-arrow path{animation-name:draw;animation-timing-function:linear;animation-fill-mode:both;animation-timeline:view();animation-range:entry 40% cover 50%}}.marginalia-note{transform-origin:0;font-size:34px;line-height:1.1;transform:rotate(-5deg)}.chapter-split{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);align-items:center;gap:clamp(32px,5vw,72px);display:grid}.chapter-split .chapter-head{margin-bottom:0}.code{border:1px solid var(--rule);background:var(--card);font-family:var(--mono);border-radius:16px;margin:0;padding:20px 22px;font-size:13.5px;line-height:1.7;overflow-x:auto}.code code{font-size:inherit}.astro-code,.astro-code span{color:var(--shiki-light)}:root[data-theme=dark] .astro-code,:root[data-theme=dark] .astro-code span{color:var(--shiki-dark)}.code-inline{margin-top:8px}.chat{border:1px solid var(--rule);background:var(--card);height:520px;box-shadow:var(--shadow);border-radius:28px;flex-direction:column;display:flex;overflow:hidden}.chat-head{border-bottom:1px solid var(--rule-soft);font-family:var(--mono);letter-spacing:.04em;color:var(--muted);align-items:center;gap:10px;padding:16px 22px;font-size:12.5px;display:flex}.chat-dot{background:#37b36b;border-radius:50%;width:8px;height:8px;box-shadow:0 0 0 4px #37b36b26}.chat-head button{font-family:var(--mono);color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:999px;margin-left:auto;padding:4px 10px;font-size:12px}.chat-head button:hover{color:var(--ink);background:var(--rule-soft)}.chat-log{scrollbar-width:thin;flex-direction:column;flex:1;gap:18px;padding:24px 22px;display:flex;overflow-y:auto}.chat-msg{animation:.35s both rise}.chat-user{background:var(--ink);max-width:78%;color:var(--paper);border-radius:20px 20px 6px;align-self:flex-end;padding:10px 16px;font-size:15px;line-height:1.45}.chat-assistant{align-self:flex-start;max-width:92%;font-size:clamp(26px,2.6vw,32px);line-height:1.3}.chat-thinking{gap:5px;padding:6px 2px;display:flex}.chat-thinking span{background:var(--muted);border-radius:50%;width:7px;height:7px;animation:1.1s ease-in-out infinite pulse}.chat-thinking span:nth-child(2){animation-delay:.15s}.chat-thinking span:nth-child(3){animation-delay:.3s}.chat-input{border:1px solid var(--rule);color:var(--muted);border-radius:999px;margin:0 16px 16px;padding:13px 18px;font-size:14.5px}.ship-tabs{scrollbar-width:none;gap:6px;margin-bottom:14px;display:flex;overflow-x:auto}.ship-tabs button{border:1px solid var(--rule);height:38px;color:var(--ink-soft);cursor:pointer;background:0 0;border-radius:999px;flex:none;padding:0 15px;font-size:14px;transition:background-color .2s,color .2s,border-color .2s}.ship-tabs button:hover{color:var(--ink);border-color:var(--rule-strong)}.ship-tabs button[aria-selected=true]{border-color:var(--ink);background:var(--ink);color:var(--paper)}.ship-body{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:16px;display:grid}.ship-pane{height:100%;display:none}.ship-pane .code{height:100%;min-height:260px;padding:26px 28px;font-size:14px}.ship[data-fw=react] [data-fw-pane=react],.ship[data-fw=svelte] [data-fw-pane=svelte],.ship[data-fw=vue] [data-fw-pane=vue],.ship[data-fw=solid] [data-fw-pane=solid],.ship[data-fw=astro] [data-fw-pane=astro],.ship[data-fw=wc] [data-fw-pane=wc],.ship[data-fw=vanilla] [data-fw-pane=vanilla]{display:block}.ship-output{border:1px solid var(--rule);background:radial-gradient(circle, var(--rule) 1px, transparent 1.2px) 0 0 / 18px 18px, var(--card);border-radius:16px;place-items:center;min-height:260px;display:grid;position:relative}.ship-output-label{font-family:var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-size:11.5px;position:absolute;top:16px;left:18px}.ship-output-ink{justify-self:stretch;justify-items:center;font-size:56px;line-height:1.2;display:grid}.ship-links{flex-wrap:wrap;gap:8px 28px;margin-top:22px;font-size:15px;display:flex}.ship-links a{color:var(--ink-soft);border-bottom:1px solid var(--rule-strong);text-decoration:none;transition:color .2s,border-color .2s}.ship-links a:hover{color:var(--seal);border-color:var(--seal)}.faq{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 48px;margin:0;display:grid}.faq-item{border-top:1px solid var(--rule);padding:24px 0}.faq dt{font-family:var(--serif);color:var(--ink);text-wrap:balance;margin-bottom:8px;font-size:24px;line-height:1.2}.faq dd{color:var(--ink-soft);text-wrap:pretty;margin:0;font-size:16px}@media (width<=760px){.faq{grid-template-columns:minmax(0,1fr)}}.finale{text-align:center;flex-direction:column;align-items:center;padding:clamp(96px,16vh,180px) clamp(16px,4vw,40px) clamp(72px,12vh,120px);display:flex}.finale-writing{justify-content:center;align-self:stretch;align-items:flex-end;display:flex;position:relative}.finale-line{max-width:100%;font-size:min(clamp(56px,10.5vw,168px),15.873vw - clamp(16px,4vw,40px)/3.15);line-height:1.15}.cta-center{margin-top:40px}.footer{border-top:1px solid var(--rule);max-width:1240px;color:var(--muted);flex-wrap:wrap;justify-content:space-between;gap:16px;margin:0 auto;padding:28px clamp(16px,4vw,40px) 40px;font-size:14px;display:flex}.footer a{text-decoration:none}.footer a:hover{color:var(--ink)}.footer-links{flex-wrap:wrap;gap:20px;display:flex}@keyframes fade-in{0%{opacity:0}}@keyframes rise{0%{opacity:0;transform:translateY(8px)}}@keyframes pulse{50%{opacity:.3}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes fill{to{transform:scaleX(1)}}@keyframes draw{0%{stroke-dashoffset:200px}}@media (width<=960px){.greetings{flex-wrap:wrap;justify-content:center;display:flex}.greeting{flex:0 0 calc(25% - 9px)}.controlled,.chapter-split,.ship-body,.typeit-wrap{grid-template-columns:minmax(0,1fr)}.marginalia{display:none}}@media (width<=600px){body{font-size:16px}.nav-links a{padding:0 9px}.plug{padding:22px}.chat{height:480px}.install{justify-content:center;width:100%}.scripts-stage{min-height:400px}.greetings{scroll-snap-type:x mandatory;scrollbar-width:none;grid-template-columns:none;grid-auto-columns:46%;grid-auto-flow:column;width:calc(100% + 32px);margin-inline:-16px;padding-inline:16px;scroll-padding-inline:16px;display:grid;overflow-x:auto}.greeting{scroll-snap-align:start}.replay{align-self:flex-end;position:static}}