/* Creative desk · shared tokens, existing components and original assets. */
:root{--color-bg:#f8f7f2;--color-surface:#fffefa;--color-text:#30352f;--color-muted:#64675f;--color-yellow:#f5edb5;--color-pink:#f2dfe0;--color-green:#e2ebdb;--color-blue:#e1ebf2;--color-purple:#e8e2f1;--color-orange:#f2dfc9;--color-border:#dcded4;--color-paper:var(--color-bg);--color-white:var(--color-surface);--color-ink:var(--color-text);--color-body:#51584f;--color-accent:#52684d;--color-accent-hover:#354d35;--color-tint:var(--color-green);--color-sand:var(--color-orange);--color-note:var(--color-yellow);--color-focus:#80543b;--border:1px solid var(--color-border);--color-line:var(--color-border);--radius-sm:8px;--radius-md:14px;--radius-lg:18px;--shadow-paper:0 4px 12px #323c2b0b;--shadow-dialog:0 22px 70px #30352f26;--container:1160px;--gutter:44px;--section-space:88px;--text-h2:clamp(1.9rem,3vw,2.65rem);--motion:180ms ease;--leading-body:1.85;--space-note:24px;scroll-padding-top:108px}
body{background:var(--color-bg)}h1,h2,h3{text-wrap:balance}.heading-translation{font:500 .48em/1.6 var(--font-sans);letter-spacing:.02em;color:var(--color-muted);margin-top:8px}.eyebrow{font-size:11px;letter-spacing:.11em}.header{padding-top:14px;top:-14px;border:0;background:var(--color-bg)}.header-inner{background:var(--color-surface);border:var(--border);border-radius:14px;min-height:66px;padding:0 22px}.brand-name{font-size:17px}.brand-sub{font-size:9px}.header nav{gap:20px}.header nav a{font-size:12px;min-height:44px;display:flex;align-items:center}.header nav a.active{color:var(--color-accent);font-weight:600}.header nav a:after{bottom:3px;background:var(--color-green);height:5px;border-radius:3px;z-index:-1}.nav-contact{font-size:11px;padding-left:16px}.header-inner{gap:20px}
.hero{display:grid;grid-template-columns:1.2fr 1fr;gap:64px;align-items:center;padding-block:58px 40px}.hero-main{min-width:0}.hero .eyebrow{font-size:10px;margin-bottom:26px}.intro{font-size:14px;display:flex;align-items:center;gap:13px;margin-bottom:16px}.hello-sticker{font:italic 20px var(--font-serif);background:var(--color-yellow);padding:7px 13px;border-radius:3px;transform:rotate(-5deg)}.hero h1{font-size:clamp(3.8rem,5.3vw,5rem);line-height:1.13;letter-spacing:-.05em;margin-bottom:20px;font-weight:600}.hero-name-en{display:inline!important;font:400 20px var(--font-sans);letter-spacing:-.02em;color:var(--color-muted);margin-left:16px}.personal-tags{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:23px}.personal-tags span{font-size:11px;line-height:1.5;padding:5px 9px;border-radius:5px;background:var(--color-blue)}.personal-tags span:nth-child(2){background:var(--color-green)}.personal-tags span:nth-child(3){background:var(--color-purple)}.personal-tags span:nth-child(4){background:var(--color-pink)}.hero-role{font-size:20px;margin-bottom:14px}.role-note{font-size:11px}.hero-description{font-size:14px;line-height:1.95;max-width:520px;margin-bottom:24px}.hero-actions{gap:24px}.button{min-height:46px;border-radius:8px;padding:12px 20px;font-size:13px}.text-link{font-size:13px}.desk-board{position:relative;min-height:410px;display:grid;grid-template-columns:1.05fr 1fr;align-items:center;gap:0;padding:24px 8px}.desk-note{position:relative;background:var(--color-yellow);padding:27px 23px 22px;transform:rotate(-3deg);box-shadow:var(--shadow-paper);border-radius:3px;z-index:2;margin-right:-28px;align-self:start;margin-top:26px}.desk-note:before,.desk-photo:before{content:'';position:absolute;top:-10px;left:30%;width:72px;height:22px;background:var(--color-blue);opacity:.9;transform:rotate(5deg);pointer-events:none}.note-label{font:10px var(--font-mono);letter-spacing:.08em;color:var(--color-muted)}.desk-note>p{font-size:22px;font-weight:500;line-height:1.6;margin:18px 0}.desk-keywords{display:flex;flex-wrap:wrap;gap:6px 10px;font-size:10px;color:var(--color-muted);margin-bottom:22px}.desk-note>a{display:inline-flex;align-items:center;min-height:40px;font-size:12px;border-bottom:1px solid currentColor}.desk-photo{position:relative;margin:0 0 0 0;padding:9px 9px 14px;background:var(--color-surface);border:var(--border);border-radius:4px;transform:rotate(5deg);align-self:end;box-shadow:var(--shadow-paper);z-index:3}.desk-photo:before{left:50%;background:var(--color-pink);transform:rotate(-12deg);width:57px}.desk-photo a{display:block;overflow:hidden}.desk-photo img{display:block;width:100%;height:auto}.desk-photo figcaption{font-size:10px;padding:12px 3px 0;display:flex;justify-content:space-between}.desk-scribble{position:absolute;left:12px;bottom:20px;font:italic 17px var(--font-serif);color:var(--color-muted);transform:rotate(-4deg)}
.hero-directory{display:grid;grid-template-columns:200px 1fr;column-gap:35px;align-items:start;background:transparent;padding:24px 0;border-radius:0;border-block:var(--border);box-shadow:none}.hero-directory .index-heading{grid-column:1;margin-bottom:10px}.hero-directory .index-heading .eyebrow{margin:0}.hero-directory .index-heading>span{display:none}.hero-directory h2{grid-column:1;font-size:18px;line-height:1.6;margin:0}.hero-directory .index-description,.hero-directory .index-foot{display:none}.hero-directory #project-index{grid-column:2;grid-row:1/3;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.hero-directory .index-item{display:grid;grid-template-columns:1fr 20px;gap:6px;border:0;padding:5px 0;min-height:88px}.hero-directory .index-number{grid-column:1/-1;background:var(--color-purple);padding:3px 8px;border-radius:4px;width:fit-content;font-size:10px}.hero-directory .index-item:nth-child(2) .index-number{background:var(--color-blue)}.hero-directory .index-item:nth-child(3) .index-number{background:var(--color-orange)}.hero-directory .index-item strong{font-size:12px;line-height:1.7}.ticker{border:0}.ticker>div{padding-block:22px;gap:24px}.ticker>div>span{font-size:12px}.ticker small{font-size:11px;margin-top:5px}
.section-heading{margin-bottom:38px;gap:44px}.section-heading .eyebrow,.experience-intro>.eyebrow{display:table;background:var(--color-yellow);padding:5px 10px;border-radius:4px;transform:rotate(-2deg);margin-bottom:18px}.section-note{font-size:13px;max-width:300px}.work-grid{gap:46px 36px;grid-template-columns:1.08fr 1fr}.work-card.featured{grid-template-columns:1.35fr 1fr;gap:36px;border:0;background:transparent;overflow:visible;align-items:center}.work-visual{position:relative;border-radius:var(--radius-md);background:var(--color-blue);min-height:315px;padding:26px;border:1px solid #cfdce3}.featured .work-visual{background:var(--color-green);color:var(--color-ink);min-height:425px;padding:30px;border:1px solid #cbd7c5;border-radius:var(--radius-md);transform:rotate(-.7deg)}.featured .work-visual:before{content:'';position:absolute;top:-12px;left:42%;width:86px;height:26px;background:var(--color-yellow);opacity:.9;transform:rotate(-4deg)}.cover-experiment{background:var(--color-orange);border-color:#e1ceba}.work-card:nth-child(3){padding-top:30px}.cover-index{background:var(--color-surface);padding:5px 9px;border-radius:6px;font-size:12px}.featured .work-body{padding:20px 0}.work-body{padding-top:23px}.work-body h3,.featured .work-body h3{font-size:25px;line-height:1.5;margin-bottom:14px}.work-category{font-size:10px;letter-spacing:.07em;display:table;align-self:flex-start;padding:5px 9px;background:var(--color-purple);border-radius:4px;color:var(--color-body)}.work-card:nth-child(2) .work-category{background:var(--color-blue)}.work-card:nth-child(3) .work-category{background:var(--color-orange)}.project-summary{font-size:14px;line-height:1.9;margin-bottom:22px}.project-metric,.featured .project-metric{font-family:var(--font-sans);font-size:32px;letter-spacing:-.04em;font-weight:500}.project-metric-label{font-size:11px}.project-outcome{gap:16px}.case-button{min-height:47px;font-size:13px;margin-top:18px}.tag,.project-period{font-size:11px}.evidence-note{font-size:11px;max-width:860px}.intent-line strong{font-size:26px}.action-bar{background:#52684d;color:var(--color-surface);border-radius:8px}.rule-diagram>p,.growth-diagram>p{font-size:25px}.cover-caption{font-size:11px}.cover-caption>span:last-child{font-size:10px}
.vibe-section{background:transparent;border-block:var(--border)}.vibe-section .section-heading .eyebrow{background:var(--color-purple);transform:rotate(1deg)}.vibe-card:first-child{grid-template-columns:1.22fr 1fr;gap:48px;align-items:center}.vibe-visual{position:relative;background:var(--color-surface);border-radius:12px;border:var(--border);overflow:visible;box-shadow:var(--shadow-paper)}.vibe-browser{background:var(--color-blue);border-radius:12px 12px 0 0;padding:12px 18px;border-color:var(--color-border)}.vibe-canvas{padding:28px}.vibe-preview-title{font-size:27px}.vibe-preview-features{gap:22px 18px}.vibe-preview-features>div{border-top:var(--border);padding-top:14px}.vibe-feature-number{display:inline-block;padding:3px 7px;background:var(--color-yellow);border-radius:4px;color:var(--color-text)}.vibe-preview-features>div:nth-child(2) .vibe-feature-number{background:var(--color-pink)}.vibe-preview-features>div:nth-child(3) .vibe-feature-number{background:var(--color-green)}.vibe-preview-features>div:nth-child(4) .vibe-feature-number{background:var(--color-purple)}.vibe-preview-features strong{font-size:14px}.vibe-preview-caption{font-size:10px;margin-top:26px}.vibe-status{padding:6px 10px;border-radius:6px;background:var(--color-green);color:#40573a}.vibe-status:before{background:#52684d}.vibe-body h3{font-size:27px}.vibe-subtitle{font:400 16px/1.6 var(--font-sans);color:var(--color-muted);margin-bottom:20px}.vibe-description{font-size:14px}.vibe-tags{gap:7px;font-size:10px}.vibe-tags li{background:var(--color-purple);padding:5px 8px;border-radius:4px}.vibe-tags li+li{border:0;padding-left:8px}.vibe-tags li:nth-child(2){background:var(--color-blue)}.vibe-tags li:nth-child(3){background:var(--color-pink)}.vibe-cover{border-radius:0 0 12px 12px}
.approach-section{background:transparent;border-top:0;border-bottom:var(--border)}.architecture{margin-block:34px 40px;border-color:var(--color-border)}.architecture>span{border-color:var(--color-border)}.process-grid{gap:26px}.process-grid article{padding-top:18px;border-top:var(--border)}.step{font-size:10px}.step>span{background:var(--color-blue);padding:3px 7px;border-radius:3px}.process-grid article:nth-child(2) .step>span{background:var(--color-green)}.process-grid article:nth-child(3) .step>span{background:var(--color-purple)}.process-grid article:nth-child(4) .step>span{background:var(--color-orange)}.process-grid h3{font-size:18px;margin-block:18px 12px}.process-grid p{font-size:14px;line-height:1.9}.experience-section{grid-template-columns:1fr 1.5fr;gap:44px 65px}.experience-intro>.eyebrow{background:var(--color-pink);font-size:10px}.experience-intro h2{font-size:31px;line-height:1.5}.experience-intro>p:not(.eyebrow){font-size:14px}.timeline h3{font-size:20px}.timeline .description{font-size:14px}.timeline .period{background:var(--color-blue);width:fit-content;padding:5px 9px;border-radius:4px;font-size:11px}.timeline article:nth-child(2) .period{background:var(--color-green)}.timeline article:nth-child(3) .period{background:var(--color-orange)}.education{background:var(--color-surface);border:var(--border);padding:26px;border-radius:12px;gap:30px}.education h3{font-size:20px}.education strong{font-size:14px}
.photography-section{padding-block:40px 70px}.photography-section .section-heading .eyebrow{background:var(--color-pink)}.photography-preview{grid-template-columns:1.08fr .9fr .86fr 1.06fr;gap:20px;align-items:start;padding:12px 5px 0}.photography-preview figure{position:relative}.photography-preview figure:first-child{padding:8px 8px 13px;background:var(--color-surface);border:var(--border);border-radius:3px;transform:rotate(-2deg);box-shadow:var(--shadow-paper)}.photography-preview figure:first-child:before{content:'';position:absolute;left:36%;top:-10px;width:62px;height:23px;background:var(--color-yellow);opacity:.9;transform:rotate(-5deg);z-index:1;pointer-events:none}.photography-preview figure:nth-child(2){margin-top:32px}.photography-preview figure:nth-child(3){margin-top:64px}.photography-preview figure:nth-child(4){margin-top:14px;transform:rotate(1.5deg)}.photography-preview a,.photography-all a{border-radius:5px}.photography-preview img,.photography-all img{transition:transform var(--motion),filter var(--motion)}.photography-preview figcaption{font-size:11px;padding-top:12px}.photography-controls{margin-top:26px}.photography-all{gap:28px}.photography-toggle,.vibe-toggle{min-height:44px;font-size:13px}
.contact-section{padding-block:38px 44px;border-top:var(--border)}.contact-top .eyebrow{background:var(--color-yellow);padding:5px 9px;border-radius:4px;transform:rotate(-2deg)}.contact-section h2{font-size:clamp(1.9rem,3.6vw,3.1rem);line-height:1.5}.contact-section .accent{background:var(--color-yellow);box-decoration-break:clone;padding-inline:4px;color:var(--color-ink)}.contact-bottom p{font-size:14px}.contact-label{font-size:10px}.footer{font-size:11px}.email-address{font-size:15px}.text-link,.index-item,.desk-note a,.photography-toggle,.vibe-toggle{transition:color var(--motion),background var(--motion)}
@media(hover:hover) and (pointer:fine){.primary:hover{background:var(--color-accent-hover)}.secondary:hover{background:var(--color-yellow)}.desk-photo{transition:transform var(--motion)}.desk-photo:hover{transform:rotate(3deg) translateY(-3px)}.photography-preview a:hover img,.photography-all a:hover img{transform:scale(1.02);filter:none}.hero-directory .index-item:hover{color:var(--color-accent)}.vibe-toggle:hover,.photography-toggle:hover{background:var(--color-yellow)}.desk-note a:hover{color:var(--color-accent)}}
@media(min-width:761px) and (max-width:1100px){:root{--gutter:30px;--section-space:74px}.header-inner{padding-inline:16px;gap:16px}.header nav{gap:15px}.brand-sub{display:none}.hero{gap:32px;padding-top:44px}.hero h1{font-size:60px}.hero-name-en{font-size:16px;margin-left:10px}.desk-board{min-height:390px;padding-inline:0}.desk-note{padding:22px 16px;margin-right:-20px}.desk-note>p{font-size:20px}.desk-scribble{font-size:15px}.hero-directory{grid-template-columns:165px 1fr;gap:22px}.hero-directory #project-index{gap:14px}.work-card.featured{gap:28px}.featured .work-visual{padding:24px}.featured .work-body h3{font-size:23px}.vibe-card:first-child{gap:30px}.vibe-canvas{padding:25px}.experience-section{gap:40px}.photography-preview{gap:16px}}
@media(max-width:760px){:root{--gutter:22px;--section-space:60px;--text-h2:28px;scroll-padding-top:88px}.header{padding-top:8px;top:-8px}.header-inner{padding-inline:14px;min-height:60px;border-radius:12px}.brand-name{font-size:15px}.brand-sub{font-size:8px;letter-spacing:.03em}.header nav{gap:3px;padding-bottom:12px}.header nav a{display:flex;min-height:44px;padding:9px 10px;margin:0}.header nav a:after{bottom:4px;left:10px;right:10px}.hero{display:block;padding-block:36px 30px}.hero h1{font-size:58px;margin-bottom:18px}.hero-name-en{font-size:16px;margin-left:12px}.hero .eyebrow{font-size:10px;margin-bottom:22px}.intro{font-size:13px}.hello-sticker{font-size:18px}.personal-tags{gap:6px;margin-bottom:21px}.personal-tags span{font-size:10px;padding:4px 7px}.hero-role{font-size:19px;gap:12px}.hero-description{font-size:14px;line-height:1.9}.hero-actions{gap:20px}.button{font-size:12px;padding-inline:16px}.desk-board{min-height:270px;margin-top:30px;grid-template-columns:1.2fr .8fr;gap:16px;padding:10px 4px 0;max-width:430px}.desk-note{transform:none;margin:10px 0 0;padding:22px 16px;align-self:start}.desk-note>p{font-size:20px;margin:14px 0}.desk-note:before{width:50px;height:17px;top:-8px}.desk-keywords{font-size:9px;margin-bottom:8px}.desk-note>a{font-size:11px;min-height:36px}.desk-photo{transform:rotate(2deg);padding:5px 5px 9px;align-self:center}.desk-photo:before{display:none}.desk-photo figcaption{font-size:9px;padding:9px 1px 0}.desk-scribble{display:none}.hero-directory{display:block;padding:21px 0}.hero-directory h2{display:none}.hero-directory .index-heading{margin-bottom:12px}.hero-directory #project-index{display:block}.hero-directory .index-item{grid-template-columns:28px 1fr 20px;min-height:48px;border-top:var(--border);gap:10px;padding-block:10px}.hero-directory .index-number{grid-column:auto;font-size:10px;padding:4px 6px}.hero-directory .index-item strong{font-size:12px}.ticker>div{gap:18px;padding-block:20px}.ticker>div>span{font-size:12px}.ticker small{font-size:10px}.section-heading{margin-bottom:28px}.section-note{font-size:13px;margin-top:16px}.section-heading .eyebrow{font-size:10px;margin-bottom:14px}.work-grid{grid-template-columns:1fr;gap:34px}.work-card.featured{display:block}.work-card:nth-child(3){padding-top:0}.featured .work-visual{min-height:360px;padding:22px;transform:none}.featured .work-visual:before{width:65px;height:20px;top:-10px}.featured .work-body{padding:24px 0 0}.work-body h3,.featured .work-body h3{font-size:23px}.project-summary{font-size:14px}.project-metric,.featured .project-metric{font-size:30px}.work-visual{min-height:290px;padding:22px}.intent-line strong{font-size:23px}.rule-diagram>p,.growth-diagram>p{font-size:24px}.vibe-card:first-child{display:block}.vibe-canvas{padding:23px 20px}.vibe-body h3{font-size:24px}.vibe-subtitle{font-size:15px}.vibe-preview-title{font-size:24px}.vibe-preview-features strong{font-size:13px}.vibe-preview-features{gap:20px 14px}#vibe-title{font-size:27px}.process-grid{gap:0}.process-grid article{padding-block:20px}.process-grid h3{font-size:18px}.process-grid p{font-size:14px}.experience-section{display:block}.experience-intro{margin-bottom:32px}.experience-intro h2{font-size:28px}.timeline h3{font-size:20px}.education{display:grid;grid-template-columns:1fr;margin-top:32px;gap:22px;padding:22px}.education>div:not(:first-child){padding-top:18px;border-top:var(--border)}.photography-section{padding-block:32px 52px}.photography-preview{grid-template-columns:1fr .94fr;gap:24px 16px;padding-inline:0}.photography-preview figure:first-child{padding:5px 5px 10px;transform:none}.photography-preview figure:first-child:before{width:45px;height:18px;top:-8px}.photography-preview figure:nth-child(3){margin-top:0}.photography-preview figure:nth-child(even){margin-top:23px;transform:none}.photography-preview figcaption{font-size:10px}.photography-all{gap:24px 16px}.contact-section h2{font-size:28px}.contact-top{align-items:flex-start}.contact-label{font-size:9px}.contact-bottom{gap:22px}.email-address{font-size:14px}.footer{gap:17px}.heading-translation{font-size:14px}}
@media(max-width:360px){:root{--gutter:18px}.brand-sub{display:none}.hero h1{font-size:51px}.hero-name-en{font-size:14px;margin-left:8px}.personal-tags{gap:5px}.personal-tags span{font-size:9px}.desk-board{gap:10px;grid-template-columns:1.15fr .85fr}.desk-note{padding:20px 13px}.desk-note>p{font-size:18px}.desk-photo figcaption{font-size:8px}.hero-actions{gap:17px}.cover-caption>span:last-child{font-size:9px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}