:root{--ink:#25232b;--cream:#f8f0de;--yellow:#f4df61;--red:#e65353;--blue:#425eca;--green:#568f67;--pink:#efaac0}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:var(--cream);font-family:"Hiragino Maru Gothic ProN","Yu Gothic",Arial,sans-serif;line-height:1.7}a{color:inherit}a:focus-visible,button:focus-visible{outline:3px dashed var(--blue);outline-offset:4px}.skip{position:absolute;top:-80px;left:10px;background:white;padding:8px;z-index:20}.skip:focus{top:8px}.fiction{background:var(--yellow);text-align:center;padding:7px 18px;font-size:10px;font-weight:800}.site-head{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:14px clamp(18px,4vw,70px);background:var(--cream);border-bottom:4px dashed var(--ink)}.logo{display:flex;align-items:center;gap:10px;text-decoration:none;font-size:24px;font-weight:900;letter-spacing:-.05em}.logo-dot{display:grid;place-items:center;width:48px;height:48px;background:var(--red);color:white;border-radius:50%;font-size:34px;transform:rotate(-18deg)}.logo small{display:block;font:800 9px/1.4 Arial,sans-serif;letter-spacing:.14em}.site-head nav{display:flex;gap:25px;font-size:12px;font-weight:800}.site-head nav a{text-decoration:none;border-bottom:2px solid var(--ink)}
.hero{position:relative;min-height:700px;overflow:hidden;background:#7ec4ba}.hero:before{content:"";position:absolute;inset:0;background-image:radial-gradient(#ffffff55 1px,transparent 1px);background-size:18px 18px}.hero-paper{position:absolute;filter:drop-shadow(10px 15px 0 #22352826);animation:paper-float 6s ease-in-out infinite alternate}.hero-paper-one{width:39%;height:82%;background:var(--yellow);top:-8%;left:-9%;clip-path:polygon(12% 2%,96% 0,100% 12%,95% 88%,84% 100%,2% 96%,0 78%);transform:rotate(-15deg)}.hero-paper-two{width:40%;height:50%;background:var(--pink);right:-6%;bottom:-12%;clip-path:polygon(0 8%,85% 0,100% 21%,94% 99%,10% 90%);transform:rotate(16deg);animation-delay:1.2s}.hero-sun{position:absolute;width:250px;height:250px;background:var(--red);border-radius:50%;top:9%;right:23%;box-shadow:15px 20px 0 #29263425;animation:paper-float 7s ease-in-out infinite alternate-reverse}.hero-ink{position:absolute;right:7%;top:1%;font-size:250px;line-height:1;color:var(--blue);transform:rotate(20deg);animation:ink-turn 14s linear infinite}.hero-photo{position:absolute;width:38%;height:53%;right:8%;top:24%;transform:rotate(9deg);box-shadow:20px 20px 0 #232b3540;border:15px solid var(--cream);z-index:2}.hero-photo img{width:100%;height:100%;object-fit:cover;display:block}.hero-photo>span{position:absolute;right:0;bottom:-28px;font:800 10px Arial,sans-serif;letter-spacing:.12em;white-space:nowrap}.hero-copy{position:relative;z-index:3;width:min(59%,730px);padding:65px 0 80px clamp(28px,7vw,120px)}.hero-copy>span,.works-heading>span,.try-heading>span,.about>span,.paper-break>div>span{font:900 11px Arial,sans-serif;letter-spacing:.15em}.hero h1{font-size:clamp(85px,10vw,155px);line-height:.99;letter-spacing:-.13em;margin:70px 0 25px;font-weight:900;transform:rotate(-4deg);text-shadow:4px 5px 0 #ffffff80}.hero h1 em{font-style:normal;color:var(--blue)}.hero-copy p{max-width:360px;font-size:14px;font-weight:800;background:var(--cream);padding:12px 16px;transform:rotate(2deg)}.hero-copy a{display:inline-flex;align-items:center;justify-content:space-between;gap:45px;margin-top:20px;padding:12px 16px;background:var(--red);color:white;font-size:15px;font-weight:900;text-decoration:none;box-shadow:8px 8px 0 var(--ink);transform:rotate(-3deg)}.hero-copy a b{font-size:26px}.hero-edge{position:absolute;bottom:18px;right:25px;font:900 10px Arial,sans-serif;letter-spacing:.15em}
.works{padding:110px clamp(20px,5vw,90px);background:#fff3dc;position:relative;overflow:hidden}.works:before{content:"";position:absolute;width:450px;height:450px;right:-200px;top:-180px;background:var(--yellow);clip-path:polygon(20% 0,100% 11%,89% 100%,0 78%);transform:rotate(20deg)}.works-heading{position:relative;display:grid;grid-template-columns:150px 1.2fr .8fr;align-items:end;gap:25px;margin-bottom:50px}.works h2,.try h2,.about h2,.paper-break h2{font-size:clamp(50px,6vw,100px);font-weight:900;line-height:1.16;letter-spacing:-.1em;margin:0}.works-heading>p,.try-heading>p{font-size:14px;max-width:310px}.gallery{position:relative;display:grid;grid-template-columns:minmax(0,1.5fr) minmax(250px,.5fr);gap:35px}.art-display{background:#d6c8b0;padding:35px 45px 25px;box-shadow:15px 15px 0 #2d3540}.canvas-mat{background:var(--cream);padding:22px;transform:rotate(-2deg);box-shadow:5px 6px 0 #1f2f3f44}.art-canvas{height:clamp(360px,40vw,590px);background:#f6ebd1;position:relative;overflow:hidden;border:1px solid #d8cab7}.art-canvas:before{content:"";position:absolute;inset:0;background:radial-gradient(#79584e22 .8px,transparent .8px);background-size:7px 7px;z-index:4;pointer-events:none}.shape{position:absolute;display:block;filter:drop-shadow(4px 5px 0 #3d41432b);animation:shape-float 5s ease-in-out infinite alternate;transition:background .4s,clip-path .4s,border-radius .4s,transform .5s}.shape.a{width:35%;height:52%;left:9%;top:14%;background:var(--red);border-radius:50%;transform:rotate(14deg)}.shape.b{width:30%;height:38%;right:11%;top:8%;background:var(--blue);clip-path:polygon(12% 0,100% 30%,90% 100%,0 77%);transform:rotate(-15deg);animation-delay:.8s}.shape.c{width:59%;height:19%;left:24%;bottom:13%;background:var(--yellow);clip-path:polygon(0 23%,91% 0,100% 75%,12% 100%);transform:rotate(10deg);animation-delay:1.3s}.shape.d{width:36%;height:29%;right:5%;bottom:11%;border:18px solid var(--green);border-radius:50%;transform:rotate(25deg);animation-delay:2s}.work-two .shape.a{background:#4f8e5e;clip-path:polygon(50% 0,62% 31%,100% 8%,79% 48%,95% 91%,57% 73%,38% 100%,21% 64%,0 77%,15% 38%);border-radius:0}.work-two .shape.b{background:#e7c52e;clip-path:polygon(0 0,90% 15%,100% 85%,20% 100%)}.work-two .shape.c{background:#c36a4b;clip-path:polygon(0 0,100% 0,87% 85%,20% 100%)}.work-two .shape.d{border-color:#263862;border-width:30px}.work-three .shape.a{background:transparent;border:16px solid #355db6;border-radius:50%;clip-path:none}.work-three .shape.b{background:#e98247;clip-path:polygon(0 0,100% 26%,20% 100%)}.work-three .shape.c{background:#719cad;clip-path:polygon(0 80%,30% 0,100% 30%,78% 100%)}.work-three .shape.d{border-color:#d85672;border-radius:0;transform:rotate(-25deg)}.art-caption{display:grid;grid-template-columns:100px 1fr;gap:8px 15px;align-items:end;padding:32px 0 0}.art-caption span{font:900 10px Arial,sans-serif;letter-spacing:.1em}.art-caption h3{font-size:clamp(40px,5vw,72px);font-weight:900;letter-spacing:-.09em;line-height:1;margin:0}.art-caption p{grid-column:2;font-size:13px;margin:0}.work-list{display:flex;flex-direction:column;gap:12px}.work-list button{min-height:110px;border:0;background:var(--blue);color:white;text-align:left;padding:16px 20px;display:grid;grid-template-columns:35px 1fr 25px;gap:2px 7px;align-items:center;cursor:pointer;clip-path:polygon(0 0,98% 5%,100% 95%,3% 100%);transform:rotate(1deg)}.work-list button:nth-child(2){background:var(--green);transform:rotate(-2deg)}.work-list button:nth-child(3){background:var(--red);transform:rotate(2deg)}.work-list button[aria-pressed=true]{box-shadow:inset 0 0 0 6px var(--yellow);filter:saturate(1.5);transform:translateX(-12px) rotate(-3deg)}.work-list button span{grid-row:1/3;font-size:23px;font-weight:900}.work-list button b{font-size:20px}.work-list button small{grid-column:2;font-size:10px}.work-list button i{grid-column:3;grid-row:1/3;font-style:normal;font-size:25px}.work-list>p{font-size:11px;margin-top:auto;line-height:1.8}
.paper-break{display:grid;grid-template-columns:52% 48%;background:var(--blue);color:white;min-height:430px}.paper-break-photo{min-width:0;clip-path:polygon(0 0,100% 0,90% 100%,0 100%)}.paper-break-photo img{display:block;width:100%;height:100%;object-fit:cover;filter:saturate(.75) contrast(.9)}.paper-break>div:last-child{align-self:center;padding:55px clamp(25px,5vw,90px)}.paper-break h2{font-size:clamp(45px,6vw,80px);margin:20px 0}.paper-break p{max-width:350px;font-size:13px}
.try{background:#e8d3d9;padding:110px clamp(20px,5vw,90px);position:relative;overflow:hidden}.try:before{content:"";position:absolute;right:-100px;top:-80px;width:370px;height:370px;background:var(--red);border-radius:50%;opacity:.26}.try-heading{position:relative;display:grid;grid-template-columns:150px 1.2fr .8fr;gap:25px;align-items:end;margin-bottom:50px}.maker-board{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:45px;align-items:start}.chooser{background:#fff5e3;padding:35px;transform:rotate(-2deg);box-shadow:15px 17px 0 #a98091}.question+.question{margin-top:28px}.question h3{font-size:22px;margin:0 0 15px}.question h3 span{display:inline-grid;place-items:center;background:var(--blue);color:white;border-radius:50%;width:40px;height:40px;margin-right:10px}.choices{display:flex;flex-wrap:wrap;gap:9px}.choices button{border:2px dashed var(--ink);background:white;color:var(--ink);font:900 13px "Hiragino Maru Gothic ProN","Yu Gothic",sans-serif;text-align:left;padding:10px 13px;cursor:pointer;transform:rotate(var(--angle,2deg))}.choices button:nth-child(2){--angle:-2deg}.choices button:nth-child(3){--angle:3deg}.choices button small{display:block;font-size:10px;font-weight:500}.choices button[aria-pressed=true]{background:var(--yellow);box-shadow:4px 4px 0 var(--ink)}.plan{background:var(--yellow);padding:35px;transform:rotate(3deg);box-shadow:15px 17px 0 #a98091;clip-path:polygon(0 1%,100% 0,98% 100%,2% 98%)}.plan-head{display:flex;justify-content:space-between;gap:10px}.plan-head small{font:900 10px Arial,sans-serif;letter-spacing:.1em}.plan-head h3{font-size:19px;margin:8px 0}.plan-head button{border:0;border-bottom:2px solid;background:transparent;font-size:11px;font-weight:900;cursor:pointer;align-self:start;white-space:nowrap}.plan>p#plan-title{font-size:clamp(33px,4vw,62px);letter-spacing:-.08em;line-height:1.2;font-weight:900;margin:35px 0 15px}.plan>p#plan-description{font-size:14px;font-weight:700}.plan-tags{display:flex;gap:10px;flex-wrap:wrap;margin:25px 0}.plan-tags span{background:var(--blue);color:white;padding:8px 15px;font-size:13px;font-weight:900;transform:rotate(-4deg)}.plan-tags span+span{background:var(--red);transform:rotate(4deg)}.plan-foot{font-size:11px;border-top:2px dashed;padding-top:20px;margin-top:35px}
.about{display:grid;grid-template-columns:130px 1.2fr .8fr;gap:30px;background:var(--green);color:white;padding:95px clamp(20px,5vw,90px)}.about>span{font:900 11px Arial,sans-serif;letter-spacing:.16em}.about h2{font-size:clamp(43px,5vw,78px)}.about p{font-size:13px;max-width:350px;margin:0}.about a{grid-column:3;justify-self:start;text-decoration:none;border-bottom:2px solid;font-size:13px;font-weight:900}footer{display:flex;justify-content:space-between;gap:20px;background:var(--ink);color:white;padding:28px clamp(20px,5vw,90px);font-size:12px}footer a{text-decoration:none;border-bottom:1px solid}
@keyframes paper-float{to{translate:0 18px}}@keyframes ink-turn{to{rotate:360deg}}@keyframes shape-float{to{translate:8px -12px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.hero-paper,.hero-sun,.hero-ink,.shape{animation:none}.shape{transition:none}}
@media(max-width:1050px){.hero h1{font-size:clamp(65px,9vw,110px)}.works-heading,.try-heading,.about{grid-template-columns:110px 1fr}.works-heading p,.try-heading p,.about p,.about a{grid-column:2}.gallery{grid-template-columns:1.3fr .7fr}.art-display{padding:22px}.canvas-mat{padding:15px}.work-list button b{font-size:17px}}
@media(max-width:700px){.site-head nav a:not(:last-child){display:none}.site-head nav{gap:0}.site-head nav a{font-size:10px}.logo{font-size:18px}.logo small{font-size:7px}.logo-dot{width:39px;height:39px;font-size:27px}.hero{min-height:760px}.hero-photo{width:58%;height:31%;right:6%;top:8%;border-width:9px}.hero-sun{width:160px;height:160px;right:30%;top:2%}.hero-ink{font-size:160px}.hero-copy{width:100%;padding:290px 22px 45px}.hero h1{font-size:clamp(66px,13vw,100px);margin:25px 0 15px}.hero-copy p{font-size:12px;max-width:320px}.hero-edge{font-size:8px}.works,.try{padding:75px 18px}.works-heading,.try-heading{display:block;margin-bottom:35px}.works-heading h2,.try-heading h2{font-size:clamp(50px,11vw,75px);margin:15px 0}.works-heading p,.try-heading p{font-size:12px}.gallery{display:block}.art-display{padding:20px 20px 25px}.art-canvas{height:360px}.art-caption{display:block}.art-caption h3{font-size:45px;margin:8px 0}.work-list{margin-top:30px}.work-list button{min-height:85px}.work-list>p{font-size:11px}.paper-break{display:block}.paper-break-photo{height:270px;clip-path:none}.paper-break>div:last-child{padding:50px 22px}.paper-break h2{font-size:55px}.maker-board{display:block}.chooser,.plan{padding:25px}.plan{margin-top:40px}.question h3{font-size:18px}.choices button{font-size:12px}.about{display:block;padding:70px 22px}.about h2{font-size:55px;margin:18px 0}.about a{display:inline-block;margin-top:20px}footer{display:block}footer a{display:inline-block;margin-top:10px}}
@media(max-width:390px){.hero{min-height:710px}.hero-copy{padding-top:260px}.hero h1{font-size:61px}.hero-photo{height:29%}.art-canvas{height:300px}.plan-head{display:block}.plan-head button{margin-top:10px}}
@media(max-width:700px){.hero-photo>span{right:0;bottom:0;background:var(--cream);padding:2px 5px;font-size:7px}}

/* 2026-10-31: a full atelier photograph with a pinned paper title. */
.hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,43%);align-items:end;min-height:700px;background:#9f9a83}.hero:before{display:none}.hero-photo{position:absolute;inset:0;width:100%;height:100%;transform:none;box-shadow:none;border:0;z-index:0}.hero-photo img{object-position:center 57%}.hero-photo>span{right:auto;left:20px;bottom:18px;background:#25232bde;color:#fff;padding:6px 10px;font-size:9px;z-index:1}.hero-copy{grid-column:2;align-self:end;width:auto;max-width:600px;margin:0 clamp(24px,4vw,60px) 50px 0;padding:30px clamp(22px,3vw,42px) 34px;background:var(--cream);border:4px solid var(--ink);box-shadow:13px 13px 0 #25232b91;transform:rotate(1deg)}.hero-copy>span{color:#536047}.hero h1{font-size:clamp(57px,5.6vw,89px);line-height:1.08;letter-spacing:-.12em;margin:22px 0 8px;transform:none;text-shadow:none;white-space:nowrap}.hero h1 em{color:var(--blue)}.hero-copy p{max-width:440px;font-size:13px;transform:none;background:transparent;padding:0;margin:12px 0}.hero-copy p.hero-tagline{font-size:19px;font-weight:900;color:var(--red);letter-spacing:-.05em}.hero-copy a{transform:none;margin-top:15px;box-shadow:5px 5px 0 var(--ink)}.hero-edge{display:none}
@media(max-width:1050px) and (min-width:701px){.hero{grid-template-columns:minmax(0,1fr) minmax(0,46%)}.hero h1{font-size:clamp(55px,6.8vw,72px)}.hero-copy{margin-right:22px;padding:24px}.hero-copy p.hero-tagline{font-size:16px}}
@media(max-width:700px){.hero{display:block;min-height:0;overflow:visible}.hero-photo{position:relative;inset:auto;width:100%;height:clamp(275px,64vw,370px)}.hero-photo img{object-position:45% 55%}.hero-photo>span{left:12px;bottom:10px;font-size:7px}.hero-copy{position:relative;z-index:2;width:auto;max-width:none;margin:-20px 16px 34px;padding:22px 20px 28px;transform:rotate(-1deg)}.hero h1{font-size:clamp(58px,12vw,82px);margin:15px 0 6px}.hero-copy p{font-size:12px}.hero-copy p.hero-tagline{font-size:16px}.hero-copy a{margin-top:12px}.hero:after{content:"";display:block;height:0;clear:both}}
@media(max-width:390px){.hero-photo{height:280px}.hero h1{font-size:58px}.hero-copy{margin-left:12px;margin-right:12px;padding:20px 17px}}
