@import url('./tokens.css');
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;font-size:16px;line-height:1.6}a{color:inherit;text-underline-offset:4px}button,input,select{font:inherit}button,a,input,select,summary{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{opacity:.6;cursor:wait}button[hidden]{display:none}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #855108;outline-offset:5px}.wrap{width:min(1120px,calc(100% - 80px));margin-inline:auto}.preview-banner{text-align:center;background:#eeebdc;font-size:12px;letter-spacing:.03em;padding:8px 16px;color:#575546}.preview-banner span{margin:0 10px}.site-header{display:flex;align-items:center;justify-content:space-between;padding-block:27px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;font-size:22px;font-weight:700;letter-spacing:-.8px;text-decoration:none}.brand-mark{display:inline-flex;position:relative;align-items:center;justify-content:center;width:39px;height:39px;background:var(--purple);border-radius:13px;color:white;margin-right:12px;font:italic 35px Georgia;line-height:1}.brand-mark span{position:absolute;right:3px;top:1px;font:15px Arial;color:#e5eba7}.brand-dot{color:#756d96}.site-header nav{display:flex;gap:32px;font-size:13px}.site-header nav a{text-decoration:none}.site-header nav a:hover{text-decoration:underline}.hero{display:grid;grid-template-columns:1.1fr 1fr;gap:64px;align-items:center;padding-block:76px 80px}.eyebrow{font-size:12px;letter-spacing:1.8px;font-weight:700;color:var(--muted);text-transform:uppercase;margin:0 0 22px}.hero .eyebrow span{color:var(--purple);font-size:21px;vertical-align:middle;margin-right:8px}h1,h2,h3,p{margin-top:0}h1{font:normal clamp(46px,5vw,66px)/1.08 Georgia,'Times New Roman',serif;letter-spacing:-2.2px;margin-bottom:25px}em{color:var(--purple);font-weight:normal}h2{font:normal 34px/1.2 Georgia,serif;letter-spacing:-.8px}h3{font-size:18px;line-height:1.4}.lede{font-size:17px;line-height:1.8;color:var(--muted);max-width:580px}.hero-link{display:inline-flex;gap:38px;align-items:center;margin-top:12px;font-size:14px;font-weight:700;text-decoration:none;border-bottom:1px solid;padding-bottom:7px}.conversation-art{position:relative;min-height:330px;padding:36px 12px 0 16px;background:radial-gradient(ellipse,#ecebd9 0%,#f7f6ee00 69%)}.art-label{display:block;font-size:12px;letter-spacing:2px;color:var(--muted);margin-left:30px;margin-bottom:24px}.bubble{font:normal 28px/1.3 Georgia,serif;padding:22px 28px;box-shadow:0 7px 0 #24262606}.bubble span{display:block;font:12px Arial;margin-top:14px;letter-spacing:.2px}.bubble-one{border:1px solid #dedfd0;border-radius:23px 23px 23px 4px;background:white;width:79%;transform:rotate(-4deg)}.bubble-one span{color:var(--muted)}.bubble-two{border-radius:23px 23px 4px 23px;background:var(--purple);color:#fff;position:relative;margin:-2px 0 0 74px;transform:rotate(3deg);padding-block:26px}.bubble-two span{color:#e5e0ff}.conversation-art>p{font-size:12px;text-align:right;color:var(--muted);margin:26px 20px 0}.orbit{position:absolute;font-size:58px;color:#89904f;line-height:1;z-index:1}.orbit-one{right:3px;top:18px;transform:rotate(15deg)}.orbit-two{left:10px;bottom:42px;font-size:45px;color:#9e6948}.discovery{scroll-margin-top:30px}.section-heading{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:25px;gap:20px}.section-heading .eyebrow{margin-bottom:12px}.section-heading h2{margin:0}.section-heading>p{color:var(--muted);font-size:13px;margin:0 0 3px}.finder{background:#fff;border:1px solid var(--line);border-radius:18px;padding:27px 30px 0;box-shadow:0 4px 15px #35332703}.finder>label{font-size:12px;font-weight:bold;display:block;margin-bottom:7px}.search-row{display:flex;gap:10px;margin-bottom:26px}.search-row input{min-width:0;flex:1;padding:15px 18px;border:1px solid #cfcec4;border-radius:8px;background:#fafaf6;color:var(--ink)}.search-row input::placeholder{color:#6a6a64}.primary,.secondary{border-radius:8px;padding:13px 22px;min-height:46px;font-size:13px;font-weight:700;display:inline-flex;gap:23px;align-items:center;justify-content:center}.primary{border:1px solid var(--purple);background:var(--purple);color:white}.primary:hover{background:#342f57}.secondary{border:1px solid #c8c6bd;background:transparent;color:var(--ink)}.filter-grid{display:grid;grid-template-columns:1fr 1.4fr;gap:36px;padding-bottom:25px}fieldset{border:0;padding:0;margin:0;min-width:0}legend{font-size:12px;font-weight:700;padding:0;margin-bottom:10px}.quiet{color:var(--muted);font-weight:normal}.segments{display:flex;background:#f4f3ef;border:1px solid #e7e6de;border-radius:8px;padding:4px;gap:4px}.segments label{position:relative;flex:1;display:block;cursor:pointer}.segments input{position:absolute;opacity:0;width:1px;height:1px}.segments span{display:block;padding:9px 8px;text-align:center;font-size:13px;border-radius:5px;white-space:nowrap}.segments input:checked+span{background:#e7e4f2;color:#3f365e;box-shadow:0 1px 3px #3526470a;font-weight:bold}.segments input:focus-visible+span{outline:3px solid #855108;outline-offset:2px}.more-filters{border-top:1px solid #eeede6;font-size:12px;padding:15px 0}.more-filters summary{cursor:pointer;width:fit-content}.secondary-filters{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;padding:16px 0 8px}.secondary-filters label{font-weight:bold}.secondary-filters select{display:block;width:100%;border:1px solid #cecdc5;border-radius:6px;background:#fff;margin-top:6px;padding:9px;font-size:13px;color:var(--ink)}.finder-foot{display:flex;align-items:center;justify-content:space-between;gap:16px;border-top:1px solid #eeede6;padding:14px 0}.finder-foot p{font-size:12px;color:var(--muted);margin:0}.text-button{border:0;background:none;color:var(--muted);font-size:12px;text-decoration:underline;padding:8px 0}.results-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:31px 0 17px}.results-heading h3,.results-heading p{margin:0}.results-heading p{font-size:12px;color:var(--muted)}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.expression-card{position:relative;isolation:isolate;border:1px solid var(--line);border-radius:13px;padding:22px 23px;display:flex;flex-direction:column;background:#fafaf5;min-height:270px}.card-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:23px}.category-label{font-size:12px;color:#51496c;background:#ece9f2;padding:4px 8px;border-radius:4px}.card-number{font:italic 16px Georgia;color:#5d614e}.expression-card h3{font:16px/1.5 Arial,sans-serif;letter-spacing:0;color:var(--muted);margin-bottom:13px}.expression-card h3 a{text-decoration:none}.expression-card h3 a:hover{text-decoration:none}.sample{color:var(--ink);font:25px/1.3 Georgia,serif;letter-spacing:-.5px;flex:1}.card-bottom{border-top:1px solid var(--line);padding-top:15px;display:flex;justify-content:space-between;align-items:center;gap:5px}.card-bottom>span{font-size:12px;color:var(--muted)}.card-bottom a{font-size:12px;font-weight:bold;text-decoration:none}.gentle-note{display:flex;align-items:center;gap:25px;margin-block:60px 72px;border-block:1px solid var(--line);padding-block:28px}.gentle-note>span:first-child{font-size:40px;color:#777e43}.gentle-note h2{font-size:26px;margin:0 0 5px}.gentle-note p{font-size:13px;color:var(--muted);margin:0}.note-tag{font-size:12px;letter-spacing:1.2px;margin-left:auto;max-width:120px;color:var(--muted)}.site-footer{display:flex;justify-content:space-between;gap:20px;padding-bottom:35px}.site-footer p{font-size:12px;color:var(--muted);margin:5px 0}.footer-brand{font:20px Georgia;text-decoration:none}.site-footer>div:last-child{text-align:right}.site-footer>div:last-child>a{font-size:12px}.skip{position:absolute;top:-100px;background:white;padding:10px;z-index:10}.skip:focus{top:0}.detail{max-width:850px;padding-block:40px 70px}.back-link{display:inline-block;font-size:13px;margin-bottom:40px;text-decoration:none}.detail h1{font-size:55px}.detail>.eyebrow{margin-bottom:15px}.detail .finder{margin-top:30px;padding-top:25px}.selected-expression{background:#ece9f2;border:1px solid #ded9eb;border-radius:16px;padding:32px;margin-top:24px}.selected-expression blockquote{font:35px/1.4 Georgia;margin:0 0 20px;overflow-wrap:anywhere}.selected-expression>p:not(.eyebrow){font-size:13px;color:#514967}.actions{display:flex;gap:12px;flex-wrap:wrap}.selected-expression #selection-status{margin:18px 0 0}.static-context{margin-block:40px}.static-context h2{font-size:27px;margin-top:25px;margin-bottom:10px}.related-links{display:flex;gap:15px;flex-wrap:wrap}.related-links a{border:1px solid var(--line);border-radius:7px;padding:12px 18px;text-decoration:none}.prose{max-width:850px;padding-block:70px 90px}.prose h1{font-size:53px}.prose h2{margin-top:35px;font-size:29px}.prose p{max-width:680px}.notice{border:1px solid var(--line);padding:20px;border-radius:8px;grid-column:1/-1;background:white}.notice h3{margin-bottom:5px}.notice p{margin-bottom:0}.secondary#load-more{margin-top:24px}
@media(max-width:800px){.wrap{width:calc(100% - 40px)}.hero{gap:20px;padding-block:50px}.conversation-art{padding-left:0}.bubble{font-size:23px;padding-inline:20px}.bubble-two{margin-left:35px}.cards{gap:10px}.expression-card{padding:18px}.card-bottom{align-items:start;flex-direction:column}.section-heading>p{max-width:180px}.filter-grid{gap:18px}.brand{font-size:19px}.site-header nav{gap:20px}.note-tag{display:none}}
@media(max-width:600px){.preview-banner{font-size:12px}.preview-banner span{margin:0 4px}.site-header{padding-block:20px}.site-header nav a:first-child{display:none}.site-header nav{font-size:12px}.hero{grid-template-columns:1fr;padding-block:45px 30px;gap:15px}.hero h1{font-size:52px}.hero .lede{font-size:16px}.conversation-art{max-width:360px;width:100%;margin-inline:auto;min-height:280px;padding-top:20px}.art-label{font-size:12px;margin-bottom:17px}.bubble{font-size:24px;padding-block:18px}.bubble-one{width:76%}.bubble-two{margin-left:60px}.orbit-one{top:7px;font-size:48px}.conversation-art>p{margin-top:20px}.orbit-two{bottom:36px}.section-heading{display:block;margin-top:20px}.section-heading h2{font-size:32px}.section-heading>p{max-width:none;margin-top:12px}.finder{padding:20px 17px 0}.search-row{flex-direction:column;margin-bottom:22px}.search-row input{font-size:14px;padding:13px 11px}.search-row .primary{justify-content:space-between}.filter-grid{grid-template-columns:1fr;gap:20px}.segments span{padding:11px 6px}.secondary-filters{grid-template-columns:1fr}.finder-foot{align-items:flex-start}.finder-foot p{max-width:220px;font-size:12px}.text-button{white-space:nowrap;font-size:12px;padding-top:0}.results-heading{align-items:flex-start}.results-heading h3{font-size:16px}.results-heading p{text-align:right;font-size:12px;max-width:170px}.cards{grid-template-columns:1fr;gap:14px}.expression-card{min-height:230px;padding:24px}.card-top{margin-bottom:20px}.card-bottom{flex-direction:row;align-items:center}.card-bottom>span{font-size:12px}.gentle-note{margin-block:40px;padding-block:25px;gap:15px}.gentle-note h2{font-size:24px}.gentle-note p{font-size:12px}.site-footer{display:block}.site-footer>div:last-child{text-align:left;margin-top:20px}.detail h1{font-size:44px}.selected-expression{padding:24px 20px}.selected-expression blockquote{font-size:29px}.actions{display:grid}.prose{padding-block:45px}.prose h1{font-size:42px}.detail{padding-top:25px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Keep supporting text readable, including browser-default small text. */
small{font-size:max(.8333em,12px)}
sub,sup{font-size:max(.75em,12px)}
.card-bottom{flex-wrap:wrap;gap:8px 12px}
/* Decorative hand-drawn marker loops stay clear of pointer and keyboard input. */
.choice-highlight{position:relative;padding:28px 22px 36px;isolation:isolate}
.choice-highlight legend{width:100%;text-align:center}
.choice-highlight::before{content:"";position:absolute;inset:4px -16px -16px;z-index:-1;pointer-events:none;background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20500%20160%22%20preserveAspectRatio%3D%22none%22%3E%3Cg%20fill%3D%22%23b5a5d8%22%20fill-opacity%3D%22.58%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M10%2084%20C2%2048%20108%2012%20242%208%20C376%202%20487%2027%20492%2073%20C501%20116%20398%20149%20263%20153%20C129%20158%2016%20132%2010%2084%20Z%20M17%2085%20C23%20122%20129%20150%20263%20146%20C393%20143%20487%20113%20484%2076%20C480%2037%20374%2014%20243%2017%20C119%2019%2014%2054%2017%2085%20Z%22%2F%3E%3Cpath%20d%3D%22M21%2055%20C106%2017%20305%207%20398%2033%20C411%2037%20422%2043%20423%2046%20C420%2047%20414%2043%20403%2040%20C307%2014%20127%2025%2040%2051%20C29%2054%2022%2058%2021%2055%20Z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") center/100% 100% no-repeat}
@media(max-width:600px){.site-header{flex-wrap:wrap;gap:18px}.site-header nav{width:100%;justify-content:space-between;gap:12px;font-size:12px}.site-header nav a:first-child{display:inline}.filter-grid{gap:28px}.choice-highlight{padding:28px 9px 36px}.choice-highlight::before{inset:5px -16px -15px}}
@media(max-width:600px){.hero{grid-template-columns:minmax(0,1fr)}}
@media(max-width:600px){.hero h1{font-size:clamp(40px,12vw,52px);overflow-wrap:anywhere}}

/* Clone the curved marker under each line of a wrapped original question. */
.original-question{background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20240%2028%22%20preserveAspectRatio%3D%22none%22%3E%3Cpath%20fill%3D%22%23b5a5d8%22%20fill-opacity%3D%22.58%22%20d%3D%22M3%2011%20C47%20-1%20159%20-2%20226%205%20L238%209%20L226%2015%20C131.5%2010.5%2079.5%2014%2013%2021%20Q0%2024%203%2011%20Z%22%2F%3E%3C%2Fsvg%3E") left bottom/100% .7em no-repeat;padding:0 1em .8em;margin-inline:-1em;line-height:1.9;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.bubble .original-question{display:inline;font:inherit;line-height:1.9;letter-spacing:inherit;margin-block:0;color:inherit}
.detail h1{line-height:1.4}

/* Leave room for the extended marker on large titles near the screen edge. */
@media(max-width:1200px){.detail h1{margin-inline:1em;overflow-wrap:anywhere}}

/* Stretch the native question link over the card; preserve independent controls. */
.expression-card h3 a::after{content:"";position:absolute;inset:0;z-index:1;border-radius:12px}
.expression-card .card-save,.expression-card .card-bottom a{position:relative;z-index:2}
.expression-card:has(h3 a:hover),.expression-card:has(.card-bottom a:hover){border-color:#b5a5d8;background:#f6f3fb}
.expression-card h3 a:focus-visible{outline:none}
.expression-card h3 a:focus-visible::after{outline:3px solid #855108;outline-offset:4px}

/* Compact, persistent direction/tone controls; the slot preserves page position. */
html{scroll-padding-top:calc(var(--choices-clearance,0px) + 24px)}
.filter-grid.is-pinned{position:fixed;z-index:100;top:var(--choices-top,0px);left:var(--choices-left);width:var(--choices-width);grid-template-columns:1fr 1.4fr;gap:20px;margin:0;padding:10px 20px 12px;background:#fff;border:1px solid #d9d3e5;border-top:0;border-radius:0 0 14px 14px;box-shadow:0 6px 18px #30264454}
.filter-grid.is-pinned .choice-highlight{padding:0;min-width:0}
.filter-grid.is-pinned .choice-highlight::before{display:none}
.filter-grid.is-pinned legend{margin-bottom:4px}
.filter-grid.is-pinned .segments span{display:flex;align-items:center;justify-content:center;min-height:44px;padding:7px 8px}
@media(max-width:600px){
 .filter-grid.is-pinned{grid-template-columns:1fr;gap:6px;padding:8px 10px;border-left:0;border-right:0;border-radius:0 0 10px 10px}
 .filter-grid.is-pinned fieldset{position:relative}
 .filter-grid.is-pinned legend{position:absolute;top:50%;left:0;transform:translateY(-50%);width:50px;margin:0;text-align:left;line-height:1.3;font-size:12px}
 .filter-grid.is-pinned legend .quiet{display:none}
 .filter-grid.is-pinned .segments{margin-left:56px;padding:3px;gap:3px}
 .filter-grid.is-pinned .segments span{font-size:12px;padding:6px 4px}
}

/* Locked alternatives are decorative placeholders, never blurred private text. */
.locked-preview{position:relative;min-height:125px;display:flex;align-items:center;justify-content:center;margin:18px 0 24px;overflow:hidden;border-radius:12px;background:#f5f1fc}
.locked-strokes{position:absolute;inset:23px 20px;display:flex;flex-direction:column;gap:14px;filter:blur(4px);opacity:.45;pointer-events:none}
.locked-strokes i{display:block;height:12px;width:92%;border-radius:99px;background:#b9a6d8}
.locked-strokes i:nth-child(2){width:75%}.locked-strokes i:nth-child(3){width:84%}
.premium-label{position:relative;background:#f5f1fc;color:#51416d;font:600 13px/1.4 var(--font-sans, sans-serif);padding:8px 12px;border:1px solid #d9ccec;border-radius:999px}
.card-unlock{background:#ede6f7;color:#483b69;border-color:#c9b7e3}
.locked-detail{max-width:760px}.locked-detail .locked-preview{max-width:550px;min-height:150px}.locked-detail .quiet{margin-top:16px}
@media(max-width:600px){.locked-preview{min-height:105px;margin:14px 0 18px}.locked-strokes{inset:20px 18px;gap:11px}}
/* Manual wording rotation: controls stay above the stretched card link. */
.rotation-controls{position:relative;z-index:2;display:flex;align-items:center;gap:8px 12px;flex-wrap:wrap;margin:-4px 0 20px}
.rotation-controls button,.card-personalize{font:600 12px/1.4 Arial,sans-serif;min-height:40px;border:0;background:transparent;color:var(--purple);padding:6px 0;text-align:left;cursor:pointer}
.rotation-controls button:hover,.card-personalize:hover{text-decoration:underline;text-underline-offset:4px}
.rotation-controls button[aria-disabled=true]{opacity:.65;cursor:progress}
.rotation-count{font-size:12px;color:var(--muted);white-space:nowrap}.delivery-label{font-size:12px;color:var(--purple);background:#eee8f7;border-radius:4px;padding:2px 7px}
.rotation-controls .copy-card{margin-left:auto}.card-personalize{position:relative;z-index:2}
.rotation-feedback{position:relative;z-index:2;font-size:12px;color:var(--purple);margin:0 0 14px}.rotation-feedback[hidden],.rotation-controls [hidden],.card-personalize[hidden]{display:none}
.rotation-announcement{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.selected-expression .rotation-controls{margin:0 0 18px}.expression-card .sample{margin-bottom:12px}
@media(max-width:600px){.rotation-controls{gap:5px 12px;margin-bottom:14px}.rotation-controls button,.card-personalize{min-height:44px}}

/* A compact companion to the Save button. Keep the same 12px text size. */
.rotation-controls .another-option{display:inline-flex;align-items:center;justify-content:center;gap:4px;min-height:36px;padding:5px 10px;border:1px solid #c6bfd7;border-radius:7px;background:#f2eff8;color:var(--purple);white-space:nowrap;text-decoration:none}
.rotation-controls .another-option:hover{background:#e8e2f2;text-decoration:none}
.rotation-controls .another-option[hidden]{display:none}
