@font-face{font-family:'fraunces';
src:url('/fonts/Fraunces_400Regular.ttf') format('truetype');
font-style:normal;
font-weight:400;
font-display:swap}

@font-face{font-family:'fraunces';
src:url('/fonts/Fraunces_400Regular_Italic.ttf') format('truetype');
font-style:italic;
font-weight:400;
font-display:swap}

@font-face{font-family:'inter';
src:url('/fonts/Inter_400Regular.ttf') format('truetype');
font-style:normal;
font-weight:400;
font-display:swap}

@font-face{font-family:'inter';
src:url('/fonts/Inter_600SemiBold.ttf') format('truetype');
font-style:normal;
font-weight:600;
font-display:swap}

@font-face{font-family:'caveat';
src:url('/fonts/Caveat_400Regular.ttf') format('truetype');
font-style:normal;
font-weight:400;
font-display:swap}


:root{--ink:#292442;
--muted:#716a80;
--purple:#5b5ce2;
--coral:#ff5e5e;
--cream:#fffaf3;
--line:#e7dfd8;
--sage:#dfeddf}
*{box-sizing:border-box}
html{scroll-behavior:smooth;
scroll-padding-top:100px}
body{margin:0;
background:var(--cream);
color:var(--ink);
font-family:'inter',Arial,sans-serif;
font-size:16px;
line-height:1.65}
a{color:inherit;
text-decoration-thickness:1px;
text-underline-offset:5px}
a:focus-visible{outline:3px solid var(--purple);
outline-offset:5px;
border-radius:4px}
.skip{position:absolute;
top:-80px;
left:20px;
background:white;
padding:10px;
z-index:10}
.skip:focus{top:10px}
header{max-width:1320px;
margin:auto;
display:flex;
align-items:center;
justify-content:space-between;
padding:24px 44px;
gap:24px}
.brand{display:inline-flex;
align-items:center;
gap:9px;
font-size:27px;
font-weight:700;
letter-spacing:-1.4px;
text-decoration:none}
.brand-mark{background:var(--purple);
color:white;
display:inline-flex;
position:relative;
justify-content:center;
align-items:center;
width:36px;
height:36px;
border-radius:12px;
font:italic 34px 'fraunces',serif;
line-height:1}
.brand-mark span{color:#ffb1a2;
font:13px 'inter';
position:absolute;
right:3px;
bottom:1px}
nav{display:flex;
align-items:center;
gap:30px}
nav a{text-decoration:none;
font-size:13px;
font-weight:600}
.nav-cta{border:1px solid var(--ink);
border-radius:24px;
padding:10px 18px}
.nav-cta span{margin-left:12px}
.wrap{max-width:1232px;
margin:auto;
padding-left:44px;
padding-right:44px}
.hero{display:grid;
grid-template-columns:1fr 1fr;
gap:36px;
align-items:center;
min-height:710px;
padding-top:60px;
padding-bottom:75px}
.eyebrow{font-size:11px;
font-weight:700;
letter-spacing:2.2px;
color:var(--purple);
display:flex;
align-items:center;
gap:8px}
.dot{height:7px;
width:7px;
min-width:7px;
background:var(--coral);
border-radius:50%;
display:inline-block}
h1,h2,h3,p{margin-top:0}
h1,h2,h3{line-height:1.06}
h1,h2{font-family:'fraunces',Georgia,serif;
font-weight:400;
letter-spacing:-2px}
h1{font-size:clamp(60px,7.9vw,112px);
margin:24px 0 26px}
h1 em,h2 em{font-weight:400;
color:var(--purple)}
.lead{font-size:17px;
line-height:1.8;
max-width:460px;
color:#625970}
.hero-copy .lead{max-width:405px}
.actions{display:flex;
align-items:center;
gap:26px;
margin-top:32px}
.button{display:inline-flex;
align-items:center;
gap:35px;
background:var(--purple);
color:white;
border-radius:40px;
font-size:13px;
font-weight:700;
text-decoration:none;
padding:16px 25px;
box-shadow:0 5px 0 #e3dfef}
.button:hover{background:#4647c3}
.text-link{font-size:13px;
font-weight:700;
text-decoration:none;
border-bottom:1px solid currentColor;
padding-bottom:4px}
.availability{font-size:11px;
color:var(--muted);
margin-top:22px}
.scrapbook{position:relative;
min-height:540px;
background:radial-gradient(ellipse,#ede5f6 0%,transparent 68%)}
.scribble{position:absolute;
top:0;
right:10px;
font:italic 22px/1.1 'fraunces',serif;
transform:rotate(9deg);
color:var(--purple)}
.scribble span{font-size:48px;
position:absolute;
right:16px;
top:32px}
.chat-card{position:absolute;
top:70px;
left:0;
width:365px;
background:white;
border:1px solid #ece4e8;
border-radius:20px;
padding:20px;
box-shadow:0 15px 50px #3c265415;
transform:rotate(-5deg)}
.chat-title{display:flex;
align-items:center;
gap:10px;
padding-bottom:18px;
border-bottom:1px solid #f1edf0;
margin-bottom:18px;
font-size:12px}
.chat-title strong{display:block}
.chat-title small{display:block;
font-size:9px;
color:var(--muted)}
.avatar{height:34px;
width:34px;
border-radius:12px;
background:#eeecfb;
color:var(--purple);
font:bold 19px 'fraunces';
display:grid;
place-items:center}
.chat-dots{margin-left:auto;
font-size:9px;
letter-spacing:2px}
.bubble{font-size:12px;
line-height:1.6;
padding:11px 13px;
border-radius:12px;
margin-bottom:11px;
max-width:87%}
.you{background:#eeecff;
margin-left:auto;
border-bottom-right-radius:2px}
.partner{background:#f6f2ed;
border-bottom-left-radius:2px}
.butler-label{font-size:8px;
letter-spacing:1.3px;
font-weight:700;
display:flex;
align-items:center;
gap:6px;
color:var(--purple);
margin:16px 0 6px}
.mini-avatar{background:var(--purple);
color:white;
width:19px;
height:19px;
border-radius:50%;
display:grid;
place-items:center;
letter-spacing:0;
font:italic 12px 'fraunces'}
.butler{max-width:94%;
background:#fff7ef;
border:1px solid #f3e1d5}
.chat-bottom{text-align:center;
color:#8b8090;
font-size:8px;
padding-top:9px}
.note{position:absolute;
right:-5px;
top:335px;
width:260px;
background:#fff0be;
box-shadow:0 12px 35px #48371c18;
padding:30px 24px 25px;
transform:rotate(7deg)}
.tape{position:absolute;
top:-14px;
left:80px;
width:92px;
height:27px;
background:#ffc5b5b3;
transform:rotate(-3deg)}
.note-label{font-size:8px;
letter-spacing:1.6px;
font-weight:700;
margin-bottom:12px}
.note h2{font:italic 22px 'fraunces';
letter-spacing:-.5px;
margin-bottom:14px}
.note ul{list-style:none;
padding:0;
margin:0;
font-size:12px;
line-height:2}
.note li span{margin-right:6px}
.note-heart{position:absolute;
right:14px;
bottom:4px;
font:40px 'fraunces';
color:#dc6456}
.private-tag{position:absolute;
left:-18px;
top:440px;
background:#e4eee3;
border-radius:5px;
padding:11px 13px;
transform:rotate(-8deg);
font-size:11px;
box-shadow:0 8px 20px #4444440a}
.private-tag span{margin-right:6px}
.illustration-label{position:absolute;
left:20px;
bottom:-38px;
font-size:9px;
color:#867a8d}
.intro-band{max-width:1144px;
margin:35px auto 0;
padding:35px 0;
border-top:1px solid var(--line);
border-bottom:1px solid var(--line);
display:flex;
align-items:center;
justify-content:space-around;
gap:40px}
.intro-band p{font:25px/1.4 'fraunces';
margin:0}
.intro-band strong{font-weight:400;
color:var(--purple)}
.orbit{display:flex;
align-items:center;
gap:20px;
font:italic 26px 'fraunces'}
.orbit span{font:18px 'inter';
color:#a698ac}
.orbit b{display:grid;
place-items:center;
background:var(--purple);
color:white;
border-radius:50%;
width:62px;
height:62px;
font:italic 34px 'fraunces'}
.features{padding-top:110px;
padding-bottom:100px}
.section-heading h2,.butler-section h2{font-size:48px;
margin:18px 0 22px}
.section-heading>p:last-child{color:var(--muted);
font-size:14px}
.feature-grid{display:grid;
grid-template-columns:repeat(3,1fr);
gap:42px;
margin-top:50px}
.feature-grid article{padding-right:10px}
.feature-symbol{display:grid;
place-items:center;
width:50px;
height:50px;
border-radius:16px;
font-size:33px;
margin-bottom:24px}
.purple{background:#e9e7fd;
color:var(--purple)}
.coral{background:#ffe1d6;
color:#bb3c32}
.sage{background:#e3ede0;
color:#3c5b4b}
.feature-grid h3{font:25px 'fraunces';
letter-spacing:-.5px}
.feature-grid p{font-size:13px;
color:var(--muted);
max-width:310px}
.tag{font-size:10px;
letter-spacing:.2px;
border:1px solid var(--line);
border-radius:18px;
padding:5px 11px}
.butler-section{display:grid;
grid-template-columns:1fr 1fr;
gap:100px;
align-items:center;
padding-top:55px;
padding-bottom:100px}
.butler-portrait{position:relative;
min-height:390px;
background:#eae5f4;
border-radius:48% 48% 8px 8px;
display:grid;
place-items:center;
transform:rotate(-3deg)}
.butler-monogram{font:italic 210px 'fraunces';
color:var(--purple);
position:relative;
line-height:1}
.butler-monogram>span{position:absolute;
bottom:0;
right:-36px;
font:70px 'fraunces';
color:var(--coral);
transform:rotate(20deg)}
.portrait-spark{position:absolute;
top:40px;
left:35px;
font-size:65px;
color:#afa2db}
.portrait-caption{position:absolute;
bottom:26px;
left:30px;
font:italic 19px 'fraunces';
transform:rotate(-5deg)}
.butler-section>div>p:not(.eyebrow):not(.lead){font-size:12px;
color:var(--muted);
margin-bottom:26px}
.privacy-strip{display:flex;
align-items:center;
gap:28px;
padding-top:32px;
padding-bottom:32px;
border-top:1px solid var(--line);
border-bottom:1px solid var(--line)}
.privacy-strip>span{font:66px 'fraunces';
color:var(--purple)}
.privacy-strip h2{font-size:24px;
letter-spacing:-.5px;
margin-bottom:10px}
.privacy-strip p{font-size:12px;
color:var(--muted);
margin:0;
max-width:600px}
.privacy-strip .text-link{white-space:nowrap;
margin-left:auto;
font-size:11px}
.final-cta{text-align:center;
padding-top:110px;
padding-bottom:115px}
.final-cta .eyebrow{justify-content:center}
.final-cta h2{font-size:64px;
margin:20px 0}
.final-cta>p:not(.eyebrow){color:var(--muted);
font-size:14px;
margin-bottom:30px}
footer{max-width:1232px;
padding:40px 44px;
margin:auto;
border-top:1px solid var(--line);
display:grid;
grid-template-columns:1fr auto;
gap:10px 24px}
footer .brand{font-size:23px}
footer p{font-size:11px;
color:var(--muted);
grid-column:1;
grid-row:2;
margin:0}
footer nav{grid-column:2;
grid-row:1}
footer nav a{font-size:11px}
footer small{font-size:9px;
color:var(--muted);
grid-column:2;
grid-row:2;
text-align:right}
.page-hero{padding-top:75px;
padding-bottom:45px}
.page-hero h1{font-size:70px}
.page-hero .lead{max-width:690px}
.notice{display:flex;
align-items:flex-start;
gap:14px;
background:#eeebf8;
border-radius:16px;
padding:23px 27px;
max-width:760px;
margin-top:35px}
.notice .dot{margin-top:10px}
.notice strong{font-size:14px}
.notice p{margin:7px 0 0;
font-size:13px;
color:var(--muted)}
.platform-grid{display:grid;
grid-template-columns:1fr 1fr;
gap:24px;
margin-top:10px;
margin-bottom:65px}
.platform{border:1px solid var(--line);
border-radius:20px;
padding:35px}
.platform h2{font-size:32px;
letter-spacing:-1px}
.platform p:not(.eyebrow):not(.status){font-size:14px;
color:var(--muted);
max-width:420px}
.platform-icon{float:right;
font-size:35px;
color:var(--purple)}
.status{display:inline-block;
border-radius:20px;
background:#ece9f4;
padding:6px 13px;
font-size:11px;
color:#655885;
margin-bottom:0}
.reading{max-width:900px;
padding-top:15px;
padding-bottom:100px}
.reading h2{font-size:29px;
letter-spacing:-.6px;
margin-top:36px;
margin-bottom:18px}
.reading p{font-size:15px;
color:#665d70;
line-height:1.9}
.reading a{color:#4747bd}
.steps{padding-left:24px}
.steps li{padding-left:12px;
margin-bottom:25px}
.steps li::marker{color:var(--purple);
font-family:'fraunces';
font-size:24px}
.steps p{margin:8px 0}
.steps strong{font-size:15px}

@media(max-width:1000px){.hero{gap:10px;
grid-template-columns:1fr 1fr}
.chat-card{width:310px;
left:0}
.note{width:235px;
right:-5px;
top:355px}
.scrapbook{min-height:565px}
.scribble{right:0}
.private-tag{top:500px;
left:0}
.intro-band{margin-left:44px;
margin-right:44px}
.butler-section{gap:60px}
.privacy-strip{margin-left:44px;
margin-right:44px;
padding-left:0;
padding-right:0}
.privacy-strip .text-link{white-space:normal;
min-width:110px}
.actions{gap:18px}
.button{gap:17px}
.hero-copy .lead{font-size:15px}
.feature-grid{gap:25px}
.butler-section h2{font-size:40px}
}

@media(max-width:720px){header{padding:20px 22px}
header nav{gap:0}
header nav>a:not(.nav-cta){display:none}
.nav-cta{padding:9px 13px;
font-size:11px}
.brand{font-size:24px}
.wrap{padding-left:24px;
padding-right:24px}
.hero{display:block;
padding-top:45px;
padding-bottom:50px}
.hero h1{font-size:85px;
margin-top:20px}
.hero-copy .lead{max-width:400px;
font-size:16px}
.availability{max-width:300px;
font-size:10px}
.scrapbook{margin:38px auto 20px;
max-width:370px;
min-height:560px}
.chat-card{top:65px;
left:8px;
width:calc(100% - 34px)}
.scribble{top:0;
right:2px;
font-size:18px}
.note{top:360px;
right:0;
width:230px}
.private-tag{left:0;
top:530px;
font-size:10px}
.illustration-label{bottom:-28px;
font-size:8px}
.intro-band{margin:55px 24px 0;
padding:28px 0;
gap:20px;
justify-content:space-between}
.intro-band p{font-size:20px}
.orbit{gap:8px;
font-size:16px}
.orbit b{height:37px;
width:37px;
font-size:24px}
.orbit span{font-size:12px}
.features{padding-top:70px;
padding-bottom:40px}
.section-heading h2{font-size:42px}
.feature-grid{grid-template-columns:1fr;
gap:35px;
margin-top:35px}
.feature-grid article{border-bottom:1px solid var(--line);
padding-bottom:30px}
.feature-grid article:last-child{border:0}
.feature-grid p{max-width:100%;
font-size:14px}
.feature-symbol{float:left;
margin:0 20px 55px 0;
width:45px;
height:45px;
font-size:29px}
.feature-grid h3{font-size:24px}
.feature-grid .tag{margin-left:65px}
.butler-section{grid-template-columns:1fr;
gap:45px;
padding-top:0;
padding-bottom:60px}
.butler-portrait{max-width:330px;
width:100%;
margin:auto;
min-height:310px}
.butler-monogram{font-size:170px}
.butler-section h2{font-size:42px}
.privacy-strip{margin:0 24px;
display:grid;
grid-template-columns:35px 1fr;
padding:28px 0;
gap:15px}
.privacy-strip>span{font-size:43px;
align-self:start}
.privacy-strip h2{font-size:24px}
.privacy-strip .text-link{grid-column:2;
margin:0;
justify-self:start}
.final-cta{padding-top:65px;
padding-bottom:70px}
.final-cta h2{font-size:48px}
footer{padding:30px 24px;
grid-template-columns:1fr;
gap:14px}
footer nav{grid-row:3;
grid-column:1;
gap:24px}
footer small{grid-row:4;
grid-column:1;
text-align:left}
.page-hero{padding-top:45px;
padding-bottom:25px}
.page-hero h1{font-size:49px;
letter-spacing:-2px}
.page-hero .lead{font-size:16px}
.notice{padding:20px}
.platform-grid{grid-template-columns:1fr;
margin-top:5px;
gap:18px;
margin-bottom:35px}
.platform{padding:26px}
.reading{padding-top:0;
padding-bottom:60px}
.reading h2{font-size:27px}
.reading p{font-size:14px}
.eyebrow{font-size:10px;
letter-spacing:1.8px}
}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}
}


/* Let content determine the collage height so text never sits behind a prop. */
.scrapbook{display:grid;
grid-template-columns:minmax(0,.8fr) minmax(0,1fr);
gap:28px 20px;
min-height:0;
align-items:center;
padding:12px 14px 0}

.scribble{position:relative;
grid-column:1/-1;
justify-self:end;
top:auto;
right:auto;
font:26px/1 'caveat',cursive;
margin:0 16px 0 0}

.scribble span{position:static;
display:inline-block;
vertical-align:middle;
font-size:42px;
margin-left:14px;
transform:rotate(22deg)}

.chat-card{position:relative;
grid-column:1/-1;
top:auto;
left:auto;
width:min(100% - 12px,365px);
justify-self:center;
transform:rotate(-3deg);
margin:8px 0 12px}

.butler{background:#FFECEC;
border:1px solid #FF5E5E;
color:#8A1F1F}

.butler-label{color:#8A1F1F}
.mini-avatar{background:#FF5E5E}

.note{position:relative;
grid-column:2;
grid-row:3;
right:auto;
top:auto;
width:100%;
padding:26px 17px 23px;
transform:rotate(3deg);
margin:0}

.note h2{font:27px/1.05 'caveat',cursive;
letter-spacing:0}
.note ul{font-size:11px;
line-height:2}
.note li{display:flex;
gap:3px}
.note .tape{left:calc(50% - 46px)}

.private-tag{position:relative;
grid-column:1/-1;
justify-self:center;
top:auto;
left:auto;
transform:rotate(-3deg);
margin:4px 0 0}

.illustration-label{position:static;
grid-column:1/-1;
margin:0;
text-align:center;
font-size:10px}

.polaroid{position:relative;
grid-column:1;
grid-row:3;
background:white;
padding:10px 10px 6px;
box-shadow:0 7px 24px #48371c22;
transform:rotate(-6deg);
margin:4px 0 0}

.polaroid-art{aspect-ratio:1/1.12;
background:linear-gradient(165deg,#ebdcd4 48%,#bccac4 49%,#dde5d5 76%);
position:relative;
overflow:hidden}

.polaroid-art::before{content:'';
position:absolute;
width:28%;
aspect-ratio:1;
border-radius:50%;
top:12%;
left:14%;
background:#fff1d0}

.polaroid-art::after{content:'â™¡';
position:absolute;
right:14%;
bottom:8%;
font:50px 'caveat';
color:#fffaf3;
transform:rotate(12deg)}

.polaroid figcaption{font:22px/1.15 'caveat',cursive;
text-align:center;
margin:9px 0 4px}

.pin{position:absolute;
width:13px;
height:13px;
border-radius:50%;
background:radial-gradient(circle at 30% 25%,#ffb1a2,#c53e3e 80%);
box-shadow:2px 3px 2px #49302f40;
top:-6px;
left:47%;
z-index:1}

.portrait-caption{font:26px/1.1 'caveat',cursive}

.themes-section{padding-top:20px;
padding-bottom:100px}
.theme-grid{display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:30px 24px;
margin-top:40px}

.theme-preview{border:1px solid var(--line);
border-radius:16px;
overflow:hidden;
background:#fffdf9}
.theme-info{padding:20px}
.theme-info h3{font:23px/1.2 'fraunces',serif;
margin:0 0 8px}
.theme-info p{font-size:12px;
color:var(--muted);
margin:0 0 15px;
min-height:40px}
.swatches{display:flex;
gap:8px}
.swatches span{width:24px;
height:24px;
border-radius:50%;
border:1px solid #80708030}

.mini-board{background-color:var(--board);
padding:30px 22px;
display:grid;
grid-template-columns:1fr 1fr;
gap:15px;
align-items:center;
min-height:210px;
color:var(--paper-text)}

.mini-note,.mini-photo{position:relative;
box-shadow:0 3px 9px #35231319}
.mini-note{padding:20px 10px 14px;
background:var(--paper);
border-radius:var(--radius);
font:20px/1.3 var(--note-font);
transform:rotate(var(--tilt))}
.mini-note small{display:block;
font:10px/1.6 'inter';
margin-top:8px}
.mini-photo{background:var(--frame);
padding:7px 7px 14px;
transform:rotate(calc(-1 * var(--tilt)))}
.mini-photo span{display:grid;
place-items:center;
height:95px;
background:var(--paper-alt);
font:38px 'caveat'}
.mini-photo small{display:block;
text-align:center;
font:18px/1.4 var(--note-font);
margin-top:6px}

.fastener-pin .mini-note::before,.fastener-mixed .mini-note::before{content:'';
position:absolute;
top:-4px;
left:46%;
width:10px;
height:10px;
border-radius:50%;
background:var(--pin);
box-shadow:1px 2px 2px #0003}

.fastener-tape .mini-note::before,.fastener-mixed .mini-photo::before{content:'';
position:absolute;
width:50px;
height:16px;
background:var(--tape);
opacity:.85;
top:-7px;
left:calc(50% - 25px);
transform:rotate(-6deg)}

.themes-caption{font-size:11px;
color:var(--muted);
margin-top:23px}

@media(max-width:1100px){.hero{grid-template-columns:1fr;
gap:30px;
padding-top:40px}
.hero-copy{max-width:640px}
.hero-copy .lead{max-width:500px;
font-size:17px}
.scrapbook{width:100%;
max-width:540px;
justify-self:center;
margin:0 auto}
.hero h1{font-size:96px}
.theme-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:720px){.hero h1{font-size:76px}
.scrapbook{margin:40px auto 0;
padding:8px 9px 0;
gap:26px 16px;
grid-template-columns:minmax(0,.75fr) minmax(0,1fr)}
.chat-card{padding:17px}
.scribble{font-size:25px;
margin-right:0}
.note{padding:25px 12px 20px}
.note h2{font-size:25px}
.note-label{font-size:7px;
letter-spacing:1px}
.note ul{font-size:10px;
line-height:1.8}
.note-heart{font-size:30px}
.polaroid{padding:7px 7px 4px}
.polaroid figcaption{font-size:19px}
.private-tag{font-size:10px}
.illustration-label{font-size:9px}
.themes-section{padding-top:15px;
padding-bottom:65px}
.theme-grid{grid-template-columns:1fr;
gap:24px}
.mini-board{min-height:230px;
padding:32px 28px}
.mini-note{font-size:25px}
.mini-photo span{height:110px}
.theme-info p{min-height:0}
.actions{gap:16px;
flex-wrap:wrap}
}


.theme-amore{--board:#F0EFF8;
--speckle:#E4E2F2;
--paper:#FFFFFF;
--paper-alt:#FFF1C2;
--paper-text:#14141A;
--frame:#FFFFFF;
--radius:14px;
--tilt:0deg;
--note-font:'inter';
--pin:transparent;
--tape:transparent}
.theme-amore .swatches span:nth-child(1){background:#5B5CE2}
.theme-amore .swatches span:nth-child(2){background:#FF5E5E}
.theme-amore .swatches span:nth-child(3){background:#14141A}
.theme-amore .swatches span:nth-child(4){background:#F7F6FC}

.theme-amore-night{--board:#0D0D13;
--speckle:#1B1B24;
--paper:#1B1B24;
--paper-alt:#2A2A35;
--paper-text:#E4E4E7;
--frame:#1B1B24;
--radius:14px;
--tilt:0deg;
--note-font:'inter';
--pin:transparent;
--tape:transparent}
.theme-amore-night .swatches span:nth-child(1){background:#5B5CE2}
.theme-amore-night .swatches span:nth-child(2){background:#FF5E5E}
.theme-amore-night .swatches span:nth-child(3){background:#0A0A0F}
.theme-amore-night .swatches span:nth-child(4){background:#14141A}

.theme-warm-corkboard{--board:#C9A27A;
--speckle:#B88E66;
--paper:#F4EEE2;
--paper-alt:#EFC9B5;
--paper-text:#3B2A1A;
--frame:#FBF8F2;
--radius:2px;
--tilt:3deg;
--note-font:'caveat';
--pin:#B8955A;
--tape:transparent}
.theme-warm-corkboard .swatches span:nth-child(1){background:#B4532F}
.theme-warm-corkboard .swatches span:nth-child(2){background:#E6C2AC}
.theme-warm-corkboard .swatches span:nth-child(3){background:#6F7A45}
.theme-warm-corkboard .swatches span:nth-child(4){background:#5A3A28}

.theme-candy-cloud{--board:#EDE3F8;
--speckle:#DCCBEE;
--paper:#FBD3E4;
--paper-alt:#CFE3FB;
--paper-text:#2A1E5C;
--frame:#FFFFFF;
--radius:10px;
--tilt:2.5deg;
--note-font:'caveat';
--pin:#F48FB1;
--tape:#C9B8F2}
.theme-candy-cloud .swatches span:nth-child(1){background:#F7B7D2}
.theme-candy-cloud .swatches span:nth-child(2){background:#C9B8F2}
.theme-candy-cloud .swatches span:nth-child(3){background:#FBE29A}
.theme-candy-cloud .swatches span:nth-child(4){background:#A9CDF7}

.theme-analog-scrapbook{--board:#B98B5E;
--speckle:#A87C51;
--paper:#F2EADB;
--paper-alt:#BFD0DC;
--paper-text:#2E2A24;
--frame:#F7F3EA;
--radius:1px;
--tilt:3.5deg;
--note-font:'caveat';
--pin:#B8955A;
--tape:#9DB3C4}
.theme-analog-scrapbook .swatches span:nth-child(1){background:#9C6B44}
.theme-analog-scrapbook .swatches span:nth-child(2){background:#E3D3BE}
.theme-analog-scrapbook .swatches span:nth-child(3){background:#A9BCCB}
.theme-analog-scrapbook .swatches span:nth-child(4){background:#8FA087}

.theme-coastal-air{--board:#E8DFCF;
--speckle:#DCD1BE;
--paper:#BFE0EC;
--paper-alt:#F7F3EB;
--paper-text:#1F3B42;
--frame:#FFFFFF;
--radius:2px;
--tilt:2deg;
--note-font:'caveat';
--pin:#D8C3A0;
--tape:transparent}
.theme-coastal-air .swatches span:nth-child(1){background:#4F8F8F}
.theme-coastal-air .swatches span:nth-child(2){background:#9CCBD6}
.theme-coastal-air .swatches span:nth-child(3){background:#D9C7A6}
.theme-coastal-air .swatches span:nth-child(4){background:#F6F1E8}


/* Original generated materials shared with the native board; no texture placeholders. */
.theme-warm-corkboard .mini-board{background-image:url('/materials/cork-v1.webp');background-size:480px 480px}
.theme-warm-corkboard .mini-note,.theme-candy-cloud .mini-note,.theme-analog-scrapbook .mini-note,.theme-coastal-air .mini-note{isolation:isolate}
.theme-warm-corkboard .mini-note::after,.theme-candy-cloud .mini-note::after,.theme-analog-scrapbook .mini-note::after,.theme-coastal-air .mini-note::after{content:'';position:absolute;inset:0;border-radius:inherit;z-index:-1;pointer-events:none;background:url('/materials/ivory-paper-v1.webp') 0 0/480px 480px;opacity:.4}
