/* KUROKO's studio: live websites, a working desk, and a scroll into the portfolio. */
.studio-journey{position:relative;background:#080808}.kuro-studio .digital-studio{position:relative;height:calc(100svh - 78px);min-height:780px;max-height:none;padding:28px 4.5% 0;background:radial-gradient(ellipse at 73% 48%,#20251c 0, #10120f 33%,#080808 68%);overflow:clip}.digital-studio::after{content:'';position:absolute;inset:0;pointer-events:none;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='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' opacity='.16' filter='url(%23n)' d='M0 0h180v180H0z'/%3E%3C/svg%3E");opacity:.1;z-index:1}.kuro-studio .digital-studio .hero-topline{position:relative;z-index:12;letter-spacing:.15em}.kuro-studio .digital-studio .hero-topline>span:last-child{font-size:9px;color:#818777}.kuro-studio .digital-studio .hero-copy{width:40%;margin-top:105px;z-index:8;max-width:none}.kuro-studio .digital-studio h1{font-size:clamp(42px,4.75vw,86px)}.kuro-studio .digital-studio .hero-line{line-height:1.48;white-space:nowrap;letter-spacing:-.065em}.digital-studio .kuro-hero-description{margin-top:30px;font-size:15px;line-height:2.1;color:#b6bbae}.kuro-studio .digital-studio>.hero-actions{position:relative;z-index:8;margin-top:30px;width:fit-content;gap:12px}.kuro-studio .digital-studio .hero-consult{border:0;background:#f3f0e8;color:#0a0b08;min-width:288px;min-height:60px;padding:14px 23px;border-radius:3px;font-size:15px;transition:background .25s}.kuro-studio .digital-studio .hero-consult:hover{padding:14px 23px;background:#c7ff3d}.kuro-studio .digital-studio .hero-project-link{position:relative;padding:2px 0;color:#c1c7b8;font-size:13px;gap:32px}.digital-studio .hero-project-link::after{content:'';position:absolute;bottom:1px;left:0;width:30%;height:1px;background:#c7ff3d;transition:width .3s}.digital-studio .hero-project-link:hover::after{width:100%}.digital-studio :is(a,button):focus-visible{outline:2px solid #c7ff3d;outline-offset:6px}.kuro-studio .digital-studio .studio-world{position:absolute;top:75px;right:0;width:64%;height:calc(100% - 110px);isolation:auto;perspective:1400px}.studio-world::before{inset:30% 25% 10%;background:radial-gradient(ellipse,#d1d9b221,transparent 70%)}.studio-grid{position:absolute;inset:3% -5% 0 -10%;background-image:linear-gradient(#c5dca006 1px,transparent 1px),linear-gradient(90deg,#c5dca006 1px,transparent 1px);background-size:65px 65px;mask-image:radial-gradient(ellipse,#000,transparent 70%);transform:rotate(-9deg);pointer-events:none}.digital-studio .hero-kuro{top:23%;left:13%;width:73%;z-index:5;pointer-events:none;filter:drop-shadow(-6px -3px 9px #dcebc010) drop-shadow(0 24px 24px #0009);transform:translate3d(var(--kuro-x,0px),var(--kuro-y,0px),0)}.studio-window{position:absolute;display:block;z-index:3;transform:translate3d(var(--sx,0px),var(--sy,0px),0);transform-origin:center;will-change:transform}.studio-window-face{position:relative;border:1px solid #ecebda42;border-radius:5px;background:#1f231d;overflow:hidden;box-shadow:0 24px 45px #0008;transform:rotateY(var(--angle-y,0deg)) rotateZ(var(--angle,0deg));transition:transform .55s,filter .55s;filter:brightness(var(--brightness,.8)) blur(var(--blur,0px))}.studio-window:is(:hover,:focus-visible) .studio-window-face{transform:rotateY(0deg) rotateZ(0deg) scale(1.03);filter:brightness(1);border-color:#c7ff3d88}.studio-chrome{display:flex;justify-content:space-between;align-items:center;height:24px;padding:0 10px;font-size:7px;color:#c1c6b8;letter-spacing:.02em}.studio-chrome>span:first-child{font-size:6px;letter-spacing:2px;color:#656b5d}.studio-screen{position:relative;aspect-ratio:1100/770;overflow:hidden;background:#e7e6e0}.studio-screen iframe{display:block;position:absolute;top:0;left:0;width:1100px;height:770px;border:0;transform:scale(var(--screen-scale,.3));transform-origin:0 0;pointer-events:none}.studio-loading{position:absolute;inset:0;display:grid;place-items:center;color:#282b24;font-size:20px;letter-spacing:.2em}.studio-view{position:absolute;right:12px;bottom:12px;padding:9px 15px;background:#c7ff3d;color:#10130a;border-radius:2px;font-size:11px;opacity:0;transform:translateY(6px);transition:opacity .25s,transform .25s}.studio-window:is(:hover,:focus-visible) .studio-view{opacity:1;transform:none}.studio-nexia{left:3%;top:0;width:36%;--angle:-9deg;--angle-y:12deg;--brightness:.94;z-index:4}.studio-restaurant{right:10%;top:0;width:27%;--angle:10deg;--angle-y:-12deg;--brightness:.77;--blur:.15px}.studio-estate{right:3%;top:36%;width:29%;--angle:8deg;--angle-y:-15deg;--brightness:.85;z-index:6}.studio-beauty{left:-5%;top:51%;width:26%;--angle:-12deg;--angle-y:13deg;--brightness:.87;z-index:6}.studio-medical{right:5%;bottom:3%;width:26%;--angle:-5deg;--brightness:.8;z-index:6}.studio-tools{position:absolute;inset:0;z-index:2;pointer-events:none;transform:translate3d(var(--tool-x,0px),var(--tool-y,0px),0);color:#8f9787}.studio-tools small{display:block;font-size:7px;letter-spacing:.15em;color:#858e7b;margin-bottom:11px}.studio-palette{position:absolute;left:40%;top:4%;transform:rotate(-5deg)}.studio-palette>div{display:flex;align-items:center;gap:7px}.studio-palette i{width:16px;height:16px;border-radius:50%;background:#f3f0e8;border:1px solid #ffffff25}.studio-palette i:nth-child(2){background:#232622}.studio-palette i:nth-child(3){background:#8a8f85}.studio-palette i:nth-child(4){background:#c7ff3d;width:22px;height:22px;box-shadow:0 0 0 3px #c7ff3d16}.studio-type{position:absolute;left:7%;top:32%;transform:rotate(-4deg)}.studio-type>span{font-size:36px;letter-spacing:-.08em;line-height:1}.studio-type>span>span{font-size:26px;margin-left:13px;color:#ced2c7}.studio-process{position:absolute;right:37%;top:19%;display:grid;gap:9px;border-left:1px solid #8b967933;padding:4px 0 4px 13px;font-size:8px;letter-spacing:.1em}.studio-process .current{color:#c7ff3d}.studio-process i{display:inline-block;width:4px;height:4px;border-radius:50%;background:#c7ff3d;margin-left:12px}.studio-code{position:absolute;left:25%;bottom:4%;transform:rotate(-5deg)}.studio-code code{font-size:9px;line-height:1.8;color:#6c7561}.studio-code b{font-weight:400;color:#abb896}.studio-toolbar{position:absolute;right:2%;top:8%;display:grid;gap:17px;padding:15px 11px;background:#151913;border:1px solid #ffffff13;border-radius:10px;transform:rotate(5deg)}.studio-toolbar svg{width:16px;height:16px;fill:none;stroke:#859177;stroke-width:1.3}.studio-toolbar svg:first-child{stroke:#c7ff3d;fill:#c7ff3d14}.studio-desk{position:absolute;left:16%;right:28%;bottom:7%;height:100px;z-index:7;pointer-events:none;transform:translate3d(var(--tool-x,0px),0,0)}.studio-paper{position:absolute;left:0;top:22px;width:120px;height:82px;transform:rotate(-20deg) skewX(25deg);border:1px solid #aeb99624;background:#171b16;box-shadow:4px 6px #0a0c09;padding:12px;display:grid;grid-template-columns:1fr 1fr;gap:5px}.studio-paper i{border:1px solid #75806b38}.studio-paper i:first-child{grid-column:span 2;height:8px}.studio-paper span{font-size:4px;white-space:nowrap;color:#859176}.studio-pen{position:absolute;top:20px;left:130px;width:5px;height:87px;background:linear-gradient(90deg,#121610,#57604d,#11140f);transform:rotate(46deg);border-radius:2px}.studio-cup{position:absolute;right:0;top:17px;width:40px;height:44px;border-radius:7px 7px 16px 16px;background:linear-gradient(90deg,#10130f,#3c4237,#131610);box-shadow:5px 11px 12px #0008}.studio-cup::before{content:'';position:absolute;top:-4px;width:100%;height:11px;border-radius:50%;border:3px solid #4f5746;background:#11170e}.studio-cup::after{content:'';position:absolute;right:-13px;top:8px;width:18px;height:24px;border:5px solid #252d20;border-radius:50%;z-index:-1}.studio-note{position:absolute;left:0;bottom:8%;font-size:11px;line-height:1.8;letter-spacing:.07em;font-family:'Hiragino Maru Gothic ProN',sans-serif;color:#a3b889;transform:rotate(-8deg);z-index:7}.studio-note svg{position:absolute;left:85%;top:0;width:68px;fill:none;stroke:#a6cb72;stroke-width:1}.studio-world-caption{position:absolute;bottom:0;left:37%;font-size:6px;letter-spacing:.18em;color:#69725c}.digital-studio .kuro-scroll{z-index:9;bottom:20px;left:4.5%;right:4.5%;font-size:9px}.digital-studio .kuro-scroll>span:last-child{font-size:8px;letter-spacing:.14em}
@media(min-width:1700px){.kuro-studio .digital-studio .hero-copy{margin-top:10vh}.studio-world{max-width:1200px}}
@media(max-width:1100px) and (min-width:801px){.kuro-studio .digital-studio{min-height:820px}.kuro-studio .digital-studio .hero-copy{margin-top:120px}.kuro-studio .digital-studio h1{font-size:4.8vw}.kuro-studio .digital-studio .studio-world{top:120px;height:650px}.studio-nexia{left:7%}.studio-beauty{left:0%;width:28%}.studio-note{display:none}.studio-type{left:5%}.studio-code{bottom:0%}}
@media(max-width:800px){.studio-journey.is-animated{height:auto;min-height:0}.kuro-studio .digital-studio,.studio-journey.is-animated .digital-studio{position:relative;top:auto;height:auto;min-height:0;max-height:none;padding:25px 6% 66px;display:flex;flex-direction:column}.kuro-studio .digital-studio .hero-topline{order:0;font-size:8px}.kuro-studio .digital-studio .hero-topline>span:last-child{display:none}.kuro-studio .digital-studio .hero-copy{order:1;width:100%;margin-top:43px}.kuro-studio .digital-studio h1{font-size:clamp(36px,8.9vw,65px)}.kuro-studio .digital-studio .hero-line{line-height:1.5;letter-spacing:-.06em}.digital-studio .kuro-hero-description{font-size:15px;line-height:2;margin-top:23px}.digital-studio .kuro-hero-description br:first-child{display:initial}.kuro-studio .digital-studio .studio-world{order:2;position:relative;top:auto;right:auto;width:calc(100% + 12vw);margin:0 -6vw;height:660px;perspective:none}.digital-studio .hero-kuro{left:6%;top:0;width:88%;max-width:510px;right:0;margin:auto}.studio-nexia{left:8%;top:59%;width:52%;--angle:-7deg}.studio-restaurant{right:5%;top:74%;width:38%;--angle:7deg;--brightness:.95;z-index:6}.studio-beauty{left:6%;top:84%;width:32%;--angle:-6deg;--brightness:.9}.studio-estate,.studio-medical,.studio-type,.studio-code,.studio-toolbar,.studio-process,.studio-desk,.studio-note,.studio-world-caption{display:none}.studio-palette{top:11%;left:8%;transform:rotate(-7deg)}.studio-window-face{--angle-y:0deg}.studio-chrome{height:19px;padding:0 6px;font-size:5px}.studio-chrome>span:first-child{font-size:4px;letter-spacing:1px}.studio-view{opacity:1;transform:none;font-size:9px;padding:5px 8px;right:6px;bottom:6px}.kuro-studio .digital-studio>.hero-actions{order:3;width:100%;margin:40px 0 0;gap:13px;align-items:stretch}.kuro-studio .digital-studio .hero-consult{min-width:0;width:100%;max-width:none;font-size:15px;min-height:60px}.kuro-studio .digital-studio .hero-project-link{align-self:center;font-size:14px;min-height:44px}.digital-studio .kuro-scroll{bottom:16px;font-size:8px;left:6%;right:6%}.digital-studio .kuro-scroll>span:last-child{font-size:6px}.studio-grid{inset:0}.digital-studio .hero-kuro{animation:studio-breathe 7s ease-in-out infinite}.kuro-looking-down .hero-kuro{translate:none}}
@media(min-width:501px) and (max-width:800px){.kuro-studio .digital-studio .studio-world{height:800px}.studio-nexia{top:53%;width:45%;left:8%}.studio-restaurant{top:64%;width:37%}.studio-beauty{top:78%;width:28%}.kuro-studio .digital-studio>.hero-actions{max-width:450px;margin-left:auto;margin-right:auto}.digital-studio .hero-kuro{width:70%}}
@media(max-width:380px){.kuro-studio .digital-studio .studio-world{height:600px}.studio-nexia{top:56%}.studio-restaurant{top:72%}.studio-beauty{top:82%}.digital-studio .kuro-hero-description{font-size:14px}}
@keyframes studio-breathe{50%{transform:translateY(4px)}}
@media(prefers-reduced-motion:reduce){.studio-journey.is-animated{height:auto;min-height:0}.studio-journey.is-animated .digital-studio{position:relative;top:auto}.digital-studio *, .digital-studio *::after{animation:none!important;transition:none!important}.studio-window{will-change:auto}}
.motion-paused .digital-studio *{animation:none!important;transition:none!important}
@media(min-width:801px){.digital-studio .hero-kuro{top:auto;bottom:0;width:min(73%,calc(100svh - 260px))}.studio-type{top:38%}.studio-code{left:0;bottom:16%}}
@media(min-width:801px){.studio-type{top:40%}.studio-code{top:83%;bottom:auto;left:2%}.studio-note{bottom:2%}}
@media(min-width:801px){.studio-note{bottom:0}.studio-code code{font-size:8px;line-height:1.6}}
/* Revision 2: natural document flow, quieter screens, a softly lit working desk. */
.kuro-studio .digital-studio{position:relative;top:auto}.studio-journey{height:auto;min-height:0}.digital-studio::before{content:'';position:absolute;inset:0;background:#080808;opacity:var(--studio-dim,0);z-index:10;pointer-events:none}.studio-window{pointer-events:none}.studio-nexia{width:31%;left:6%;top:3%;--brightness:.8}.studio-window-face{border-color:#ecebda28;box-shadow:0 22px 40px #0007}.digital-studio .hero-kuro{filter:drop-shadow(-8px -5px 16px #dae6bd08) drop-shadow(0 25px 22px #000a)}.hero-kuro .kuro-eyes{filter:drop-shadow(0 5px 5px #0009)}.studio-connections{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none;fill:none;stroke:#a0c46b;stroke-width:.7;opacity:.3}.studio-connections text{fill:#899b70;stroke:none;font-size:7px;letter-spacing:2px}.studio-connections circle{fill:#c7ff3d}.studio-desk-surface{position:absolute;bottom:0;left:8%;width:88%;height:20%;z-index:4;pointer-events:none;transform:perspective(600px) rotateX(55deg) rotateZ(-2deg);background:linear-gradient(170deg,#2c3027 0,#151813 22%,#0b0e0a 80%);border-top:1px solid #c0cbaa20;box-shadow:0 18px 28px #0009}.studio-notebook{position:absolute;right:22%;top:72px;width:100px;height:53px;transform:rotate(-9deg) skewX(20deg);background:#13170f;border:1px solid #454c372e;box-shadow:2px 3px #080b07}.studio-notebook span{position:absolute;left:12px;top:12px;color:#869474;font-size:6px;letter-spacing:1px}.studio-process{z-index:4}.studio-paper{background:#1d2318}.kuro-studio .kuro-intro .intro-content h2{font-size:clamp(34px,5vw,80px);line-height:1.65}.kuro-studio .kuro-intro .intro-bottom p{font-size:17px;line-height:2.1}.kuro-studio .kuro-intro .intro-bottom{max-width:650px}.studio-code{opacity:.7}
@media(max-width:800px){.studio-nexia{left:8%;top:59%;width:52%;--brightness:.9}.studio-connections,.studio-desk-surface,.studio-notebook{display:none}.kuro-studio .kuro-intro .intro-content h2{font-size:7.3vw}.kuro-studio .kuro-intro .intro-bottom p{font-size:15px}.studio-window-face{filter:brightness(.9)}}
@media(min-width:501px) and (max-width:800px){.studio-nexia{top:53%;width:45%}}
@media(max-width:380px){.studio-nexia{top:56%}}
.kuro-studio .kuro-intro .intro-bottom p br{display:initial}
/* Official supplied KUROKO artwork, kept intact at its original 3:2 aspect ratio. */
.kuro-studio .digital-studio .hero-kuro-asset{left:5%;bottom:3%;top:auto;width:91%;max-width:none;filter:none;z-index:5;isolation:isolate}.hero-kuro-asset img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:contain;mask-image:linear-gradient(90deg,transparent,#000 7%,#000 94%,transparent),linear-gradient(0deg,transparent,#000 8%,#000 96%,transparent);mask-composite:intersect;animation:official-kuro-idle 9s ease-in-out infinite;transform-origin:50% 80%}.digital-studio .studio-desk-surface{opacity:.35}.digital-studio .studio-desk{z-index:4}.digital-studio .studio-estate,.digital-studio .studio-medical{z-index:6}.digital-studio .studio-note{left:-1%;bottom:2%}.digital-studio .studio-connections{opacity:.22}
@keyframes official-kuro-idle{50%{transform:translateY(-3px) rotate(.2deg)}}
@media(max-width:800px){.kuro-studio .digital-studio .hero-kuro-asset{width:112%;left:-6%;right:auto;top:20px;bottom:auto;max-width:none;margin:0;animation:none}.hero-kuro-asset img{mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent),linear-gradient(0deg,transparent,#000 10%,#000 96%,transparent)}.studio-palette{top:1%;left:8%}.kuro-studio .digital-studio .studio-world{height:590px}.studio-nexia{top:52%}.studio-restaurant{top:68%}.studio-beauty{top:80%}}
@media(min-width:501px) and (max-width:800px){.kuro-studio .digital-studio .hero-kuro-asset{width:94%;left:3%;top:15px}.kuro-studio .digital-studio .studio-world{height:870px}.studio-nexia{top:58%}.studio-restaurant{top:70%}.studio-beauty{top:80%}}
@media(max-width:380px){.kuro-studio .digital-studio .studio-world{height:550px}}
@media(prefers-reduced-motion:reduce){.hero-kuro-asset img{animation:none!important}}
.motion-paused .hero-kuro-asset img{animation:none!important}

/* Shared lightweight previews instead of embedded demo documents. */
.studio-screen>img{display:block;width:100%;height:100%;object-fit:cover;object-position:top;pointer-events:none;}