@charset "UTF-8";
:root{--rose:#FBE7F6;--ink:#1C2C20;--leaf:#317D44;--canvas:#DFE2C1;--paper:#FFFFFF;--reading:"Numans","Trebuchet MS",sans-serif;--display:"Londrina Solid",Impact,"Arial Narrow",sans-serif;--gutter:52px}
*{box-sizing:border-box}
html{scroll-padding-top:28px}
body{margin:0;background:var(--rose);color:var(--ink);font-family:var(--reading);font-size:17px;line-height:1.7;-webkit-font-smoothing:antialiased}
button{font:inherit}
a{color:inherit;text-decoration-thickness:1.5px;text-underline-offset:5px;transition:color .16s,text-decoration-thickness .16s}
a:hover{color:var(--leaf);text-decoration-thickness:3px}
a:focus-visible,button:focus-visible{outline:3px solid var(--leaf);outline-offset:6px}
::selection{background:var(--canvas);color:var(--ink)}
.tangle-skip{position:absolute;top:8px;left:12px;z-index:50;padding:9px 15px;background:var(--paper);transform:translateY(-180%)}
.tangle-skip:focus{transform:none}
.tangle-frame{width:calc(100% - var(--gutter)*2);max-width:1512px;margin-inline:auto}
.tangle-mast{padding-top:16px;padding-bottom:0}
.tangle-wordmark{display:block;width:max-content;max-width:100%;font-family:var(--display);font-size:clamp(42px,5.85vw,96px);font-weight:400;line-height:1;letter-spacing:-1.5px;text-decoration:none}
.tangle-wordmark:hover{color:var(--leaf)}
.tangle-fork{display:grid;grid-template-columns:1.62fr 1fr;margin-top:15px;border-top:2px solid var(--ink);border-bottom:2px solid var(--ink)}
.tangle-read,.tangle-reconsider{min-height:59px;display:grid;grid-template-columns:118px 1fr;align-items:center;padding:8px 0;gap:16px}
.tangle-reconsider{border-left:2px solid var(--ink);padding-left:27px;grid-template-columns:145px 1fr;background:var(--canvas)}
.tangle-nav-name{font-family:var(--display);font-size:29px;line-height:1.1}
.tangle-nav-links{display:flex;gap:34px;align-items:center;flex-wrap:wrap}
.tangle-nav-links a{font-size:17px;line-height:1.3;text-decoration:none;display:inline-flex;align-items:center;gap:9px;padding-block:8px}
.tangle-nav-links a:hover{text-decoration:underline}
.tangle-icon{display:inline-block;width:21px;height:21px;flex-shrink:0;vertical-align:-3px;stroke-width:1.7}
h1,h2,h3{font-family:var(--display);font-weight:400;line-height:1.08;letter-spacing:0}
h1{font-size:clamp(42px,4.6vw,72px);margin:0}
/* A notched cloth banner crosses the whole photograph, with an open passage below. */
.tangle-opening{position:relative;isolation:isolate;display:grid;grid-template-areas:"headline" "passage" "mention";margin-top:20px;--photo:url("./terrace-opening.webp")}
.tangle-headline-band{grid-area:headline;position:relative;z-index:2;background:var(--leaf);color:var(--paper);padding:17px 0 17px;clip-path:polygon(0 0,100% 0,100% calc(100% - 29px),calc(100% - 43px) 100%,0 100%);border-top:8px solid var(--canvas);width:calc(100% - 140px)}
.tangle-headline-band .tangle-frame{width:auto;margin-left:var(--gutter);margin-right:44px}
.tangle-opening h1{font-size:clamp(44px,5vw,78px);line-height:1.02;max-width:1190px}
.tangle-hero-line{display:block}
.tangle-welcome{margin:11px 0 0;font-size:17px;line-height:1.5;max-width:1080px}
.tangle-photo{position:relative;isolation:isolate;background-color:var(--canvas);background-image:var(--photo);background-size:cover;background-position:center 53%;margin:0}
.tangle-hero-photo{position:absolute;inset:0;z-index:-1;--photo:url("./terrace-opening.webp");background-position:center 56%}
.tangle-hero-photo>.tangle-fabric{display:none}
.tangle-photo-passage{grid-area:passage;height:220px;position:relative}
.tangle-photo-passage:before,.tangle-photo-passage:after{content:"";position:absolute;background:var(--canvas);width:110px;height:110px;border-radius:50%;pointer-events:none}
.tangle-photo-passage:before{top:-55px;left:25%;background:var(--leaf)}
.tangle-photo-passage:after{bottom:-55px;right:23%}
.tangle-fabric{position:absolute;right:-12px;top:29%;width:66px;height:71px;background-image:var(--photo);background-size:550% 300%;background-position:95% 55%;background-color:var(--leaf);clip-path:polygon(0 0,100% 9%,81% 52%,93% 100%,0 88%);transform:rotate(-7deg);z-index:3}
.tangle-photo-passage .tangle-fabric{right:10px;top:31%;width:80px;filter:drop-shadow(-4px 5px 0 #1c2c2033)}
/* A continuous editorial band, without a control silhouette or interactive styling. */
.tangle-mention{grid-area:mention;position:relative;background:var(--canvas);z-index:2;padding:19px 0 20px;border-bottom:8px solid var(--leaf)}
.tangle-mention p{margin:0;font-size:17px;line-height:1.5}
.tangle-continuation{display:block;padding-top:7px;text-align:right}
.tangle-tail{display:block;position:absolute;right:var(--gutter);bottom:-17px;width:225px;height:65px;object-fit:contain;pointer-events:none;z-index:3}
/* One uninterrupted question sheet; the choices sit across its inner rule. */
.tangle-sheet{background:var(--paper);padding-block:38px 58px}
.tangle-sheet-intro{display:grid;grid-template-columns:1fr 1.05fr;gap:70px;align-items:center;padding-bottom:34px}
.tangle-sheet h2{font-size:44px;margin:0;max-width:560px}
.tangle-sheet h2 .tangle-icon{width:38px;height:38px;margin:0 13px 3px 0;color:var(--leaf)}
.tangle-sheet-intro p{margin:0;max-width:610px;font-size:17px}
.tangle-check{position:relative;border-top:4px solid var(--leaf);padding-block:34px 48px}
.tangle-question-top{display:grid;grid-template-columns:128px 1fr;gap:18px;align-items:start}
.tangle-question-number{font-family:var(--display);font-size:117px;line-height:.82;color:var(--leaf);transform:rotate(-6deg);padding-top:5px}
.tangle-question-type{display:inline-block;margin:0 0 14px;padding:3px 17px;background:var(--canvas);border-left:6px solid var(--leaf);font-size:17px;transform:rotate(-2deg)}
.tangle-check h3{font-size:clamp(35px,3.8vw,59px);max-width:1120px;margin:0 0 26px}
.tangle-choices{position:relative;margin-left:146px;display:grid;grid-template-columns:1fr 1fr;gap:20px;max-width:1150px}
.tangle-choices:before{content:"";position:absolute;top:40px;bottom:-25px;left:50%;width:2px;background:var(--ink);z-index:0}
.tangle-option{position:relative;display:flex;align-items:center;justify-content:space-between;gap:18px;text-align:left;color:var(--ink);padding:21px 25px;min-height:91px;background:var(--rose);border:2px solid var(--ink);border-radius:0;font-size:19px;line-height:1.4;cursor:pointer;box-shadow:5px 6px 0 var(--canvas);transition:background-color .16s,box-shadow .16s,transform .16s}
.tangle-option:nth-child(2){background:var(--canvas);transform:translateY(9px);box-shadow:5px 6px 0 var(--rose)}
.tangle-option:enabled:hover{background:var(--paper);box-shadow:2px 3px 0 var(--leaf);transform:translate(2px,2px)}
.tangle-option:nth-child(2):enabled:hover{transform:translate(2px,11px)}
.tangle-option:disabled{opacity:1;cursor:default}
.tangle-option[aria-pressed="true"]{background:var(--canvas);border-color:var(--leaf);box-shadow:5px 6px 0 var(--leaf)}
.tangle-option .tangle-choice-square{display:block;width:20px;height:20px;flex-shrink:0;border:2px solid var(--ink);background:var(--paper)}
.tangle-option[aria-pressed="true"] .tangle-choice-square{background:var(--leaf);border-color:var(--leaf);box-shadow:inset 0 0 0 3px var(--paper)}
.tangle-explanation{position:relative;margin:34px 0 0 146px;padding:4px 0 0 25px;max-width:1060px;border-left:2px solid var(--ink)}
.tangle-explanation p{margin:0 0 15px}
.tangle-response{padding:3px 5px;margin-inline:-5px;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.tangle-response.is-marked{background:var(--canvas);box-shadow:inset 0 -3px 0 var(--leaf)}
.tangle-reading-links{display:flex;flex-wrap:wrap;column-gap:30px;row-gap:12px;margin-top:21px;font-size:16px}
.tangle-reading-links a{display:inline-flex;gap:9px;align-items:baseline}
.tangle-coda{position:relative;padding:43px 44px 43px;margin:29px 0 56px 10%;max-width:1030px;background:var(--canvas);border-left:9px solid var(--leaf);box-shadow:-18px 17px 0 var(--paper)}
.tangle-coda h2{font-size:48px;margin:0 0 19px;max-width:700px}
.tangle-coda p{margin:0 0 18px;max-width:850px}
.tangle-coda p:last-child{margin-bottom:0}
/* Smaller, offset photographic openings keep each reading in the same world. */
.tangle-crumbs{font-size:16px;margin-top:26px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.tangle-crumbs span{font-size:16px}
.tangle-inner-stage{position:relative;margin-block:24px 42px}
.tangle-with-photo{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,.8fr);align-items:center;min-height:365px;padding-block:26px}
.tangle-inner-opening{position:relative;z-index:2;padding:22px 0}
.tangle-inner-opening h1{max-width:1060px;font-size:clamp(43px,4.65vw,71px)}
.tangle-with-photo .tangle-inner-opening{background:var(--rose);border-left:9px solid var(--leaf);padding:24px 34px 20px 27px;box-shadow:15px 14px 0 var(--canvas);margin-right:-54px;clip-path:polygon(0 0,calc(100% - 30px) 0,100% 31px,100% 100%,0 100%)}
.tangle-deck{max-width:890px;font-size:20px;line-height:1.6;margin:20px 0 0}
.tangle-inner-photo{position:relative;height:365px;margin:0 -20px 0 0;transform:rotate(2deg);background-position:center 56%;box-shadow:13px 14px 0 var(--canvas)}
.tangle-inner-photo:before,.tangle-inner-photo:after{content:"";position:absolute;background:var(--rose);width:98px;height:98px;border-radius:50%;z-index:2;pointer-events:none}
.tangle-inner-photo:before{top:-49px;left:36%}
.tangle-inner-photo:after{bottom:-49px;right:20%}
.tangle-img-results{--photo:url("./two-kites-results.webp")}
.tangle-img-how-long-to-work{--photo:url("./loosened-strings.webp")}
.tangle-img-dosage{--photo:url("./folded-fabric.webp")}
.tangle-img-effects{--photo:url("./line-and-loop.webp")}
.tangle-img-access{--photo:url("./separate-kites.webp")}
.tangle-img-about{--photo:url("./quiet-terrace.webp")}
.tangle-prose{padding-block:8px 52px;counter-reset:passages}
.tangle-inner .tangle-prose{position:relative;isolation:isolate}
.tangle-inner .tangle-prose:before{content:"";position:absolute;inset:0 calc(-1 * var(--gutter));background:var(--paper);z-index:-1}
.tangle-passage{display:grid;grid-template-columns:minmax(230px,.7fr) minmax(0,1.6fr);gap:76px;border-top:3px solid var(--leaf);padding-block:34px 38px;counter-increment:passages}
.tangle-passage h2{position:sticky;top:26px;align-self:start;font-size:39px;max-width:330px;margin:0;padding-left:42px}
.tangle-passage h2:before{content:counter(passages,decimal-leading-zero);position:absolute;left:-8px;top:4px;font-size:25px;color:var(--leaf);transform:rotate(-7deg)}
.tangle-paragraphs{max-width:820px}
.tangle-paragraphs p{margin:0 0 20px}
.tangle-paragraphs p:last-child{margin-bottom:0}
.tangle-bibliography{display:grid;grid-template-columns:1fr 1fr;gap:0 58px;margin-top:15px;counter-reset:sources}
.tangle-source{position:relative;padding:30px 15px 28px 39px;border-top:3px solid var(--leaf);counter-increment:sources}
.tangle-source:before{content:counter(sources,decimal-leading-zero);position:absolute;left:0;top:35px;font-family:var(--display);font-size:23px;color:var(--leaf)}
.tangle-source h2{font-size:32px;margin:0 0 14px}
.tangle-source-by{font-size:16px;color:var(--ink);margin:0 0 14px}
.tangle-source p{margin:0 0 13px;max-width:650px}
.tangle-foot{background:var(--canvas);border-top:9px solid var(--leaf);padding-block:42px 30px}
.tangle-foot-sentence{font-family:var(--display);font-size:39px;line-height:1.18;max-width:1000px;margin:0 0 30px}
.tangle-foot-nav{display:flex;flex-wrap:wrap;gap:12px 29px;font-size:16px;padding-bottom:28px}
.tangle-foot-bottom{display:flex;justify-content:space-between;align-items:center;gap:20px;border-top:2px solid var(--ink);padding-top:21px;font-size:16px}
.tangle-foot-bottom p{margin:0}
.tangle-lost{padding-block:64px 100px;max-width:800px}
.tangle-lost h1{font-size:70px}
.tangle-lost p{font-size:19px}
@media(min-width:1650px){.tangle-opening h1{max-width:1370px}}
@media(max-width:1050px){
 :root{--gutter:30px}
 .tangle-read{grid-template-columns:80px 1fr;gap:9px}
 .tangle-reconsider{grid-template-columns:114px 1fr;padding-left:18px;gap:9px}
 .tangle-nav-links{gap:16px}
 .tangle-nav-name{font-size:26px}
 .tangle-wordmark{letter-spacing:-.7px}
 .tangle-headline-band{width:calc(100% - 35px)}
 .tangle-passage{gap:35px;grid-template-columns:.8fr 1.4fr}
 .tangle-choices,.tangle-explanation{margin-left:92px}
 .tangle-question-top{grid-template-columns:74px 1fr}
 .tangle-question-number{font-size:78px}
 .tangle-with-photo{grid-template-columns:1.5fr .8fr}
 .tangle-with-photo .tangle-inner-opening{padding-left:20px;padding-right:24px}
 .tangle-deck{font-size:18px}
 .tangle-passage h2{font-size:34px}
}
@media(max-width:650px){
 :root{--gutter:20px}
 body{font-size:16px;line-height:1.7}
 .tangle-mast{padding-top:15px}
 .tangle-wordmark{font-size:clamp(26px,8.25vw,42px);letter-spacing:-.45px;line-height:1.05;white-space:nowrap}
 .tangle-fork{grid-template-columns:1.48fr 1fr;margin-top:13px}
 .tangle-read,.tangle-reconsider{min-height:71px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:5px;padding:6px 0}
 .tangle-reconsider{padding-left:14px}
 .tangle-nav-name{font-family:var(--reading);font-size:16px;line-height:1.25}
 .tangle-nav-links{gap:13px;flex-wrap:nowrap}
 .tangle-nav-links a{font-size:16px;line-height:1.25;gap:0;padding:4px 0}
 .tangle-nav-links .tangle-icon{display:none}
 .tangle-opening{grid-template-areas:"headline" "mention" "passage";margin-top:17px}
 .tangle-headline-band{width:100%;padding:17px 0 16px;border-top-width:6px;clip-path:none}
 .tangle-headline-band .tangle-frame{width:calc(100% - var(--gutter)*2);margin-inline:auto}
 .tangle-opening h1{font-size:29px;line-height:1.08;max-width:355px}
 .tangle-hero-photo{top:auto;height:75px;background-position:center 50%}
 .tangle-welcome{font-size:16px;line-height:1.45;margin:11px 0 0}
 .tangle-mention{padding:0 0 35px;border-bottom:0}
 .tangle-mention p{font-size:16px;line-height:1.38}
 .tangle-continuation{padding-top:7px}
 .tangle-tail{height:37px;width:135px;right:14px;bottom:-1px}
 .tangle-photo-passage{height:75px}
 .tangle-photo-passage:before,.tangle-photo-passage:after{width:52px;height:52px}
 .tangle-photo-passage:before{top:-26px;left:20%;background:var(--canvas)}
 .tangle-photo-passage:after{bottom:-26px;right:21%;background:var(--paper)}
 .tangle-fabric{right:-9px;width:35px;height:39px;top:24%}
 .tangle-photo-passage .tangle-fabric{width:41px;height:44px;right:5px;top:17px}
 .tangle-sheet{padding-block:30px 18px}
 .tangle-sheet-intro{display:block;padding-bottom:24px}
 .tangle-sheet h2{font-size:33px;margin-bottom:14px}
 .tangle-sheet h2 .tangle-icon{width:26px;height:26px;margin-right:9px}
 .tangle-sheet-intro p{font-size:16px}
 .tangle-check{padding-block:26px 31px;border-top-width:3px}
 .tangle-question-top{grid-template-columns:44px 1fr;gap:9px}
 .tangle-question-number{font-size:47px;padding-top:10px}
 .tangle-question-type{font-size:16px;margin-bottom:13px;padding:1px 9px;border-left-width:4px}
 .tangle-check h3{font-size:30px;line-height:1.1;margin-bottom:21px}
 .tangle-choices{margin-left:0;gap:11px}
 .tangle-option{font-size:16px;line-height:1.4;min-height:116px;align-items:flex-start;padding:13px 11px;gap:7px;flex-direction:column-reverse;justify-content:flex-end;box-shadow:3px 4px 0 var(--canvas)}
 .tangle-option:nth-child(2){transform:translateY(8px);box-shadow:3px 4px 0 var(--rose)}
 .tangle-option[aria-pressed="true"]{box-shadow:3px 4px 0 var(--leaf)}
 .tangle-option .tangle-choice-square{width:17px;height:17px;margin-bottom:3px}
 .tangle-explanation{margin:30px 0 0;padding:2px 0 0 14px;font-size:16px}
 .tangle-explanation p{margin-bottom:16px}
 .tangle-reading-links{display:flex;flex-direction:column;gap:14px;margin-top:20px;font-size:16px}
 .tangle-reading-links a{display:block}
 .tangle-reading-links .tangle-icon{margin-right:7px}
 .tangle-coda{padding:27px 19px;margin:19px 0 36px 8px;border-left-width:6px;box-shadow:-8px 10px 0 var(--paper)}
 .tangle-coda h2{font-size:35px}
 .tangle-crumbs{margin-top:20px;font-size:16px}
 .tangle-inner-stage{margin-block:20px 30px}
 .tangle-with-photo{display:block;min-height:0;padding:0}
 .tangle-inner-opening{padding:0}
 .tangle-inner-opening h1{font-size:39px;line-height:1.07}
 .tangle-with-photo .tangle-inner-opening{margin:0;padding:18px 16px 20px;border-left-width:6px;box-shadow:none;clip-path:polygon(0 0,calc(100% - 22px) 0,100% 22px,100% 100%,0 100%);background:var(--canvas)}
 .tangle-deck{font-size:18px;line-height:1.55;margin:18px 0 0}
 .tangle-inner-photo{height:155px;margin:0 2px 0 6px;transform:rotate(-2deg);box-shadow:7px 8px 0 var(--canvas)}
 .tangle-inner-photo:before,.tangle-inner-photo:after{width:58px;height:58px}
 .tangle-inner-photo:before{top:-29px;left:20%;background:var(--canvas)}
 .tangle-inner-photo:after{bottom:-29px;right:21%}
 .tangle-prose{padding-bottom:31px}
 .tangle-passage{display:block;padding-block:26px 27px}
 .tangle-passage h2{position:relative;top:auto;font-size:33px;max-width:100%;margin-bottom:19px;padding-left:37px}
 .tangle-passage h2:before{font-size:23px;left:0;top:3px}
 .tangle-paragraphs p{margin-bottom:20px}
 .tangle-bibliography{display:block;margin-top:0}
 .tangle-source{padding:25px 0 23px 32px}
 .tangle-source:before{top:29px;font-size:21px}
 .tangle-source h2{font-size:29px}
 .tangle-foot{padding-block:30px 24px;border-top-width:7px}
 .tangle-foot-sentence{font-size:30px;margin-bottom:24px}
 .tangle-foot-nav{gap:15px 23px}
 .tangle-foot-bottom{display:block;font-size:16px}
 .tangle-foot-bottom p{margin-bottom:13px}
 .tangle-lost{padding-block:39px 65px}
 .tangle-lost h1{font-size:44px}
}
@media(prefers-reduced-motion:reduce){a,.tangle-option{transition:none}}