:root{
  --paper:#f3eee4;
  --paper-2:#ebe1d1;
  --ink:#211a17;
  --muted:#6f655e;
  --wine:#7d3240;
  --pink:#ef6e9f;
  --green:#6e7d61;
  --butter:#eee09a;
  --blue:#9eb8bd;
  --shadow:0 18px 38px rgba(39,30,24,.14);
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--paper);color:var(--ink);font-family:"DM Sans",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
body{overflow-x:hidden}
button,a{font:inherit}
button{color:inherit}
.desk{position:relative;min-height:100svh;height:100svh;min-height:780px;overflow:hidden;background:
  radial-gradient(circle at 18% 20%,rgba(255,255,255,.7),transparent 29%),
  radial-gradient(circle at 78% 76%,rgba(255,255,255,.46),transparent 25%),
  var(--paper)}
.paper-grain{position:absolute;inset:0;pointer-events:none;opacity:.18;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.16'/%3E%3C/svg%3E")}
.intro{position:absolute;left:50%;top:7%;transform:translateX(-50%);width:min(620px,48vw);text-align:center;z-index:2}
.tiny-kicker{margin:0 0 5px;font-size:10px;letter-spacing:.2em;font-weight:600;color:var(--muted)}
.intro h1{font-family:"Nothing You Could Do","Bradley Hand",cursive;font-size:clamp(50px,5.1vw,82px);line-height:.98;margin:0;font-weight:400;letter-spacing:-.04em}

.star-mark{position:relative;display:inline-block;width:.72em;height:.66em;margin-left:.08em;vertical-align:.08em;color:var(--wine)}
.star{position:absolute;display:block;font-family:Georgia,"Times New Roman",serif;font-weight:400;line-height:1}
.star-main{left:0;top:-.02em;font-size:.58em;transform:rotate(9deg)}
.star-small{right:0;bottom:.03em;font-size:.27em;transform:rotate(-12deg)}
.intro-copy{max-width:520px;margin:18px auto 0;font-size:15px;line-height:1.55}
.intro-copy em{font-family:"Nothing You Could Do","Bradley Hand",cursive;font-style:normal;font-size:24px;font-weight:700;border-bottom:2px solid #d94f86;padding-bottom:0}
.site-context{max-width:555px;margin:11px auto 0;font-size:11px;line-height:1.5;color:var(--muted)}
.site-context a{color:var(--ink);text-decoration-thickness:1px;text-underline-offset:3px}
.desktop-note{font-family:"Nothing You Could Do","Bradley Hand",cursive;font-size:16px;margin:7px 0 0;color:var(--muted);transform:rotate(-1deg)}
.scrap{position:absolute;z-index:3;border:0;cursor:pointer;transition:transform .18s ease,box-shadow .18s ease;touch-action:none;user-select:none;-webkit-user-select:none}
button.scrap{appearance:none}
.scrap:hover{z-index:10;box-shadow:0 21px 38px rgba(39,30,24,.16)}
.scrap.dragging{z-index:50;transition:none;box-shadow:0 26px 48px rgba(39,30,24,.22)}
.card{padding:26px;text-align:left;background:#faf7f0;border:1px solid rgba(50,40,33,.13);box-shadow:var(--shadow)}
.card-work{left:5.5%;top:21.5%;width:255px;min-height:175px;transform:rotate(-5deg)}
.card-work:hover{transform:rotate(-2deg) translateY(-5px)}
.tape{position:absolute;width:75px;height:24px;background:rgba(220,202,161,.56);backdrop-filter:blur(1px);box-shadow:0 1px 1px rgba(80,60,30,.08);pointer-events:none}
.tape-top{top:-13px;left:50%;transform:translateX(-50%) rotate(3deg)}
.eyebrow{display:block;font-size:10px;letter-spacing:.18em;color:var(--muted);font-weight:700}
.card-title{display:block;font-family:"Nothing You Could Do","Bradley Hand",cursive;font-size:34px;line-height:.92;margin:11px 0 14px;font-weight:700}
.card-sub{display:block;font-size:11px;line-height:1.4;color:var(--muted);max-width:180px}
.scribble{position:absolute;right:20px;bottom:17px;font-family:"Nothing You Could Do","Bradley Hand",cursive;font-size:28px;color:var(--wine);transform:rotate(-13deg)}
.polaroid{padding:12px 12px 19px;background:#fffdf7;box-shadow:var(--shadow);border:1px solid rgba(50,40,33,.1)}
.card-ideas{right:6.5%;top:20.5%;width:245px;transform:rotate(6deg)}
.card-ideas:hover{transform:rotate(3deg) translateY(-5px)}
.photo{display:block;position:relative;width:100%;aspect-ratio:1.28/1;overflow:hidden;background:var(--blue)}
.photo-ideas{background:radial-gradient(circle at 38% 42%,#f8edca 0 6%,transparent 7%),linear-gradient(140deg,#9dbabd,#dde0cc 56%,#d7c6aa)}
.orbit{position:absolute;border:1.5px solid rgba(33,26,23,.72);border-radius:50%;left:50%;top:50%;transform:translate(-50%,-50%) rotate(-17deg)}
.orbit-1{width:80%;height:43%}.orbit-2{width:58%;height:72%;transform:translate(-50%,-50%) rotate(43deg)}
.dot{position:absolute;width:9px;height:9px;border-radius:50%;background:var(--wine)}
.dot-a{left:26%;top:20%}.dot-b{right:20%;top:50%;background:var(--pink)}.dot-c{left:44%;bottom:14%;background:var(--ink)}
.idea-word{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) rotate(-6deg);font-family:"Nothing You Could Do","Bradley Hand",cursive;font-size:42px;font-weight:700;color:var(--ink)}
.caption{display:block;text-align:center;font-family:"Nothing You Could Do","Bradley Hand",cursive;font-size:18px;line-height:1.1;margin-top:10px}
.note{background:#efe6a7;padding:28px 24px 24px;box-shadow:var(--shadow);text-align:left}
.card-now{left:4.8%;bottom:12.5%;width:250px;min-height:180px;transform:rotate(4deg)}
.card-now:hover{transform:rotate(1deg) translateY(-5px)}
.pin{position:absolute;top:11px;left:50%;width:12px;height:12px;border-radius:50%;background:var(--wine);box-shadow:0 2px 4px rgba(0,0,0,.2);transform:translateX(-50%)}
.note-title{display:block;font-family:"Nothing You Could Do","Bradley Hand",cursive;font-size:30px;font-weight:700;margin-bottom:7px}
.checkline{display:block;font-family:"Nothing You Could Do","Bradley Hand",cursive;font-size:18px;line-height:1.45}
.photo-card{padding:11px 11px 16px;background:#f9f1e5;border:1px solid rgba(50,40,33,.11);box-shadow:var(--shadow);text-align:left}
.card-about{left:27.7%;top:40.8%;width:210px;transform:rotate(-3deg)}
.card-about:hover{transform:rotate(0deg) translateY(-5px)}
.portrait{position:relative;display:grid;place-items:center;width:100%;aspect-ratio:1/1.08;background:linear-gradient(145deg,#947968,#d3b7a0 52%,#7a8970);overflow:hidden}
.portrait:before{content:"";position:absolute;width:120%;height:80%;left:-20%;bottom:-38%;border-radius:50%;background:#342923;transform:rotate(8deg)}
.portrait-ring{position:absolute;width:62%;height:62%;border:1px solid rgba(255,255,255,.65);border-radius:50%;top:13%;left:19%}
.portrait-copy{position:relative;z-index:2;font-family:"Nothing You Could Do","Bradley Hand",cursive;font-size:78px;font-weight:700;color:#f4e8d9;margin-top:-12px}
.photo-label{display:inline-block;margin-top:8px;font-size:10px;letter-spacing:.14em;font-weight:700}
.photo-hand{float:right;margin-top:7px;font-family:"Nothing You Could Do","Bradley Hand",cursive;font-size:15px;color:var(--wine)}
.ticket{right:11.5%;bottom:10%;width:280px;min-height:125px;background:#d7a7b4;border:1px solid rgba(50,40,33,.13);box-shadow:var(--shadow);padding:22px 22px 20px;text-align:left;transform:rotate(-4deg);overflow:hidden}
.ticket:before,.ticket:after{content:"";position:absolute;width:22px;height:22px;border-radius:50%;background:var(--paper);top:50%;transform:translateY(-50%)}
.ticket:before{left:-12px}.ticket:after{right:-12px}
.card-socials:hover{transform:rotate(-1deg) translateY(-5px)}
.ticket-top{display:block;font-size:9px;letter-spacing:.21em;font-weight:700}
.handle{display:block;font-family:"Nothing You Could Do","Bradley Hand",cursive;font-size:37px;font-weight:700;line-height:1;margin:10px 0}
.ticket-bottom{display:block;font-size:10px;color:#4d3b3c}
.ticket-stamp{position:absolute;right:15px;top:13px;border:1px solid rgba(50,40,33,.45);padding:5px 7px;font-size:8px;letter-spacing:.14em;transform:rotate(8deg)}
.card-life{right:30.5%;bottom:7%;width:235px;padding:11px 11px 16px;transform:rotate(5deg)}
.card-life:hover{transform:rotate(2deg) translateY(-5px)}
.life-photo{display:block;position:relative;width:100%;aspect-ratio:1.35/1;overflow:hidden;background:#c6d2cf}
.sky{position:absolute;inset:0;background:linear-gradient(#b7c9cd 0 58%,#d9c9b0 58%)}
.sun{position:absolute;width:35px;height:35px;border-radius:50%;background:#f2df9c;top:22px;right:25px}
.city-line{position:absolute;left:0;right:0;bottom:24%;height:45%;background:linear-gradient(90deg,#7f746b 0 11%,transparent 11% 14%,#6d625a 14% 24%,transparent 24% 30%,#8f8177 30% 43%,transparent 43% 46%,#6c665f 46% 58%,transparent 58% 63%,#81766f 63% 76%,transparent 76% 79%,#695f59 79%)}
.coffee{position:absolute;left:16px;bottom:9px;font-size:34px;filter:grayscale(.2)}
.book{left:28.4%;bottom:4.8%;width:215px;height:128px;background:#6d7e65;color:#f8f1e6;box-shadow:var(--shadow);padding:22px 19px 16px;text-align:left;transform:rotate(-7deg)}
.card-reading:hover{transform:rotate(-4deg) translateY(-5px)}
.book:before{content:"";position:absolute;left:28px;top:0;bottom:0;border-left:1px solid rgba(255,255,255,.24)}
.book-spine{writing-mode:vertical-rl;transform:rotate(180deg);position:absolute;left:8px;top:12px;font-size:8px;letter-spacing:.14em;opacity:.78}
.book-title{display:block;font-family:"Nothing You Could Do","Bradley Hand",cursive;font-size:24px;line-height:1.02;font-weight:700;margin-left:18px}
.asterisk{display:block;font-size:8px;margin:11px 0 0 18px;opacity:.8}
.contact-sticker{left:50%;top:clamp(330px,44.5%,425px);transform:translateX(-50%) rotate(2deg);display:flex;flex-direction:column;align-items:center;text-decoration:none;color:var(--ink);background:var(--blue);border-radius:48% 52% 46% 54% / 56% 42% 58% 44%;padding:21px 38px 20px;box-shadow:0 12px 26px rgba(73,98,109,.18);font-family:"Nothing You Could Do","Bradley Hand",cursive;line-height:1}
.contact-sticker:hover{transform:translateX(-50%) rotate(-2deg) scale(1.04);box-shadow:0 18px 30px rgba(73,98,109,.24)}
.contact-sticker span{font-size:15px;white-space:nowrap}.contact-sticker strong{font-size:23px;font-weight:700;margin-top:3px}
.doodle{position:absolute;z-index:1;font-family:"Nothing You Could Do","Bradley Hand",cursive;color:var(--wine)}
.doodle-star{left:31%;top:28%;font-size:27px;transform:rotate(12deg)}
.doodle-arrow{right:27%;top:34%;font-size:36px;transform:rotate(-15deg)}
.doodle-question{left:59%;bottom:31%;font-size:48px;transform:rotate(8deg);color:rgba(33,26,23,.32)}
.margin-note{position:absolute;right:1.3%;top:49%;font-family:"Nothing You Could Do","Bradley Hand",cursive;font-size:15px;color:var(--muted);writing-mode:vertical-rl;transform:rotate(180deg)}
.footer-line{position:absolute;left:3%;right:3%;bottom:2%;display:flex;justify-content:space-between;font-size:9px;letter-spacing:.1em;color:var(--muted);z-index:1}
.panel-backdrop{position:fixed;inset:0;background:rgba(30,22,18,.22);backdrop-filter:blur(3px);z-index:80}
.panel{position:fixed;z-index:90;right:20px;top:20px;bottom:20px;width:min(500px,calc(100vw - 40px));background:#fbf8f1;border:1px solid rgba(50,40,33,.12);box-shadow:0 30px 80px rgba(35,27,23,.28);padding:64px 54px 46px;overflow:auto;transform:translateX(calc(100% + 40px)) rotate(.8deg);transition:transform .34s cubic-bezier(.2,.75,.2,1);border-radius:2px}
.panel.open{transform:translateX(0) rotate(.3deg)}
.panel-close{position:absolute;right:18px;top:13px;background:transparent;border:0;font-size:35px;line-height:1;cursor:pointer;font-family:"Nothing You Could Do","Bradley Hand",cursive}
.panel-kicker{font-size:10px;letter-spacing:.2em;font-weight:700;color:var(--wine);margin:0 0 22px}
.panel h2{font-family:"Nothing You Could Do","Bradley Hand",cursive;font-size:46px;line-height:1.12;margin:0 0 28px;font-weight:400}
.panel p{font-size:15px;line-height:1.68;margin:0 0 18px}
.panel-small{font-size:12px!important;color:var(--muted)}
.panel-rule{height:1px;background:rgba(33,26,23,.14);margin:28px 0}
.panel-link{display:inline-block;margin-top:8px;color:var(--ink);font-family:"Nothing You Could Do","Bradley Hand",cursive;font-size:24px;text-decoration-thickness:1px;text-underline-offset:4px}
.ne-arrow{display:inline-block;position:relative;width:.72em;height:.72em;flex:0 0 auto;margin-left:.12em;vertical-align:-.02em}
.ne-arrow:before{content:"";position:absolute;left:12%;bottom:16%;width:70%;height:1.5px;background:currentColor;transform:rotate(-45deg);transform-origin:center}
.ne-arrow:after{content:"";position:absolute;right:5%;top:4%;width:42%;height:42%;border-top:1.5px solid currentColor;border-right:1.5px solid currentColor}

.panel blockquote{font-family:"Nothing You Could Do","Bradley Hand",cursive;font-size:31px;line-height:1.12;margin:30px 0;padding:20px 0;border-top:1px solid rgba(33,26,23,.15);border-bottom:1px solid rgba(33,26,23,.15)}
.social-list{display:flex;flex-direction:column;border-top:1px solid rgba(33,26,23,.13);margin-top:27px}
.social-list a{display:flex;justify-content:space-between;align-items:center;padding:16px 0;border-bottom:1px solid rgba(33,26,23,.13);text-decoration:none;color:var(--ink);font-family:"Nothing You Could Do","Bradley Hand",cursive;font-size:28px}
.social-list a:hover{padding-left:7px}
.reading-list{list-style:none;padding:0;margin:28px 0;border-top:1px solid rgba(33,26,23,.13)}
.reading-list li{padding:15px 0;border-bottom:1px solid rgba(33,26,23,.13)}
.reading-list span{display:block;font-family:"Nothing You Could Do","Bradley Hand",cursive;font-size:26px;font-weight:700}
.reading-list small{display:block;color:var(--muted);font-size:11px;margin-top:2px}
@media (max-width:1050px){
  .intro{width:54vw;top:6%}.card-work{left:4%}.card-ideas{right:4%}.card-about{left:29%;top:41%}.card-life{right:25%}.card-now{left:5%}.ticket{right:5%}.book{left:28%}
}
@media (max-width:760px){
  body{overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch}.desk{height:auto;min-height:100svh;padding:38px 18px 90px;display:flex;flex-direction:column;gap:20px;overflow:visible}.paper-grain{position:fixed}
  .intro,.scrap,.footer-line,.margin-note,.doodle{position:relative;left:auto;right:auto;top:auto;bottom:auto;transform:none!important;width:auto}
  .intro{order:0;width:100%;padding:10px 9px 16px;text-align:left}.intro h1{font-size:64px}.intro-copy{margin:15px 0 0;max-width:430px}.site-context{margin:11px 0 0;max-width:470px}.desktop-note{font-size:15px}
  .scrap{order:2;width:100%;max-width:440px;align-self:center;touch-action:pan-y}.contact-sticker{order:1;width:max-content!important;align-self:flex-start;margin-left:8px;padding:19px 34px;touch-action:pan-y}
  .card-work{min-height:160px}.card-ideas{max-width:370px}.card-now{max-width:360px}.card-about{max-width:330px}.card-socials{max-width:410px}.card-life{max-width:370px}.card-reading{max-width:340px;height:140px}
  .footer-line{order:10;margin-top:18px;display:flex;width:100%;font-size:8px;gap:10px}.margin-note,.doodle{display:none}
  .panel{right:10px;top:10px;bottom:10px;width:calc(100vw - 20px);padding:60px 28px 36px}.panel h2{font-size:43px}
}
@media (prefers-reduced-motion:reduce){.scrap,.panel{transition:none!important}}

.field-notes-list small{display:block;margin:0 0 5px;font-size:9px;letter-spacing:.16em;font-weight:700;color:var(--wine)}
.field-notes-list span{font-size:23px;font-weight:400;line-height:1.2}
