*{margin:0;padding:0;box-sizing:border-box}
:root{--paper:#efe8d8;--ink:#2a2622;--ink2:#4a433c;--ink3:#5a5249;--mute:#8a7f72;--faint:#a39888;--red:#c2412d;--green:#2d6a4f;--rule:rgba(140,165,190,.42);--margin:#d98c7a;--card:#fffdf6;--ml:118px;--cl:170px}
html{-webkit-text-size-adjust:100%}
body{background-color:var(--paper);background-image:repeating-linear-gradient(180deg,transparent 0 35px,var(--rule) 35px 36px);background-position:0 14px;font-family:'Fraunces',Georgia,serif;color:var(--ink);min-height:100vh;position:relative;overflow-x:hidden}
body::before{content:"";position:absolute;top:0;bottom:0;left:var(--ml);width:6px;border-left:1.5px solid var(--margin);border-right:1px solid var(--margin);pointer-events:none}
body::after{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(ellipse at 70% 15%,rgba(255,255,255,.5),transparent 60%),radial-gradient(ellipse at 10% 95%,rgba(160,120,60,.12),transparent 50%)}
.holes{position:absolute;left:44px;top:70px;bottom:40px;width:22px;pointer-events:none;z-index:1;background:radial-gradient(circle at 12.5px 12.5px,#cfc5b2 0 7px,transparent 10px),radial-gradient(circle at 11px 11px,#d8cfbd 0 10.5px,rgba(0,0,0,.12) 11px,transparent 12px);background-size:22px 170px;background-repeat:repeat-y}
.holes i{display:none}
.page{position:relative;z-index:2;margin-left:var(--cl);max-width:1050px;padding:30px 64px 48px 0}
a{color:inherit;text-decoration:none}
a:focus-visible{outline:2px dashed var(--red);outline-offset:4px;border-radius:4px}
.hand{font-family:'Caveat',cursive}
.kal{font-family:'Kalam',cursive}
.skip{position:absolute;left:-999px;top:8px;background:var(--card);padding:6px 10px;font-family:'Caveat';font-size:22px;z-index:9}
.skip:focus{left:8px}
/* nav */
.top{display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap;min-height:40px}
.me{font-weight:600;font-size:22px;letter-spacing:-.3px}
.links{font-family:'Caveat',cursive;font-size:27px;color:var(--ink3);display:flex;gap:30px;list-style:none}
.links a{position:relative;display:inline-block;padding:0 2px}
.links a:hover{color:var(--ink)}
.links a[aria-current]{color:var(--ink)}
.links a[aria-current]::after,.links a:hover::after{content:"";position:absolute;left:-6px;right:-6px;bottom:-4px;height:10px;background:no-repeat center/100% 100% url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 12' preserveAspectRatio='none'%3E%3Cpath d='M2 8 C 28 3, 58 11, 98 5' stroke='%23c2412d' stroke-width='2.4' fill='none' stroke-linecap='round' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E")}
.links a:hover:not([aria-current])::after{opacity:.45}
/* underline + circle helpers */
.ul{position:relative;display:inline-block}
.ul>svg.u{position:absolute;left:-6px;width:calc(100% + 12px);bottom:-18px;height:26px;overflow:visible}
.circ{position:relative;display:inline-block}
.circ>svg{position:absolute;left:-18px;top:-12px;width:calc(100% + 36px);height:calc(100% + 24px);overflow:visible}
/* hero */
.hero{position:relative;margin-top:22px}
.place{position:absolute;right:0;top:-6px;font-size:26px;color:#7a6f63}
.name{font-weight:600;font-size:96px;letter-spacing:-2px;line-height:1;margin-top:26px}
.note{position:absolute;left:640px;top:58px;font-size:30px;color:var(--red);transform:rotate(-6deg);width:260px;line-height:1}
.note svg{display:block;margin:-6px 0 0 -70px}
.lede{font-size:25px;font-style:italic;color:var(--ink2);margin-top:38px;max-width:640px;line-height:1.38}
/* home grid */
.home{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:70px;margin-top:46px;align-items:start}
.label{font-size:28px;color:var(--red);font-weight:700;line-height:1;margin-bottom:6px}
.entries{list-style:none}
.entry{display:grid;grid-template-columns:62px minmax(0,1fr) 150px;align-items:baseline;padding:14px 0 13px;border-bottom:1px dashed rgba(42,38,34,.2);column-gap:8px}
a.entry{transition:background .2s}
a.entry:hover{background:rgba(255,253,246,.45)}
.no{font-family:'Caveat',cursive;font-size:30px;color:#9a8f82;line-height:1}
.nm{font-size:30px;font-weight:600;letter-spacing:-.4px;line-height:1.1;position:relative;display:inline-block}
a.entry .nm::after{content:"\2192";font-family:'Caveat',cursive;color:var(--red);font-weight:500;margin-left:10px;font-size:28px;opacity:0;transition:opacity .2s, margin .2s}
a.entry:hover .nm::after,a.entry:focus-visible .nm::after{opacity:1;margin-left:14px}
.ds{display:block;font-family:'Kalam',cursive;font-size:17px;color:var(--ink3);margin-top:5px;line-height:1.35}
.st{font-family:'Caveat',cursive;font-size:28px;text-align:right;color:var(--green);line-height:1}
.st.b{color:var(--red)}.st.s{color:var(--mute)}
.gone .nm{color:#8f857a}
.strike{position:absolute;left:-4px;right:-4px;top:50%;height:14px;margin-top:-7px;overflow:visible;width:calc(100% + 8px)}
/* side */
.side{padding-top:44px}
.card{background:var(--card);box-shadow:0 10px 24px rgba(60,40,10,.14);position:relative;padding:26px 24px 22px}
.tape{position:absolute;top:-15px;left:50%;margin-left:-50px;width:100px;height:28px;background:rgba(230,210,150,.72);transform:rotate(-4deg)}
.fcard{transform:rotate(2.5deg)}
.big{font-size:64px;font-weight:600;letter-spacing:-1px;line-height:1.05}
.cap{font-family:'Caveat',cursive;font-size:26px;color:var(--ink3);margin-top:12px;line-height:1.15}
.cap a{color:var(--ink);border-bottom:1.5px solid rgba(194,65,45,.5)}
.cap a:hover{border-color:var(--red)}
.todo{margin:56px 0 0 26px;font-family:'Caveat',cursive;font-size:26px;color:var(--ink2);line-height:1.35;transform:rotate(-1.5deg)}
.todo a{border-bottom:1.5px solid transparent}
.todo a:hover{border-color:var(--red)}
.todo b{color:var(--red);font-weight:700}
/* footer */
.foot{margin-top:70px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-family:'Caveat',cursive;font-size:23px;color:var(--mute)}
.foot a:hover{color:var(--red)}
/* project page */
.pno{font-family:'Caveat',cursive;font-size:30px;color:#9a8f82;margin-top:40px;line-height:1}
.ptitle{display:flex;align-items:flex-end;flex-wrap:wrap;gap:20px 46px;margin-top:4px}
.ptitle h1{font-weight:600;font-size:84px;letter-spacing:-1.5px;line-height:1}
.stamp{font-family:'Caveat',cursive;font-size:34px;color:var(--green);transform:rotate(-8deg);margin-bottom:10px;line-height:1}
.stamp.b{color:var(--red)}
.plede{font-size:24px;font-style:italic;color:var(--ink2);line-height:1.38;margin-top:40px;max-width:620px}
.pgrid{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:70px;margin-top:30px;align-items:start}
.pgrid h2{font-family:'Caveat',cursive;font-weight:700;font-size:30px;color:var(--red);margin-top:18px;line-height:1}
.pgrid p{font-size:19px;line-height:36px;color:#3a342e;margin-top:4px;max-width:600px}
.sample{font-family:'Caveat',cursive;font-size:22px;color:#9a8f82;font-weight:500;margin-left:10px}
.ncard{transform:rotate(2deg);padding:28px 30px 22px}
.ncard .t{font-family:'Caveat',cursive;font-size:30px;color:var(--ink3);margin-bottom:8px}
.row{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:9px 0;border-bottom:1px dashed rgba(42,38,34,.16);font-size:18px}
.row:last-of-type{border:0}
.row b{font-weight:600;font-size:24px;white-space:nowrap}
.row b.txt{font-size:19px;white-space:normal;text-align:right;overflow-wrap:anywhere}
.blank{display:inline-block;width:34px;height:10px;vertical-align:middle}
.small{font-family:'Caveat',cursive;font-size:21px;color:var(--mute);margin-top:10px}
.out{display:inline-flex;align-items:center;gap:10px;margin:52px 0 0 22px;font-family:'Caveat',cursive;font-size:34px;color:var(--ink);transform:rotate(-2deg);white-space:nowrap}
.out svg{transition:transform .2s}
.out:hover svg{transform:translateX(6px)}
.out span{border-bottom:2px solid transparent}
.out:hover span{border-color:var(--red)}
.pager{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:64px;font-family:'Caveat',cursive;font-size:25px;color:var(--mute)}
.pager a:hover{color:var(--red)}
/* ideas */
.sec-h1{font-weight:600;font-size:76px;letter-spacing:-1.5px;line-height:1;margin-top:40px}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;margin-top:46px;align-items:start}
.icard{padding:30px 24px 22px}
.icard:nth-child(1){transform:rotate(-1.6deg)}
.icard:nth-child(2){transform:rotate(1.2deg);margin-top:18px}
.icard:nth-child(3){transform:rotate(-.6deg)}
.icard h2{font-weight:600;font-size:27px;letter-spacing:-.5px;line-height:1.1}
.sub{font-family:'Caveat',cursive;font-size:22px;color:var(--red);margin-top:4px}
.icard p{font-family:'Kalam',cursive;font-size:17px;color:var(--ink2);line-height:1.5;margin-top:14px}
.icard p a{border-bottom:1.5px solid rgba(194,65,45,.5)}
.icard p a:hover{border-color:var(--red)}
.ticks{margin-top:18px;border-top:1px dashed rgba(42,38,34,.18);padding-top:12px;list-style:none}
.tk{display:flex;align-items:center;gap:12px;font-family:'Caveat',cursive;font-size:25px;color:var(--ink3);height:34px}
.bx{width:22px;height:22px;border:2px solid #6a6157;border-radius:3px;position:relative;transform:rotate(-3deg);flex:none}
.bx svg{position:absolute;left:-2px;top:-12px}
.tk.off{color:var(--faint)}
.empty{background:transparent;box-shadow:none;border:2px dashed rgba(42,38,34,.22);min-height:250px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;font-family:'Caveat',cursive;font-size:28px;color:var(--mute);line-height:1.2}
.empty a{color:var(--ink);border-bottom:1.5px solid rgba(194,65,45,.5)}
/* log */
.lgrid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:80px;margin-top:40px;align-items:start}
.log{list-style:none}
.e{display:grid;grid-template-columns:110px minmax(0,1fr);padding:14px 0 16px;border-bottom:1px dashed rgba(42,38,34,.18)}
.e .dt{font-family:'Caveat',cursive;font-size:27px;color:var(--red);line-height:1.2}
.e .ti{font-size:24px;font-weight:600;letter-spacing:-.3px;line-height:1.25}
.e .d2{font-family:'Kalam',cursive;font-size:16px;color:var(--ink3);margin-top:4px}
.ncard ul{list-style:none;margin-top:8px}
.ncard li{font-size:19px;line-height:1.5;padding-left:22px;position:relative}
.ncard li::before{content:"";position:absolute;left:2px;top:14px;width:10px;height:2px;background:var(--red)}
.hi{margin:60px 0 0 16px;transform:rotate(-2deg);font-family:'Caveat',cursive;font-size:28px;color:var(--ink2);line-height:1.3}
.hi .x{font-family:'Fraunces',Georgia,serif;font-weight:600;font-size:30px;color:var(--ink);margin-top:10px}
.hi .f{color:var(--mute);font-size:24px;display:block;margin-top:12px}
/* responsive */
@media (max-width:1100px){
 .note{left:auto;right:0;top:-34px;width:auto}
 .note svg{display:none}
 .home,.pgrid,.lgrid{gap:48px}
}
@media (max-width:900px){
 :root{--ml:26px;--cl:44px}
 .holes{display:none}
 body{background-position:0 10px}
 .page{padding:20px 20px 40px 0}
 .top{flex-direction:column;gap:6px}
 .me{font-size:19px}
 .links{font-size:23px;gap:20px}
 .links .wide{display:none}
 .hero{margin-top:30px}
 .place{position:static;font-size:22px}
 .name{font-size:56px;letter-spacing:-1.4px;margin-top:6px}
 .ul>svg.u{bottom:-14px;height:20px}
 .note{position:static;transform:rotate(-4deg);font-size:26px;margin:30px 0 0 auto;width:max-content}
 .lede{font-size:20px;margin-top:22px}
 .home,.pgrid,.lgrid{grid-template-columns:minmax(0,1fr);gap:36px;margin-top:36px}
 .entry{grid-template-columns:40px minmax(0,1fr) auto;padding:12px 0 11px}
 .no{font-size:24px}
 .nm{font-size:23px}
 .ds{font-size:15px}
 .st{font-size:23px;max-width:84px}
 a.entry .nm::after{display:none}
 .side{padding-top:6px;max-width:330px;margin:0 auto 0 8px}
 .big{font-size:54px}
 .todo{margin-top:40px}
 .pno{margin-top:32px}
 .ptitle h1{font-size:54px}
 .stamp{font-size:30px}
 .plede{font-size:20px;margin-top:30px}
 .pgrid p{font-size:17px;line-height:30px}
 .out{margin:40px 0 0 10px;font-size:30px}
 .sec-h1{font-size:54px;margin-top:32px}
 .cards{grid-template-columns:minmax(0,1fr);gap:36px;margin-top:36px}
 .icard:nth-child(2){margin-top:0}
 .empty{min-height:150px}
 .e{grid-template-columns:76px minmax(0,1fr)}
 .e .ti{font-size:20px}
 .foot{margin-top:50px;font-size:21px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

del{text-decoration:none}
.row.stack{flex-direction:column;align-items:flex-start;gap:2px}
.row.stack b.txt{text-align:left;overflow-wrap:normal}

/* ---- v2: interactions ---- */
@media (min-width:1101px){.note{top:44px;width:340px;left:610px}}
.dood{position:absolute;left:-4px;bottom:-8px;width:calc(100% + 8px);height:12px;overflow:visible;pointer-events:none}
.dood path{stroke-dasharray:1;stroke-dashoffset:1;opacity:0;transition:stroke-dashoffset .45s ease,opacity .1s}
a.entry:hover .dood path,a.entry:focus-visible .dood path{stroke-dashoffset:0;opacity:1}
a.entry.gone:hover{background:rgba(255,253,246,.45)}
a.entry.gone .ds{color:var(--ink3)}
.name .draw{stroke-dasharray:1;stroke-dashoffset:1;animation:draw 1s .3s ease-out forwards}
.name .draw.d2{animation-delay:.9s}
@keyframes draw{to{stroke-dashoffset:0}}
/* sticky note */
.peel{position:relative;margin:58px 0 0 18px;width:220px;min-height:160px}
.under{position:absolute;inset:0;padding:20px 18px;font-size:23px;line-height:1.2;color:var(--ink2);border:2px dashed rgba(42,38,34,.18)}
.under a{color:var(--red);border-bottom:1.5px solid rgba(194,65,45,.5)}
.sticky{position:relative;z-index:2;display:block;width:100%;min-height:160px;border:0;cursor:pointer;background:linear-gradient(160deg,#fff6a6,#f7e77c);color:#5a4a1a;font-size:34px;font-weight:700;text-align:left;padding:22px 20px;box-shadow:0 8px 18px rgba(60,40,10,.18);transform:rotate(-3deg);transform-origin:12% 0;transition:transform .7s cubic-bezier(.3,.7,.4,1),opacity .7s,box-shadow .3s;clip-path:polygon(0 0,100% 0,100% 82%,86% 100%,0 100%)}
.sticky::after{content:"";position:absolute;right:0;bottom:0;width:14%;height:18%;background:linear-gradient(135deg,#e9d76a 0 50%,transparent 50%);transition:all .3s}
.sticky:hover{transform:rotate(-5deg) translateY(-3px);box-shadow:0 14px 24px rgba(60,40,10,.22)}
.sticky:hover::after{width:22%;height:28%}
.sticky .hint{display:block;font-size:22px;font-weight:500;color:#8a7a3a;margin-top:6px}
.sticky:focus-visible{outline:2px dashed var(--red);outline-offset:4px}
.peel.peeled .sticky{transform:rotate(-38deg) translate(-40px,-160px);opacity:0;pointer-events:none}
.todo{margin-top:40px}
/* try cards */
.tcard{margin-top:56px;max-width:760px;padding:30px 30px 24px;transform:rotate(-.6deg)}
.tlabel{font-size:31px;color:var(--red);font-weight:700;line-height:1.05}
.pen-btn{font-size:25px;font-weight:700;background:transparent;color:var(--ink);border:2px solid var(--ink);border-radius:255px 15px 225px 15px/15px 225px 15px 255px;padding:6px 20px 4px;cursor:pointer;margin-top:16px;transition:transform .15s,color .15s,border-color .15s}
.pen-btn:hover{color:var(--red);border-color:var(--red);transform:rotate(-1.5deg)}
.pen-btn:active{transform:scale(.97)}
.pen-btn:focus-visible,.chip:focus-visible{outline:2px dashed var(--red);outline-offset:3px}
.chips{display:flex;flex-wrap:wrap;gap:8px 10px;margin-top:8px}
.chip{font-family:'Caveat',cursive;font-size:22px;background:rgba(255,255,255,.5);border:1.5px solid rgba(42,38,34,.35);border-radius:200px 14px 180px 14px/14px 180px 14px 200px;padding:2px 14px 1px;cursor:pointer;color:var(--ink2);line-height:1.3}
.chip:hover{border-color:var(--red);color:var(--ink)}
.chip[aria-pressed="true"]{border:2px solid var(--red);color:var(--red);background:#fff;font-weight:700}
.small a{color:var(--ink2);border-bottom:1.5px solid rgba(194,65,45,.45)}
.hk-link{display:inline-block;font-family:'Caveat',cursive;font-size:24px;color:var(--ink);border-bottom:1.5px solid rgba(194,65,45,.5);margin-top:8px}
.hk-link:hover{color:var(--red)}
.hackout{min-height:200px;margin-top:14px;transition:opacity .25s}
.hackout.swap{opacity:0}
.hk-place{font-size:22px;color:var(--mute)}
.hk-t{font-size:25px;font-weight:600;letter-spacing:-.3px;line-height:1.25;margin-top:2px}
.hk-s{font-size:25px;color:var(--green);margin-top:4px}
.hk-d{font-family:'Kalam',cursive;font-size:17px;color:var(--ink2);line-height:1.5;margin-top:6px}
.calc{display:grid;grid-template-columns:1fr 1fr;gap:16px 34px;margin-top:16px}
.fld{display:block;font-family:'Kalam',cursive;font-size:16px;color:var(--ink3)}
.fld>span{display:block}
.fld b{font-family:'Fraunces',serif;color:var(--ink);font-size:20px;margin-left:6px}
.fld input[type=range]{width:100%;accent-color:var(--red);margin-top:8px}
.fld input[type=number]{display:block;margin-top:6px;font-family:'Fraunces',serif;font-size:26px;width:100%;max-width:260px;padding:4px 2px;background:transparent;border:0;border-bottom:2px solid var(--ink);color:var(--ink);border-radius:0}
.fld input[type=number]:focus{outline:none;border-color:var(--red)}
.fld.mini input[type=number]{font-size:22px;max-width:200px}
.total{margin-top:20px;font-size:21px;color:var(--ink2)}
.total b{font-size:40px;color:var(--ink);letter-spacing:-.5px}
.total .hand{font-size:24px;color:var(--mute);margin-left:6px}
.sub2{font-size:25px;color:var(--ink3);margin-top:22px;font-weight:500}
.bands{margin-top:12px}
.bar{display:flex;height:16px;border:1.5px solid rgba(42,38,34,.4);border-radius:4px 10px 3px 9px;overflow:hidden;max-width:520px}
.bar i{display:block;height:100%;transition:width .5s ease}
.bar .b1{background:#2d6a4f}.bar .b2{background:#e3b23c}.bar .b3{background:#c2412d}
.bandtxt{font-family:'Kalam',cursive;font-size:17px;color:var(--ink2);margin-top:8px;line-height:1.5}
.soon{list-style:none;margin-top:14px}
.soon li{display:grid;grid-template-columns:118px minmax(0,1fr);gap:12px;padding:11px 0;border-bottom:1px dashed rgba(42,38,34,.18);align-items:baseline}
.soon li[hidden]{display:none}
.soon .cd{font-family:'Caveat',cursive;font-size:26px;color:var(--red);line-height:1}
.soon .cd small{display:block;font-size:19px;color:var(--mute)}
.soon a{font-size:19px;line-height:1.35}
.soon a:hover{color:var(--red)}
.soon .kk{display:block;font-family:'Caveat',cursive;font-size:19px;color:var(--mute)}
.qs{list-style:none;margin-top:10px}
.qs li{margin-top:14px}
.q{font-family:'Kalam',cursive;font-size:17px;color:var(--ink2)}
.plate{list-style:none;margin-top:6px}
.plate li{position:relative;padding:7px 0 7px 26px;font-size:18px;line-height:1.4;border-bottom:1px dashed rgba(42,38,34,.14)}
.plate li::before{content:"";position:absolute;left:0;top:13px;width:14px;height:14px;border:1.8px solid #6a6157;border-radius:3px;transform:rotate(-4deg)}
.plate a:hover{color:var(--red)}
.split{margin-top:16px}
.split p{display:flex;justify-content:space-between;align-items:baseline;gap:14px;flex-wrap:wrap;padding:10px 0;border-bottom:1px dashed rgba(42,38,34,.16)}
.split .hand{font-size:24px;color:var(--ink3)}
.split b{font-size:24px;font-weight:600}
.sumibox{margin-top:10px}
.sumibox iframe{display:block;width:100%;height:600px;border:0;background:#fff;box-shadow:inset 0 0 0 1px rgba(42,38,34,.12)}
.writehere{display:inline-block;width:min(320px,70%);height:1.1em;border-bottom:2px dashed rgba(42,38,34,.35);vertical-align:-2px}
/* savethenread */
.rubber{font-family:'Fraunces',serif;font-weight:600;text-transform:uppercase;letter-spacing:4px;font-size:26px;color:var(--red);border:3.5px solid var(--red);border-radius:6px;padding:6px 14px 4px;transform:rotate(-9deg);margin-bottom:16px;opacity:.85;mix-blend-mode:multiply;box-shadow:inset 0 0 0 2px rgba(239,232,216,.6)}
.owl{margin:40px 0 0 30px;transform:rotate(-3deg);width:170px}
.owl img{width:100%;height:auto;display:block}
.owl figcaption{font-size:22px;color:var(--mute);text-align:center}
.feats{margin-top:56px}
.flist{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:4px 44px;margin-top:10px}
.flist li{display:grid;grid-template-columns:30px minmax(0,1fr);gap:6px;padding:10px 0;border-bottom:1px dashed rgba(42,38,34,.16);font-size:17px;line-height:1.5;color:#3a342e}
.flist b{font-weight:600;color:var(--ink)}
.tick{margin-top:2px}
.rsvp{margin-top:18px;height:120px;display:flex;align-items:center;justify-content:center;background:#fff;border-radius:4px;box-shadow:inset 0 0 0 1px rgba(42,38,34,.12);position:relative}
.rsvp::before,.rsvp::after{content:"";position:absolute;left:50%;width:2px;height:14px;background:var(--red);opacity:.5}
.rsvp::before{top:10px}.rsvp::after{bottom:10px}
.rsvp .w{font-size:44px;font-weight:600;letter-spacing:-.5px;white-space:nowrap}
.rsvp .w em{font-style:normal;color:var(--red)}
.ctrl{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.ctrl .pen-btn{margin-top:12px}
.ctrl .chips{margin-top:12px}
.shots-wrap{margin-top:60px}
.shots{display:grid;grid-template-columns:1fr 1fr;gap:44px 40px;margin-top:22px;align-items:start}
.shot{background:#fff;padding:12px 12px 6px;box-shadow:0 10px 22px rgba(60,40,10,.15);position:relative}
.shot img{display:block;width:100%;height:auto}
.shot figcaption{font-size:22px;color:var(--ink3);padding:6px 2px 2px}
.shot.s0{transform:rotate(-1.4deg)}.shot.s1{transform:rotate(1.2deg)}.shot.s2{transform:rotate(.8deg)}.shot.s3{transform:rotate(-1deg)}
.dec{display:grid;grid-template-columns:150px minmax(0,1fr);gap:24px;align-items:center;margin-top:12px}
.dec-owl{width:100%;height:auto;transition:transform .3s}
.dec-owl.pop{transform:scale(1.06) rotate(-3deg)}
.dec-art{font-size:21px;font-weight:600;line-height:1.3}
.dec-art .hand{display:block;font-weight:500;font-size:21px;color:var(--mute)}
.dec-msg{font-size:24px;color:var(--ink2);margin-top:12px;min-height:58px;line-height:1.2}
.pgrid.two{margin-top:60px}
.stack{list-style:none;margin-top:10px}
.stack li{padding:9px 0;border-bottom:1px dashed rgba(42,38,34,.16);font-size:17px;line-height:1.4}
.stack b{display:block;font-weight:600}
.stack span{font-family:'Kalam',cursive;font-size:15px;color:var(--ink3)}
.tl{list-style:none;margin-top:10px;border-left:2px solid rgba(194,65,45,.35);padding-left:18px}
.tl li{position:relative;padding:7px 0;font-size:17px;line-height:1.4}
.tl li::before{content:"";position:absolute;left:-24px;top:15px;width:10px;height:10px;border-radius:50%;background:var(--paper);border:2px solid var(--red)}
.tl .dt{display:block;font-size:22px;color:var(--red);line-height:1}
.tl a{border-bottom:1.5px solid rgba(194,65,45,.5)}
.plans{margin-top:34px;transform:rotate(1.5deg);padding:26px 24px 16px}
.plans .t{font-size:27px;color:var(--ink3);margin-bottom:4px}
.m-out{margin-top:14px}
.m-out b{font-size:42px;letter-spacing:-.5px}
.m-out .hand{font-size:24px;color:var(--mute)}
.m-row{font-size:20px;color:var(--mute);margin-top:4px!important;min-height:22px}
.m-row i{display:inline-block;height:20px;max-width:100%;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 20'%3E%3Cpath d='M2 9 H22 C21 15 17 18 12 18 C7 18 3 15 2 9 Z' fill='none' stroke='%23c2412d' stroke-width='1.8' stroke-linejoin='round'/%3E%3Cpath d='M8 6 C9 4 7 3 8 1 M12 6 C13 4 11 3 12 1 M16 6 C17 4 15 3 16 1' stroke='%23c2412d' stroke-width='1.4' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") left center/24px 20px repeat-x;vertical-align:middle;margin-right:6px}
.icard .small{font-family:'Caveat',cursive;font-size:20px}
.log li[hidden]{display:none}
[data-widget="logf"] .chips{margin-bottom:6px}
@media (max-width:900px){
 .peel{margin:44px 0 0 10px}
 .tcard{padding:26px 18px 20px;margin-top:44px;transform:none}
 .tlabel{font-size:27px}
 .calc{grid-template-columns:1fr}
 .total b{font-size:34px}
 .soon li{grid-template-columns:92px minmax(0,1fr)}
 .soon .cd{font-size:23px}
 .soon a{font-size:17px}
 .sumibox iframe{height:520px}
 .rubber{font-size:20px;letter-spacing:3px}
 .flist{grid-template-columns:1fr}
 .shots{grid-template-columns:1fr;gap:34px}
 .rsvp .w{font-size:34px}
 .dec{grid-template-columns:96px minmax(0,1fr);gap:14px}
 .owl{margin:20px auto 0;width:140px}
 .pgrid.two{margin-top:44px}
}
@media (prefers-reduced-motion:reduce){
 *{transition:none!important;animation:none!important}
 .name .draw{stroke-dashoffset:0}
 .dood path{stroke-dashoffset:0;opacity:0}
 a.entry:hover .dood path{opacity:1}
}

/* ===================== v3: roomier, sectioned ===================== */
.page{max-width:1100px;margin-left:max(var(--cl),calc((100vw - 1100px)/2));margin-right:auto;padding:30px 48px 56px 0}
.foot{margin-top:120px;padding-top:30px;border-top:1px dashed rgba(42,38,34,.22)}
/* home */
.v3 .h-hero{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:60px;align-items:center;min-height:min(calc(100vh - 90px),700px);padding:30px 0 40px}
.h-kicker{font-size:30px;color:#7a6f63;line-height:1}
.h-name{font-weight:600;font-size:clamp(64px,9.6vw,136px);letter-spacing:-.03em;line-height:.95;margin-top:22px}
.h-name .ul>svg.u{bottom:-22px;height:30px}
.h-line{font-size:clamp(22px,2.3vw,32px);font-style:italic;color:var(--ink2);line-height:1.3;margin-top:56px;max-width:620px}
.h-scroll{display:inline-flex;align-items:center;gap:10px;margin-top:64px;font-size:26px;color:var(--ink3)}
.h-scroll:hover{color:var(--red)}
.h-scroll svg{animation:bob 2.4s ease-in-out infinite}
@keyframes bob{50%{transform:translateY(6px)}}
.h-photo{position:relative;background:var(--card);padding:16px 16px 18px;box-shadow:0 14px 30px rgba(60,40,10,.16);transform:rotate(2.5deg);justify-self:end;width:280px}
.h-photo .tape{top:-14px}
.h-photo-slot{aspect-ratio:4/5;background:linear-gradient(160deg,#e9e1cf,#ddd2bc);display:flex;align-items:center;justify-content:center;overflow:hidden}
.h-photo-slot span{font-weight:600;font-size:96px;letter-spacing:-3px;color:var(--ink);position:relative}
.h-photo-slot span::after{content:"";position:absolute;left:-8px;right:-8px;bottom:-4px;height:12px;background:no-repeat center/100% 100% url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 12' preserveAspectRatio='none'%3E%3Cpath d='M2 8 C 28 3, 58 11, 98 5' stroke='%23c2412d' stroke-width='3' fill='none' stroke-linecap='round' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E")}
.h-photo-slot img{width:100%;height:100%;object-fit:cover;display:block}
.h-photo figcaption{font-size:30px;color:var(--red);line-height:1.05;margin-top:14px;transform:rotate(-2deg)}
.h-sec{padding:130px 0 0}
.h-label{font-size:30px;color:var(--red);font-weight:700;line-height:1}
.h-title{font-weight:600;font-size:clamp(40px,4.6vw,64px);letter-spacing:-.02em;line-height:1.05;margin-top:14px}
.h-title.big{font-size:clamp(44px,5.6vw,80px)}
.h-sub{font-family:'Kalam',cursive;font-size:21px;color:var(--ink3);margin-top:20px;max-width:560px;line-height:1.45}
/* numbers strip */
.h-nums{padding-top:110px}
.h-numlist{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:40px;margin-top:34px;padding:54px 44px;background:var(--card);box-shadow:0 10px 26px rgba(60,40,10,.10);transform:rotate(-.6deg);position:relative}
.h-numlist::before{content:"";position:absolute;top:-14px;left:12%;width:110px;height:28px;background:rgba(230,210,150,.72);transform:rotate(-5deg)}
.h-numlist li{display:flex;flex-direction:column;gap:12px}
.h-numlist .n{font-weight:600;font-size:clamp(44px,4.6vw,64px);letter-spacing:-.03em;line-height:1}
.h-numlist .l{font-size:25px;color:var(--ink3);line-height:1.1}
/* project cards */
.h-grid{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:44px 40px;margin-top:64px}
.h-grid li{display:flex}
.pcard{position:relative;display:flex;flex-direction:column;width:100%;min-height:230px;padding:26px 26px 22px;background:rgba(255,253,246,.78);box-shadow:0 1px 0 rgba(42,38,34,.08),0 8px 20px rgba(60,40,10,.08);transition:transform .25s,box-shadow .25s}
a.pcard:hover,a.pcard:focus-visible{transform:translateY(-4px) rotate(-.6deg);box-shadow:0 14px 28px rgba(60,40,10,.14)}
.pcard .pc-no{font-size:26px;color:#9a8f82;line-height:1}
.pcard .nm{font-size:30px;margin-top:16px;align-self:flex-start}
a.pcard .nm::after{content:none}
a.pcard:hover .dood path,a.pcard:focus-visible .dood path{stroke-dashoffset:0;opacity:1}
.pc-ds{font-family:'Kalam',cursive;font-size:18px;color:var(--ink3);line-height:1.4;margin-top:12px}
.pc-st{margin-top:auto;padding-top:20px;font-size:27px;color:var(--green);line-height:1}
.pc-st.b{color:var(--red)}.pc-st.s{color:var(--mute)}
.pcard.still{background:transparent;box-shadow:none;border:2px dashed rgba(42,38,34,.16)}
.pcard.gone .nm{color:#8f857a}
/* workbench */
.h-bench{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:80px;align-items:center}
.h-ideas{list-style:none;margin-top:40px}
.h-ideas li{display:flex;gap:16px;align-items:baseline;padding:18px 0;border-bottom:1px dashed rgba(42,38,34,.2);font-family:'Kalam',cursive;font-size:19px;color:var(--ink3);line-height:1.4}
.h-ideas b{display:block;font-family:'Fraunces',Georgia,serif;font-size:26px;color:var(--ink);font-weight:600;letter-spacing:-.3px}
.h-ideas .tk{flex:0 0 26px}
.h-bench .peel{margin:0;justify-self:center}
.h-more{display:inline-flex;align-items:center;gap:12px;margin-top:36px;font-size:28px;color:var(--ink)}
.h-more svg{width:56px;transition:transform .2s}
.h-more:hover svg{transform:translateX(6px)}
/* log teaser */
.h-log{list-style:none;margin-top:44px;max-width:760px}
.h-log li{display:grid;grid-template-columns:110px minmax(0,1fr);align-items:baseline;padding:20px 0;border-bottom:1px dashed rgba(42,38,34,.2)}
.h-log .dt{font-size:27px;color:var(--red);line-height:1}
.h-log .ti{font-size:24px;line-height:1.3}
/* say hi */
.h-hi{text-align:center;padding-top:160px}
.h-hi .h-sub{margin:20px auto 0}
.h-x{display:inline-block;margin-top:50px;font-weight:600;font-size:clamp(34px,4.4vw,56px);letter-spacing:-.02em}
.h-x>svg{left:-26px;top:-16px;width:calc(100% + 52px);height:calc(100% + 32px)}
.h-x:hover{color:var(--red)}
@media (max-width:1000px){
 .h-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .h-numlist{grid-template-columns:repeat(2,minmax(0,1fr));gap:44px 30px}
}
@media (max-width:900px){
 .page{margin-left:var(--cl);padding:20px 20px 40px 0}
 .v3 .h-hero{grid-template-columns:minmax(0,1fr);min-height:0;gap:56px;padding:44px 0 10px}
 .h-kicker{font-size:24px}
 .h-name{font-size:clamp(56px,16vw,80px);margin-top:14px}
 .h-name .ul>svg.u{bottom:-14px;height:20px}
 .h-line{margin-top:40px}
 .h-scroll{margin-top:36px;font-size:23px}
 .h-photo{justify-self:center;width:230px}
 .h-photo-slot span{font-size:76px}
 .h-photo figcaption{font-size:27px}
 .h-sec{padding-top:90px}
 .h-nums{padding-top:80px}
 .h-label{font-size:26px}
 .h-sub{font-size:18px}
 .h-numlist{padding:36px 24px;gap:34px 18px;margin-top:24px}
 .h-numlist .l{font-size:21px}
 .h-grid{grid-template-columns:minmax(0,1fr);gap:22px;margin-top:40px}
 .pcard{min-height:0;padding:20px 20px 18px}
 .pcard .nm{font-size:25px;margin-top:10px}
 .pc-ds{font-size:16px}
 .pc-st{font-size:24px;padding-top:14px}
 .h-bench{grid-template-columns:minmax(0,1fr);gap:56px}
 .h-ideas b{font-size:22px}
 .h-ideas li{font-size:16px}
 .h-log li{grid-template-columns:80px minmax(0,1fr);padding:16px 0}
 .h-log .dt{font-size:23px}
 .h-log .ti{font-size:19px}
 .h-more{font-size:25px}
 .h-hi{padding-top:110px}
 .foot{margin-top:80px}
}
@media (prefers-reduced-motion:reduce){.h-scroll svg{animation:none}.pcard{transition:none}}

.h-line{text-wrap:balance}
.h-x>svg{left:-34px;top:-18px;width:calc(100% + 68px);height:calc(100% + 36px)}
a.pcard.still.next:hover{border-color:rgba(194,65,45,.45)}
@media (max-width:900px){
 .h-photo{width:200px}
 .h-photo-slot span{font-size:64px}
 .h-numlist .n{font-size:40px}
}

/* v3 project + sub pages: more air, clear sections */
.proj .pno{margin-top:90px;font-size:32px}
.proj .ptitle{margin-top:10px}
.proj .ptitle h1{font-size:clamp(56px,8vw,112px);letter-spacing:-.03em}
.proj .stamp{font-size:38px}
.proj .plede,.sub .plede{font-size:clamp(22px,2.3vw,30px);margin-top:56px;max-width:720px;text-wrap:balance}
.proj .pgrid{margin-top:150px;gap:100px;grid-template-columns:minmax(0,1fr) 340px}
.proj .pgrid h2{font-size:32px}
.proj .pgrid article h2:not(:first-child){margin-top:60px}
.proj .pgrid p{font-size:20px;line-height:36px;max-width:620px}
.proj main>section,.proj main>.pgrid.two{margin-top:150px}
.proj .tcard{max-width:820px;padding:40px 40px 32px}
.proj .pager{margin-top:150px;padding-top:28px;border-top:1px dashed rgba(42,38,34,.22)}
.proj .pager+*{margin-top:0}
.sub .sec-h1{font-size:clamp(56px,7.4vw,104px);letter-spacing:-.03em;margin-top:90px}
.sub .cards,.sub .lgrid{margin-top:120px;gap:56px}
@media (max-width:900px){
 .proj .pno{margin-top:44px;font-size:26px}
 .proj .ptitle h1{font-size:clamp(46px,13vw,64px)}
 .proj .stamp{font-size:30px}
 .proj .plede,.sub .plede{font-size:20px;margin-top:32px}
 .proj .pgrid{margin-top:80px;gap:56px;grid-template-columns:minmax(0,1fr)}
 .proj .pgrid article h2:not(:first-child){margin-top:40px}
 .proj .pgrid p{font-size:17px;line-height:30px}
 .proj main>section,.proj main>.pgrid.two{margin-top:90px}
 .proj .tcard{padding:28px 22px 22px}
 .proj .pager{margin-top:90px}
 .sub .sec-h1{font-size:54px;margin-top:44px}
 .sub .cards,.sub .lgrid{margin-top:60px;gap:40px}
}

@media (max-width:900px){.dbr{display:none}}

/* scroll reveal: progressive enhancement. .js is set by an inline head script; without it (or with it stripped) everything below shows at full opacity. */
.js main>section:not(.h-hero),.js main>.pgrid{opacity:0;transform:translateY(24px);transition:opacity .6s ease-out,transform .6s ease-out;will-change:opacity,transform}
.js main>section:not(.h-hero).in-view,.js main>.pgrid.in-view{opacity:1;transform:translateY(0)}
.js .h-grid>li,.js .shots>figure{opacity:0;transform:translateY(24px);transition:opacity .55s ease-out,transform .55s ease-out}
.js .h-grid>li.in-view,.js .shots>figure.in-view{opacity:1;transform:translateY(0)}
@media (prefers-reduced-motion:reduce){
 .js main>section:not(.h-hero),.js main>.pgrid,.js main>section:not(.h-hero).in-view,.js main>.pgrid.in-view,.js .h-grid>li,.js .shots>figure,.js .h-grid>li.in-view,.js .shots>figure.in-view{opacity:1;transform:none;transition:none}
}

/* say hi: contact form */
.h-or{font-size:28px;color:var(--ink3);margin-top:70px}
.h-form{position:relative;max-width:680px;margin:26px auto 0;text-align:left;background:var(--card);padding:44px 44px 36px;box-shadow:0 10px 26px rgba(60,40,10,.10);transform:rotate(.5deg)}
.h-form::before{content:"";position:absolute;top:-14px;right:14%;width:110px;height:28px;background:rgba(230,210,150,.72);transform:rotate(4deg)}
.f-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px}
.f-field{display:block;margin-bottom:26px}
.f-lab{display:block;font-size:25px;color:var(--ink3);line-height:1}
.h-form input,.h-form textarea{display:block;width:100%;margin-top:8px;border:0;border-bottom:1.5px dashed rgba(42,38,34,.35);background:transparent;font-family:'Kalam',cursive;font-size:20px;color:var(--ink);padding:8px 2px;border-radius:0;outline:none;-webkit-appearance:none;appearance:none}
.h-form textarea{resize:vertical;min-height:130px;line-height:1.5;background-image:repeating-linear-gradient(180deg,transparent 0 29px,var(--rule) 29px 30px);background-position:0 7px;border-bottom:0}
.h-form input:focus,.h-form textarea:focus{border-bottom-color:var(--red);border-bottom-style:solid}
.h-form textarea:focus{box-shadow:inset 0 -1.5px 0 var(--red)}
.h-form [aria-invalid="true"]{border-bottom-color:var(--red)}
.f-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.f-foot{display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin-top:6px}
.f-send{font-size:30px;line-height:1;color:#fffdf6;background:var(--red);border:0;padding:12px 30px 14px;cursor:pointer;transform:rotate(-1.5deg);box-shadow:0 4px 0 #8f2e20;border-radius:3px;transition:transform .15s}
.f-send:hover{transform:rotate(-1.5deg) translateY(-2px)}
.f-send:focus-visible{outline:2px dashed var(--ink);outline-offset:4px}
.f-send[disabled]{opacity:.6;cursor:wait}
.f-status{font-size:19px;color:var(--ink3);line-height:1.4;flex:1 1 220px;min-height:1.4em}
.f-status.ok{color:var(--green)}
.f-status.err{color:var(--red)}
.h-form.sent .f-field,.h-form.sent .f-row,.h-form.sent .f-send{display:none}
.h-form.sent .f-status{font-family:'Caveat',cursive;font-size:34px;text-align:center;flex-basis:100%}
@media (max-width:900px){
 .h-or{margin-top:54px;font-size:25px}
 .h-form{padding:32px 22px 26px;transform:none}
 .f-row{grid-template-columns:minmax(0,1fr);gap:0}
}
@media (prefers-reduced-motion:reduce){.f-send{transition:none}}

/* outbound links + taped site screenshots */
.visit-row{margin-top:34px}
.visit{display:inline-flex;align-items:center;gap:12px;font-size:30px;line-height:1;color:#fffdf6;background:var(--red);padding:12px 26px 14px;border-radius:3px;box-shadow:0 4px 0 #8f2e20;transform:rotate(-1.5deg);transition:transform .15s}
.visit:hover,.visit:focus-visible{transform:rotate(-1.5deg) translateY(-2px);color:#fffdf6}
.visit svg{flex:none}
a.inl{border-bottom:1.5px solid rgba(194,65,45,.55)}
a.inl:hover{color:var(--red)}
.shots.pd{grid-template-columns:minmax(0,2.4fr) minmax(0,1fr);align-items:center;max-width:980px}
.shot.ph{max-width:260px;justify-self:center}
.shot a{display:block}
.site-shots{margin-top:80px}
.h-grid li{flex-direction:column}
.pcard.has-shot{min-height:0}
.pc-shot{display:block;position:relative;margin:-8px -6px 20px;background:#fff;padding:7px;box-shadow:0 3px 10px rgba(60,40,10,.14);transform:rotate(-1.2deg)}
.h-grid li:nth-child(even) .pc-shot{transform:rotate(1deg)}
.pc-shot::before{content:"";position:absolute;top:-11px;left:50%;margin-left:-38px;width:76px;height:22px;background:rgba(230,210,150,.75);transform:rotate(-3deg);z-index:1}
.pc-shot img{display:block;width:100%;height:auto;aspect-ratio:8/5;object-fit:cover;object-position:top}
.pc-shot.doodle{background:transparent;box-shadow:none;padding:0;display:flex;justify-content:center}
.pc-shot.doodle::before{content:none}
.pc-shot.doodle svg{width:62%;height:auto}
.pc-out{align-self:flex-start;display:inline-flex;align-items:center;gap:8px;margin:12px 0 0 6px;font-size:24px;color:var(--ink3);line-height:1}
.pc-out:hover,.pc-out:focus-visible{color:var(--red)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media (max-width:900px){
 .visit{font-size:26px;padding:10px 20px 12px}
 .shots.pd{grid-template-columns:minmax(0,1fr)}
 .shot.ph{max-width:220px}
 .site-shots{margin-top:56px}
 .pc-out{font-size:22px}
}
@media (prefers-reduced-motion:reduce){.visit{transition:none}}
.h-grid li>.pcard{flex:1 1 auto}