:root{--ink:#20202a;--paper:#f7f7fb;--line:#dedee8;--pink:#ff5ca8;--blue:#6558ff;--lime:#caff4b;--orange:#ff8750;--aqua:#3eddd5}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:"Noto Sans SC",sans-serif;overflow-x:hidden}body.color-mode{--paper:#fff6d9;--ink:#27221b;--line:#dfcfad;--pink:#ff4c73;--blue:#2772d8;--lime:#e1ff52;--orange:#ff9b3d;--aqua:#32c9d5}a{color:inherit}.cursor-dot,.cursor-ring{position:fixed;z-index:30;top:0;left:0;pointer-events:none;border-radius:50%;transform:translate(-50%,-50%)}.cursor-dot{width:8px;height:8px;background:var(--ink)}.cursor-ring{width:34px;height:34px;border:2px solid var(--ink);transition:width .2s,height .2s,background .2s}.cursor-ring.hover{width:60px;height:60px;background:rgba(255,92,168,.25)}.nav{height:78px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 clamp(18px,4vw,64px);position:relative;z-index:10;background:color-mix(in srgb,var(--paper) 88%,transparent);backdrop-filter:blur(12px)}.logo{font:500 15px "DM Mono",monospace;letter-spacing:.06em;text-decoration:none}.logo b{color:var(--pink);font-size:19px}.nav nav{display:flex;gap:28px}.nav nav a{font-size:14px;text-decoration:none;font-weight:700}.palette-toggle{border:0;background:var(--ink);color:var(--paper);border-radius:999px;padding:10px 14px;display:flex;gap:8px;align-items:center;font:10px "DM Mono",monospace}.palette-toggle i{width:9px;height:9px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 2px var(--paper)}.hero{min-height:calc(100svh - 78px);padding:clamp(42px,7vw,100px) clamp(20px,8vw,120px) 62px;position:relative;overflow:hidden;background:linear-gradient(130deg,#e5e3ff 0 38%,#f7f7fb 38% 62%,#d8fbff 62%)}.hero:before{content:"";width:47vw;height:47vw;min-width:490px;min-height:490px;position:absolute;right:-13vw;top:-12vw;border-radius:48% 52% 46% 54%;background:var(--pink);transform:rotate(15deg);animation:wobble 10s ease-in-out infinite}.hero:after{content:"";position:absolute;right:11vw;bottom:-7vw;width:24vw;height:24vw;border-radius:50%;background:var(--lime);mix-blend-mode:multiply;animation:float 7s ease-in-out infinite}.hero-badge,.section-intro span,.about span{font:11px "DM Mono",monospace;letter-spacing:.1em}.hero-badge{position:relative;z-index:1}.hero-badge span{color:var(--pink)}.hero h1{position:relative;z-index:1;margin:clamp(42px,9vw,120px) 0 18px;font-size:clamp(47px,8.7vw,138px);line-height:.92;letter-spacing:-.095em;font-weight:900}.hero h1 mark{background:transparent;color:var(--blue);position:relative}.hero h1 mark:after{content:"";position:absolute;left:-2%;right:0;bottom:-4%;height:17%;z-index:-1;background:var(--lime);transform:rotate(-2deg)}.hero p{position:relative;z-index:1;margin:0;font-size:clamp(15px,1.5vw,19px);font-weight:700;letter-spacing:.04em}.hero-action{position:absolute;z-index:2;bottom:54px;left:clamp(20px,8vw,120px);font:12px "DM Mono",monospace;display:flex;gap:13px;align-items:center;text-decoration:none}.hero-action b{background:var(--ink);color:var(--paper);border-radius:50%;width:36px;height:36px;display:grid;place-items:center;font-size:19px;transition:transform .25s}.hero-action:hover b{transform:translateY(7px)}.float-sticker{position:absolute;z-index:2;border:2px solid var(--ink);border-radius:50%;display:grid;place-items:center;text-align:center;font:11px "DM Mono",monospace;line-height:1.15;animation:float 6s ease-in-out infinite}.sticker-a{right:37%;top:25%;width:88px;height:88px;background:var(--lime);transform:rotate(12deg)}.sticker-b{right:13%;bottom:18%;width:100px;height:100px;background:var(--aqua);transform:rotate(-14deg);animation-delay:-2s}.flower{position:absolute;z-index:1;right:27%;top:51%;font-size:clamp(95px,15vw,210px);color:var(--orange);animation:spin 18s linear infinite}.ticker{overflow:hidden;border-block:1px solid var(--ink);background:var(--ink);color:var(--lime);white-space:nowrap;font:13px "DM Mono",monospace;letter-spacing:.12em;padding:14px 0}.ticker div{display:inline-block;animation:ticker 23s linear infinite}.works{padding:clamp(65px,10vw,145px) clamp(18px,6vw,94px)}.section-intro{display:flex;justify-content:space-between;align-items:end;gap:30px}.section-intro h2{margin:10px 0 0;font-size:clamp(39px,6.5vw,92px);line-height:.94;letter-spacing:-.09em}.section-intro p{margin:0 5% 8px 0;font-size:15px;line-height:1.7}.category-pills{display:flex;gap:9px;flex-wrap:wrap;margin:52px 0 30px}.pill{border:1.5px solid var(--ink);background:transparent;border-radius:999px;padding:11px 14px;font-size:13px;font-weight:700;transition:.2s}.pill b{font:10px "DM Mono",monospace;margin-left:6px}.pill:hover,.pill.active{background:var(--ink);color:var(--paper);transform:translateY(-3px)}.pill.coming{border-style:dashed}.work-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:18px}.work-card{grid-column:span 4;min-height:390px;position:relative;border-radius:20px;overflow:hidden;border:1.5px solid var(--ink);background:var(--card,#ddd);text-align:left;padding:0;color:var(--ink);transition:transform .3s,box-shadow .3s}.work-card:nth-child(2),.work-card:nth-child(5){grid-column:span 8}.work-card.hidden{display:none}.work-card:hover{transform:rotate(var(--tilt,0deg)) translateY(-8px);box-shadow:9px 10px 0 var(--ink)}.card-media{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.8,.2,1)}.work-card:hover .card-media{transform:scale(1.07)}.card-shade{position:absolute;inset:0;background:linear-gradient(180deg,transparent 36%,rgba(255,255,255,.9) 100%)}.card-info{position:absolute;z-index:2;inset:auto 0 0;padding:22px}.card-category{font:10px "DM Mono",monospace;letter-spacing:.1em;background:var(--paper);border:1px solid var(--ink);border-radius:999px;padding:5px 9px;display:inline-block}.card-info h3{margin:10px 0 3px;font-size:clamp(22px,3vw,34px);letter-spacing:-.065em}.card-info p{margin:0;font-size:13px;font-weight:700}.card-open{position:absolute;z-index:3;right:18px;top:18px;width:44px;height:44px;border-radius:50%;background:var(--lime);border:1.5px solid var(--ink);display:grid;place-items:center;font-size:23px;transition:transform .25s}.work-card:hover .card-open{transform:rotate(45deg)}.about{min-height:660px;padding:clamp(70px,10vw,130px) clamp(20px,8vw,120px);background:var(--blue);color:white;position:relative;overflow:hidden;display:grid;grid-template-columns:1.2fr .8fr;gap:50px;align-items:end}.about h2{font-size:clamp(46px,7vw,108px);line-height:.9;letter-spacing:-.1em;margin:12px 0 0}.about h2 em{font-style:normal;color:var(--lime)}.about p{font-size:clamp(17px,2vw,25px);line-height:1.65;font-weight:700;margin:0 0 20px}.orbit-text{position:absolute;right:-90px;top:-80px;width:320px;height:320px;border:1px dashed rgba(255,255,255,.7);border-radius:50%;font:11px "DM Mono",monospace;letter-spacing:.12em;padding:68px 28px;transform:rotate(-15deg);animation:spin 14s linear infinite}.contact{background:var(--lime);padding:clamp(65px,10vw,120px) 20px;text-align:center;display:flex;flex-direction:column;align-items:center}.contact span,.contact small{font:11px "DM Mono",monospace;letter-spacing:.1em}.contact a{font-size:clamp(38px,7vw,110px);letter-spacing:-.09em;font-weight:900;text-decoration:none;border-bottom:4px solid var(--ink);margin:10px 0 20px}.contact a b{color:var(--pink)}footer{display:flex;justify-content:space-between;padding:20px clamp(18px,4vw,64px);font:10px "DM Mono",monospace;letter-spacing:.09em}.case-dialog{padding:0;width:min(1280px,calc(100% - 24px));height:min(88vh,850px);border:0;border-radius:22px;background:var(--paper);color:var(--ink);overflow:hidden}.case-dialog::backdrop{background:rgba(34,31,51,.65);backdrop-filter:blur(7px)}.dialog-close{position:absolute;z-index:4;right:17px;top:17px;width:48px;height:48px;border-radius:50%;border:1.5px solid var(--ink);background:var(--paper);font-size:31px;cursor:pointer}.case-layout{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(310px,.7fr);height:100%}.case-image-wrap{min-height:0;background:var(--case,#f5e5d9);display:grid;place-items:center;padding:26px;overflow:hidden}.case-image-wrap:before{content:"";position:absolute;width:28vw;height:28vw;border-radius:50%;background:var(--pink);filter:blur(2px);opacity:.42;animation:wobble 8s ease-in-out infinite}.case-image-wrap img{position:relative;max-width:100%;max-height:100%;object-fit:contain;border:1.5px solid var(--ink);box-shadow:10px 10px 0 var(--ink);animation:pop .55s cubic-bezier(.2,.9,.3,1)}.case-copy{padding:clamp(35px,5vw,70px) 30px;overflow:auto}.case-copy span{font:11px "DM Mono",monospace;letter-spacing:.1em}.case-copy h2{font-size:clamp(38px,4.5vw,69px);line-height:.92;letter-spacing:-.09em;margin:18px 0}.case-copy p{font-size:15px;line-height:1.8}.case-meta{margin-top:32px;border-top:1px solid var(--ink);list-style:none;padding:0}.case-meta li{border-bottom:1px solid var(--ink);padding:13px 0;font-size:13px}.case-meta b{width:72px;display:inline-block;font:10px "DM Mono",monospace;color:var(--blue)}@keyframes ticker{to{transform:translateX(-50%)}}@keyframes float{50%{translate:0 -18px;rotate:5deg}}@keyframes wobble{50%{border-radius:62% 38% 65% 35%;transform:rotate(24deg) scale(1.08)}}@keyframes spin{to{transform:rotate(345deg)}}@keyframes pop{from{opacity:0;transform:scale(.92) rotate(-4deg)}to{opacity:1;transform:scale(1) rotate(0)}}@media(max-width:760px){.cursor-dot,.cursor-ring{display:none}.nav nav{display:none}.palette-toggle span{display:none}.hero{min-height:620px;background:linear-gradient(150deg,#e5e3ff 0 47%,#d8fbff 47%)}.hero:before{right:-39vw;top:-7vw}.hero:after{width:45vw;height:45vw}.sticker-a{right:25%;top:20%}.sticker-b{right:4%;bottom:20%;width:73px;height:73px}.flower{right:11%;top:43%}.section-intro{display:block}.section-intro p{margin:20px 0 0}.work-grid{display:block}.work-card,.work-card:nth-child(2),.work-card:nth-child(5){display:block;width:100%;min-height:390px;margin-bottom:14px}.work-card.hidden{display:none}.about{display:block;min-height:580px}.about p{margin-top:44px}.orbit-text{right:-130px;top:-95px}.case-dialog{height:min(92vh,900px)}.case-layout{grid-template-columns:1fr;grid-template-rows:48% 52%}.case-copy{padding:28px}.case-image-wrap{padding:18px}.case-image-wrap:before{width:70vw;height:70vw}.contact a{border-width:3px}footer{flex-direction:column;gap:8px}}
