:root{color-scheme:light;--paper:#faf9f6;--thumbnail:#f1efe9;--ink:#2b332e;--secondary:#6e756b;--line:#e0e0d4;--glass:rgba(255,255,255,.72);--shadow:0 6px 30px #343a2d0c,0 1px 4px #343a2d04;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit;color:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer;border:0;background:none}a{color:inherit;text-decoration:none}button:disabled{opacity:.27;cursor:default}button svg,a svg{display:block;width:24px;height:24px;flex:none}button:active:not(:disabled),.circle:active{transform:scale(.94)}button{transition:background .15s,transform .15s,opacity .15s}h1,h2,h3,p{margin:0}[hidden]{display:none!important}img{display:block;max-width:100%}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--ink);outline-offset:4px}.glass{background:var(--glass);border:1px solid #ffffffc9;box-shadow:var(--shadow);backdrop-filter:blur(24px) saturate(130%);-webkit-backdrop-filter:blur(24px) saturate(130%)}.topbar{display:grid;grid-template-columns:94px minmax(0,1fr) 94px;align-items:center;gap:8px;padding:14px 20px;width:100%;margin:0 auto;z-index:10}.topbar h1{font-size:17px;line-height:1.25;font-weight:650;text-align:center;letter-spacing:-.35px}.circle{display:grid;place-items:center;border-radius:50%;width:44px;height:44px;flex:none}.active{background:var(--ink)!important;color:var(--paper)!important}.library{max-width:960px;margin:auto}.library-header{position:sticky;top:0;z-index:20;background:linear-gradient(var(--paper) 65%,#faf9f6f2);backdrop-filter:blur(18px)}.library-header .topbar{grid-template-columns:minmax(0,1fr) auto;max-width:1000px;padding-top:max(16px,env(safe-area-inset-top))}.library-header .topbar h1{justify-self:start;text-align:left}.search-bar{padding:0 20px 14px;display:flex;gap:12px}.search-bar input{background:var(--thumbnail);border:1px solid transparent;width:100%;border-radius:16px;padding:13px 16px;min-width:0;font-size:16px;outline-offset:0}.search-bar button{font-size:14px}.collection{padding:4px 20px 48px}.knot-category+.knot-category{margin-top:32px}.category-title{font-size:19px;font-weight:600;letter-spacing:-.35px;margin:12px 0 8px}.collection[data-layout=grid] .category-title{margin-bottom:16px}.knot-row{display:flex;gap:20px;align-items:center;padding:12px 0;border-bottom:1px solid #e0e0d470;min-height:130px}.knot-row:hover .thumb{background:#eae7de}.thumb{width:106px;height:106px;background:var(--thumbnail);border-radius:20px;overflow:hidden;flex:none;transition:background .2s}.thumb img{width:100%;height:100%;object-fit:contain}.row-copy{min-width:0;flex:1}.row-copy h3{font-size:18px;letter-spacing:-.4px;font-weight:600;line-height:1.3}.row-copy p{font-size:13px;line-height:1.4;color:var(--secondary);margin-top:7px}.row-end{display:flex;align-items:center;gap:8px}.row-end svg{width:16px;height:16px;color:#9aa094}.collection[data-layout=grid] .category-knots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.collection[data-layout=grid] .knot-row{display:block;padding:0;min-height:0;border:0}.collection[data-layout=grid] .thumb{width:100%;height:auto;aspect-ratio:1;border-radius:18px}.collection[data-layout=grid] .row-copy,.collection[data-layout=grid] .row-end{display:none}.empty{padding:100px 24px;text-align:center}.empty h2{font-size:23px;margin:12px 0}.empty p{color:var(--secondary);line-height:1.6}.text-button{padding:12px 18px;border-radius:30px;background:var(--ink);color:var(--paper);margin-top:22px}.library-footer{border-top:1px solid #e0e0d460;margin:0 20px;padding:28px 0 36px;display:flex;justify-content:space-between;align-items:center;gap:16px;font-size:12px;color:var(--secondary)}.library-footer p{max-width:460px;line-height:1.6}.library-footer a{white-space:nowrap}.lesson{height:100svh;height:100dvh;position:relative;overflow:hidden}.lesson-header{position:absolute;top:env(safe-area-inset-top);left:0;right:0;z-index:4}.lesson .topbar{position:relative;max-width:none;padding-bottom:10px}.lesson .topbar h1{font-size:16px;max-width:430px;justify-self:center;text-wrap:balance}.viewport{position:absolute;inset:0;touch-action:none;cursor:grab}.viewport:active{cursor:grabbing}.viewport canvas{width:100%;height:100%;display:block;outline:none}.fallback-image{position:absolute;left:50%;top:42%;transform:translate(-50%,-50%);width:min(72vw,460px);mix-blend-mode:multiply}.loading{position:absolute;left:50%;top:46%;transform:translate(-50%,-50%);background:var(--paper);padding:12px 18px;border-radius:20px;color:var(--secondary);font-size:14px;z-index:1}.loading:before{content:"";width:12px;height:12px;border-radius:50%;border:2px solid var(--line);border-top-color:var(--ink);display:inline-block;margin-right:9px;vertical-align:-2px;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.error{max-width:320px;text-align:center;padding:24px;line-height:1.6;box-shadow:var(--shadow)}.error:before{display:none}.error button{display:block;margin:14px auto 0;font-weight:600;text-decoration:underline}.overlay{position:absolute;bottom:max(16px,env(safe-area-inset-bottom));left:20px;right:20px;display:flex;flex-direction:column;gap:12px;align-items:center;z-index:2;pointer-events:none}.caption,.transport{width:100%;max-width:430px;pointer-events:auto}.caption{border-radius:24px;padding:15px 17px;line-height:1.4}.caption-heading{display:flex;gap:12px;align-items:baseline;justify-content:space-between;margin-bottom:5px}.caption h2{font-size:15px;font-weight:600;line-height:1.35}.caption small{font-size:12px;color:var(--secondary);font-variant-numeric:tabular-nums;white-space:nowrap}.caption p{font-size:14px;color:var(--secondary);line-height:1.45}.transport{display:flex;flex-direction:column;gap:8px}.timeline{position:relative;height:30px;display:flex;align-items:center}.timeline input{position:relative;z-index:2;-webkit-appearance:none;appearance:none;width:100%;height:28px;background:transparent;margin:0;cursor:pointer;touch-action:none}.timeline input::-webkit-slider-runnable-track{height:5px;border-radius:6px;background:linear-gradient(to right,var(--ink) var(--fill,0%),#2b332e22 var(--fill,0%))}.timeline input::-moz-range-track{height:5px;border-radius:6px;background:#2b332e22}.timeline input::-moz-range-progress{height:5px;border-radius:6px;background:var(--ink)}.timeline input::-webkit-slider-thumb{-webkit-appearance:none;width:27px;height:27px;border-radius:50%;background:#fff;box-shadow:0 2px 9px #2b332e25;border:1px solid #f5f5ef;margin-top:-11px}.timeline input::-moz-range-thumb{width:25px;height:25px;border-radius:50%;background:#fff;box-shadow:0 2px 9px #2b332e25;border:1px solid #f5f5ef}.ticks{position:absolute;bottom:0;left:13px;right:13px;height:3px;pointer-events:none}.ticks span{position:absolute;width:3px;height:3px;border-radius:50%;background:#2b332e28;transform:translate(-50%)}.transport-buttons{display:flex;justify-content:space-between;align-items:center;gap:12px}.transport-buttons>.circle,.speed-control{width:52px;height:52px}.transport-buttons .play{width:62px;height:62px;background:var(--ink);color:var(--paper);border:1px solid var(--ink);box-shadow:0 5px 20px #2b332e12}.play svg{width:27px;height:27px}.speed-control{position:relative;z-index:3}.speed-control button{width:52px;height:52px;font-size:13px;font-weight:600;white-space:nowrap}.speed-menu{position:absolute;bottom:66px;right:0;padding:6px;min-width:110px;border-radius:20px;background:#faf9f6f2;box-shadow:0 10px 32px #2b332e25;backdrop-filter:blur(20px)}.speed-menu button{width:100%;height:40px;border-radius:12px;display:block;font-size:14px}.no-script{padding:20px;text-align:center;color:var(--secondary);font-size:14px}.not-found{max-width:600px;margin:15vh auto;padding:24px;text-align:center;line-height:1.7}.not-found h1{font-size:32px;margin:16px}.not-found a{display:inline-block}@media(min-width:700px){.library{max-width:960px}.library .topbar{padding:24px 28px}.topbar h1{font-size:20px}.collection{padding-left:28px;padding-right:28px}.category-knots{display:grid;grid-template-columns:1fr 1fr;column-gap:32px}.knot-row{gap:16px}.thumb{width:108px;height:108px}.collection[data-layout=grid] .category-knots{grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}.search-bar{padding-left:28px;padding-right:28px}.library-footer{margin-left:28px;margin-right:28px}.lesson .topbar{padding:22px 28px}.lesson .topbar h1{font-size:18px}.overlay{left:28px;right:28px;bottom:max(24px,env(safe-area-inset-bottom))}}@media(min-width:900px)and (min-aspect-ratio:1/1){.overlay{flex-direction:row;justify-content:space-between;align-items:flex-end;gap:32px}.caption,.transport{max-width:380px}}@media(max-height:530px)and (min-aspect-ratio:1/1){.lesson .topbar{padding:10px 20px}.lesson .topbar .circle{width:38px;height:38px}.topbar{grid-template-columns:86px minmax(0,1fr) 86px}.overlay{flex-direction:row;align-items:flex-end;gap:20px;bottom:max(10px,env(safe-area-inset-bottom))}.caption{max-width:45%;padding:11px 14px;border-radius:20px}.caption h2{font-size:13px}.caption p{font-size:12px}.transport{max-width:43%;gap:3px}.transport-buttons>.circle,.speed-control,.speed-control button{width:42px;height:42px}.transport-buttons .play{width:50px;height:50px}.transport-buttons{gap:6px}}@media(max-width:360px){.topbar{padding-left:14px;padding-right:14px;grid-template-columns:86px minmax(0,1fr) 86px;gap:4px}.topbar h1{font-size:15px}.overlay{left:14px;right:14px}.collection{padding-left:14px;padding-right:14px}.knot-row{gap:14px}.thumb{width:94px;height:94px}.row-copy h3{font-size:17px}}.topbar{grid-template-columns:44px minmax(0,1fr) auto}.topbar h1{min-width:0;justify-self:start;text-align:left}.topbar-actions{display:flex;align-items:center;gap:8px;justify-self:end}.mode-switch{display:flex;align-items:center;border-radius:28px;padding:3px;gap:2px}.mode-switch button{display:flex;align-items:center;justify-content:center;gap:7px;width:40px;height:40px;padding:0;border-radius:24px;font-size:13px;font-weight:550;color:var(--secondary)}.mode-switch svg{width:22px;height:22px}.mode-switch span{display:none}@media(min-width:700px){.topbar{grid-template-columns:1fr auto 1fr}.topbar h1{justify-self:center;text-align:center}.mode-switch button{width:auto;padding:0 14px}.mode-switch span{display:inline}}@media(max-width:360px){.topbar{grid-template-columns:40px minmax(0,1fr) auto;gap:6px}.topbar-actions{gap:6px}.topbar .circle{width:40px;height:40px}.mode-switch button{width:36px;height:36px}}.mode-switch .selected{background:var(--ink);color:var(--paper);box-shadow:none}.steps-view{position:absolute;inset:var(--lesson-header-height,72px) 0 0;overflow-y:auto;overscroll-behavior-y:contain;scrollbar-gutter:stable;scroll-padding-top:18px}.steps-page .lesson-header{background:var(--paper)}.step-canvas{width:100%;height:100%;display:block;pointer-events:none;-webkit-user-drag:none}.steps-hint{font-size:12px;color:var(--secondary);text-align:center;padding:6px 20px 20px;position:relative;z-index:2;background:var(--paper)}.related-knots{max-width:610px;margin:0 auto;padding:0 20px}.related-knots{padding-bottom:max(40px,env(safe-area-inset-bottom))}.related-knots h2{font-size:17px;font-weight:600;letter-spacing:-.2px;border-top:1px solid var(--line);padding-top:24px;margin-bottom:14px}.related-links{display:flex;flex-wrap:wrap;gap:8px}.related-links a{display:flex;align-items:center;gap:7px;padding:11px 14px;border-radius:18px;background:var(--thumbnail);font-size:13px;line-height:1.4}.related-links a:hover{background:#eae7de}.related-links svg{width:13px;height:13px;color:var(--secondary)}@media(min-width:900px)and (min-aspect-ratio:1/1){.related-knots{max-width:680px}}@media(max-height:530px)and (min-aspect-ratio:1/1){.related-knots{max-width:610px}}@media(max-width:360px){.related-knots{padding-left:14px;padding-right:14px}}.steps-status{position:relative;z-index:2;text-align:center;color:var(--secondary);font-size:14px;padding:16px 20px;background:var(--paper)}.steps-status button{font-weight:600;text-decoration:underline;margin-left:10px}.step-list{list-style:none;max-width:610px;margin:0 auto;padding:0 20px max(24px,env(safe-area-inset-bottom))}.step-card{margin:0 0 32px;scroll-margin-top:8px}.step-stage{position:relative}.step-model{height:clamp(240px,72vw,380px);background:var(--thumbnail);border-radius:26px;overflow:hidden;cursor:grab;touch-action:pan-y;user-select:none;-webkit-user-select:none}.step-model:active{cursor:grabbing}.step-copy{display:flex;gap:12px;padding:0 2px 14px;position:relative;z-index:2;background:var(--paper)}.step-number{font-size:12px;font-weight:600;width:27px;height:27px;display:grid;place-items:center;flex:none;border:1px solid var(--line);border-radius:50%;font-variant-numeric:tabular-nums;margin-top:-2px}.step-copy h2{font-size:16px;font-weight:600;letter-spacing:-.2px;line-height:1.4}.step-copy p{font-size:14px;color:var(--secondary);line-height:1.55;margin-top:5px}@media(min-width:900px)and (min-aspect-ratio:1/1){.step-list{max-width:680px;padding-top:10px}.step-card{margin-bottom:36px}.step-model{height:380px}.step-copy{padding-bottom:16px}.step-copy h2{font-size:19px}.step-copy p{font-size:15px}}@media(max-height:530px)and (min-aspect-ratio:1/1){.lesson .topbar{padding-bottom:5px}.mode-switch button{height:34px}.step-list{max-width:610px}.step-model{height:245px}.step-copy{padding-bottom:12px}}@media(max-width:360px){.step-list{padding-left:14px;padding-right:14px}.step-model{border-radius:22px}.step-copy{gap:10px}}.knot-page{max-width:1000px;margin:0 auto}.knot-header{position:sticky;top:0;z-index:10;background:#faf9f6ef;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}.knot-header .topbar{grid-template-columns:44px minmax(0,1fr) 44px;padding-top:max(16px,env(safe-area-inset-top))}.knot-header h1{justify-self:center;text-align:center}.knot-player{position:relative;margin:0 20px}.player-stage{position:relative;height:clamp(280px,44svh,480px);background:var(--thumbnail);border-radius:28px;overflow:hidden}.player-stage .viewport{touch-action:pan-y;user-select:none;-webkit-user-select:none}.player-actions{position:absolute;top:12px;right:12px;display:flex;gap:8px;z-index:3}.player-link{display:flex;align-items:center;gap:7px;padding:0 14px;border-radius:24px;height:44px;font-size:13px;font-weight:550}.player-link svg{width:21px;height:21px}.player-controls{display:flex;flex-direction:column;align-items:center;gap:6px;max-width:640px;margin:0 auto}.player-controls .caption{width:100%;max-width:none;min-height:86px;padding:16px 2px 2px;background:none;border:0;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}.player-controls .transport{width:100%;max-width:430px}.overview-copy{max-width:720px;margin:32px auto 0;padding:28px 24px 0;border-top:1px solid var(--line)}.knot-meta{font-size:13px;color:var(--secondary)}.knot-description{font-size:19px;line-height:1.55;letter-spacing:-.2px;margin-top:10px}.knot-facts{display:grid;gap:24px;margin-top:28px}.knot-facts h2{font-size:16px;line-height:1.4;font-weight:600;margin-bottom:8px}.knot-facts p,.knot-facts ul{font-size:15px;line-height:1.65;color:var(--secondary)}.knot-facts ul{padding-left:19px;margin:0}.knot-facts li+li{margin-top:6px}.knot-page .related-knots{max-width:720px;padding:0 24px max(48px,env(safe-area-inset-bottom));margin-top:32px}.page-mode-label{font-size:13px;color:var(--secondary);justify-self:end}.player-expanded{position:fixed;width:100%;overflow:hidden}.knot-player.is-expanded{position:fixed;inset:0;width:100%;height:100dvh;margin:0;background:var(--paper);z-index:100}.is-expanded .player-stage{position:absolute;inset:0;height:auto;border-radius:0;background:var(--paper)}.is-expanded .player-actions{top:max(16px,env(safe-area-inset-top));right:max(20px,env(safe-area-inset-right))}.is-expanded .player-controls{position:absolute;left:20px;right:20px;bottom:max(16px,env(safe-area-inset-bottom));max-width:none;margin:0;gap:12px;z-index:2;pointer-events:none}.is-expanded .caption{max-width:430px;min-height:0;padding:15px 17px;background:var(--glass);border:1px solid #ffffffc9;box-shadow:var(--shadow);backdrop-filter:blur(24px) saturate(130%);-webkit-backdrop-filter:blur(24px) saturate(130%)}@media(min-width:700px){.knot-header .topbar{padding:22px 28px}.knot-player{margin:0 28px}.knot-facts{grid-template-columns:1fr 1fr;gap:32px}.knot-description{font-size:22px}.player-controls{padding:0 4px}}@media(min-width:900px)and (min-aspect-ratio:1/1){.player-controls{max-width:none;flex-direction:row;justify-content:space-between;gap:32px;padding-top:16px}.player-controls .caption{max-width:420px;min-height:0;padding:0}.player-controls .transport{max-width:380px}.is-expanded .player-controls{left:28px;right:28px;bottom:max(24px,env(safe-area-inset-bottom));align-items:flex-end;padding:0}.is-expanded .caption{padding:15px 17px;max-width:380px}}@media(max-height:530px)and (min-aspect-ratio:1/1){.is-expanded .player-controls{flex-direction:row;align-items:flex-end;gap:20px;bottom:max(10px,env(safe-area-inset-bottom))}.is-expanded .caption{max-width:45%;padding:11px 14px;border-radius:20px}.is-expanded .transport{max-width:43%;gap:3px}.is-expanded .player-actions{top:max(10px,env(safe-area-inset-top))}}@media(max-width:360px){.knot-player{margin:0 14px}.player-stage{border-radius:22px}.overview-copy,.knot-page .related-knots{padding-left:18px;padding-right:18px}.player-actions{top:10px;right:10px}.is-expanded{margin:0}.is-expanded .player-controls{left:14px;right:14px}}@media(max-width:360px){.transport-buttons{gap:8px}.transport-buttons>.circle,.speed-control,.speed-control button{width:44px;height:44px}.transport-buttons .play{width:56px;height:56px}.speed-control{flex:none}}@media(min-width:900px)and (min-aspect-ratio:1/1){.player-controls{flex-direction:row-reverse;max-width:832px;margin-left:auto;margin-right:auto;justify-content:center;gap:32px}.player-controls .caption{flex:1;max-width:420px;min-width:0}.player-controls .transport{flex:1;max-width:380px;min-width:0}.is-expanded .player-controls{max-width:832px;margin-left:auto;margin-right:auto;flex-direction:row-reverse;justify-content:center;gap:32px}}.knot-about{margin-top:22px}.knot-about p,.knot-checks li,.tying-summary p{font-size:15px;line-height:1.75;color:var(--secondary)}.knot-about p+p{margin-top:16px}.knot-aliases{font-size:13px;line-height:1.6;color:var(--secondary);margin-top:10px}.knot-checks{margin-top:28px}.knot-checks h2{font-size:16px;font-weight:600;margin-bottom:10px}.knot-checks ul{padding-left:19px}.knot-checks li+li{margin-top:6px}.tying-summary,.knot-sources{border-top:1px solid var(--line);padding-top:18px;margin-top:24px;font-size:14px}.tying-summary summary,.knot-sources summary{cursor:pointer;line-height:1.5;font-weight:600}.tying-summary ol{padding-left:22px;margin-top:20px}.tying-summary li+li{margin-top:18px}.tying-summary h3{font-size:14px;margin-bottom:4px}.tying-summary a{display:inline-flex;align-items:center;gap:6px;margin-top:20px}.tying-summary a svg{width:15px;height:15px}.knot-sources{color:var(--secondary);font-size:13px}.knot-sources ul{padding-left:18px;margin-top:12px;line-height:1.8}.knot-sources a{text-decoration:underline;text-underline-offset:3px}