@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;500&display=swap');
:root{--bg:#090b0b;--panel:#101313;--paper:#e6e6d8;--muted:#92968d;--line:rgba(230,230,216,.14);--red:#e0231c;--amber:#cc9e62;--pad:clamp(22px,6vw,94px);--mono:'DM Mono',monospace;--sans:'Manrope',sans-serif;--ease:cubic-bezier(.2,.75,.2,1)}*{box-sizing:border-box}html{scroll-behavior:smooth;background:var(--bg)}body{margin:0;background:var(--bg);color:var(--paper);font:400 15px/1.65 var(--sans);overflow-x:hidden}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}::selection{background:var(--red);color:white}.grain{position:fixed;inset:0;z-index:8;pointer-events:none;opacity:.075;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='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.28'/%3E%3C/svg%3E")}.scroll-progress{position:fixed;top:0;left:0;width:0;height:2px;background:var(--red);z-index:30}.topbar{position:fixed;top:0;left:0;right:0;height:78px;padding:0 var(--pad);display:flex;align-items:center;justify-content:space-between;z-index:20;backdrop-filter:blur(12px);background:linear-gradient(#090b0bcc,transparent);border-bottom:1px solid transparent;transition:.3s}.topbar.scrolled{border-color:var(--line);background:#090b0bd9}.wordmark{display:flex;align-items:center;gap:10px;font-size:12px;font-weight:700;letter-spacing:.06em}.wordmark i{font:9px var(--mono);color:var(--muted);font-style:normal;margin-left:8px}.seal{display:grid;place-items:center;width:30px;height:30px;color:#fff;background:var(--red);font:15px 'Noto Sans JP',sans-serif;transform:rotate(-8deg);box-shadow:3px 3px 0 #a1130f}.seal.tiny{width:22px;height:22px;font-size:11px}.nav{display:flex;align-items:center;gap:clamp(18px,3vw,46px);font-size:11px;letter-spacing:.12em;text-transform:uppercase}.nav a{color:#c6c8bf;transition:color .2s}.nav a:hover{color:white}.nav-edit{border:1px solid var(--line);padding:9px 14px}.nav-edit span{color:var(--red)}.menu-toggle{display:none;background:none;border:0;color:white}.hero{position:relative;min-height:100svh;padding:155px var(--pad) 48px;display:flex;flex-direction:column;justify-content:space-between;isolation:isolate;overflow:hidden}.hero::before{content:"";position:absolute;inset:0;z-index:-2;background:radial-gradient(ellipse at 73% 38%,#361815 0,#131110 24%,transparent 54%),linear-gradient(112deg,#090b0b 35%,#11110f 100%)}.hero::after{content:"";position:absolute;inset:auto 0 0;height:30%;z-index:-1;background:linear-gradient(transparent,var(--bg))}.moon{position:absolute;top:18%;right:17%;width:clamp(120px,19vw,270px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 38% 35%,#f28761,#dd351f 52%,#8f1a18 73%,transparent 74%);filter:drop-shadow(0 0 70px #ba291d61);animation:moon 9s ease-in-out infinite alternate}.moon:after{content:"";position:absolute;inset:0;border-radius:50%;background:repeating-radial-gradient(ellipse at 28% 62%,transparent 0 18px,#601d1b17 19px 20px)}.torii{position:absolute;width:min(40vw,550px);height:48vh;right:9%;bottom:10%;opacity:.42;filter:drop-shadow(0 0 22px #e0231c20)}.hero-copy{max-width:850px;z-index:2}.eyebrow,.kicker{font:10px var(--mono);letter-spacing:.22em;text-transform:uppercase;color:var(--amber)}.hero h1{font-size:clamp(58px,11.5vw,166px);line-height:.91;letter-spacing:-.085em;margin:32px 0 26px;font-weight:500;max-width:900px}.hero h1 span{color:var(--red);font-family:'Noto Sans JP',sans-serif;font-weight:300;font-size:.63em;vertical-align:top;letter-spacing:0}.hero-sub{color:#b1b3a9;max-width:430px;font-size:clamp(14px,1.3vw,17px)}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:35px}.btn{display:inline-flex;align-items:center;gap:28px;padding:14px 18px;border:1px solid var(--line);font:10px var(--mono);letter-spacing:.12em;text-transform:uppercase;transition:transform .25s,background .25s,border-color .25s}.btn:hover{transform:translateY(-3px);border-color:var(--red)}.btn.primary{background:var(--red);border-color:var(--red);color:white}.btn.primary:hover{background:#fa3027}.hero-bottom{display:flex;justify-content:space-between;align-items:end;z-index:2}.hero-bottom p{margin:0;color:#92968d;font:10px/1.6 var(--mono);letter-spacing:.14em;text-transform:uppercase}.scroll-cue{display:flex;align-items:center;gap:14px;font:9px var(--mono);letter-spacing:.18em;color:var(--muted);text-transform:uppercase}.scroll-cue i{width:48px;height:1px;background:var(--red);animation:line 1.8s ease infinite;transform-origin:left}.section{padding:clamp(90px,13vw,180px) var(--pad);position:relative}.section-header{display:flex;align-items:center;gap:18px;margin-bottom:50px}.section-header .index{font:10px var(--mono);color:var(--red)}.section-header h2{font-size:clamp(30px,5vw,64px);font-weight:400;letter-spacing:-.065em;margin:0}.section-header .rule{height:1px;background:var(--line);flex:1}.intro-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:8vw;align-items:end}.intro-large{font-size:clamp(24px,4.2vw,56px);line-height:1.2;letter-spacing:-.055em;max-width:780px;margin:0}.intro-large em{font-style:normal;color:var(--red)}.intro-note{color:#9ea198;max-width:330px}.stats{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-top:75px}.stat{padding:24px 0}.stat+.stat{border-left:1px solid var(--line);padding-left:24px}.stat strong{display:block;font-size:30px;font-weight:400}.stat span{font:9px var(--mono);text-transform:uppercase;letter-spacing:.18em;color:var(--muted)}.projects{display:grid;grid-template-columns:1fr 1fr;gap:18px}.project-card{position:relative;min-height:400px;padding:26px;background:linear-gradient(145deg,#181918,#0e1010 72%);border:1px solid var(--line);overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;transition:transform .45s var(--ease),border-color .3s}.project-card:hover{transform:translateY(-7px);border-color:#e0231c80}.project-card:before{content:attr(data-mark);position:absolute;right:-12px;top:-90px;color:#e0231c12;font:300 clamp(190px,32vw,420px)/1 'Noto Sans JP',sans-serif;pointer-events:none}.project-top,.project-bottom{position:relative;z-index:1;display:flex;justify-content:space-between;align-items:center}.project-meta{font:9px var(--mono);letter-spacing:.15em;text-transform:uppercase;color:var(--amber)}.project-card h3{font-size:clamp(30px,4vw,48px);letter-spacing:-.06em;font-weight:400;margin:0 0 12px}.project-card p{color:#a7aaa0;max-width:430px;font-size:13px}.project-tags{display:flex;gap:8px;flex-wrap:wrap}.tag{border:1px solid var(--line);border-radius:99px;padding:5px 9px;font:8px var(--mono);color:#a9aba2}.round-link{width:38px;height:38px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;transition:.25s}.round-link:hover{background:var(--red);border-color:var(--red);transform:rotate(45deg)}.skills{display:flex;gap:12px;flex-wrap:wrap}.skill{padding:16px 20px;border:1px solid var(--line);color:#d0d1c7;font-size:13px;transition:.3s}.skill:hover{border-color:var(--red);background:#e0231c12;transform:translateY(-4px)}.cta{background:linear-gradient(110deg,#141514,#1b100e);border:1px solid var(--line);padding:clamp(28px,6vw,70px);display:flex;justify-content:space-between;align-items:end;gap:25px}.cta h2{font-size:clamp(36px,7vw,84px);font-weight:400;letter-spacing:-.07em;line-height:1;margin:12px 0}.cta p{color:#a5a79e;max-width:350px}.page-top{padding:170px var(--pad) 75px;min-height:43vh;background:radial-gradient(ellipse at 82% 60%,#451b16 0,transparent 40%)}.page-top h1{font-size:clamp(54px,10vw,128px);line-height:.9;letter-spacing:-.08em;font-weight:400;margin:24px 0}.page-top p{color:var(--muted);max-width:470px}.timeline{border-top:1px solid var(--line)}.timeline-row{display:grid;grid-template-columns:190px 1fr;gap:40px;padding:30px 0;border-bottom:1px solid var(--line)}.timeline-date{font:10px var(--mono);color:var(--red);letter-spacing:.1em}.timeline-row h3{margin:0 0 6px;font-size:21px;font-weight:500}.timeline-row p{margin:4px 0;color:#a3a59c;max-width:690px}.contact-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:8vw}.contact-info a{display:block;border-bottom:1px solid var(--line);padding:18px 0;color:var(--paper)}.contact-info a span{font:9px var(--mono);color:var(--muted);display:block;text-transform:uppercase;letter-spacing:.17em}.contact-form{display:grid;gap:18px}.field label{display:block;font:9px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}.field input,.field textarea{width:100%;padding:13px 14px;color:var(--paper);background:#0d1010;border:1px solid var(--line);outline:none}.field input:focus,.field textarea:focus{border-color:var(--red)}.field textarea{min-height:145px;resize:vertical}.form-note{color:var(--muted);font-size:11px}.footer{padding:28px var(--pad);border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:16px;align-items:center;font:9px var(--mono);letter-spacing:.08em;color:#adb0a5}.footer>div{display:flex;align-items:center;gap:9px}.footer a{color:var(--paper)}.muted{color:var(--muted)}.red{color:var(--red)}.reveal{opacity:0;transform:translateY(24px);transition:opacity .8s var(--ease),transform .8s var(--ease)}.reveal.visible{opacity:1;transform:none}.toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%,16px);background:#202321;color:white;border:1px solid var(--line);padding:12px 18px;z-index:40;opacity:0;transition:.3s;pointer-events:none}.toast.show{opacity:1;transform:translate(-50%,0)}.editor-shell{max-width:1050px;margin:auto}.editor-card{background:var(--panel);border:1px solid var(--line);padding:clamp(22px,4vw,44px);margin:25px 0}.editor-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.editor-card input,.editor-card textarea{width:100%;background:#090b0b;color:var(--paper);border:1px solid var(--line);padding:11px}.editor-card textarea{min-height:100px}.editor-card label{display:block;font:9px var(--mono);color:var(--muted);text-transform:uppercase;letter-spacing:.12em;margin-bottom:6px}.editor-actions{display:flex;gap:10px;flex-wrap:wrap}.editor-hint{font-size:12px;color:var(--muted)}.kage-wrap{padding-top:78px;height:calc(100vh - 78px);min-height:600px}.kage-wrap iframe{width:100%;height:100%;border:0}.petal{position:absolute;color:#f17870;font-size:16px;animation:fall linear infinite;opacity:.5;pointer-events:none}@keyframes moon{to{transform:translateY(14px) scale(1.025)}}@keyframes line{50%{transform:scaleX(.35)}}@keyframes fall{0%{transform:translate3d(0,-8vh,0) rotate(0);opacity:0}10%{opacity:.65}90%{opacity:.45}100%{transform:translate3d(45px,100vh,0) rotate(260deg);opacity:0}}@media(max-width:760px){.topbar{height:68px}.menu-toggle{display:flex;flex-direction:column;gap:6px;width:30px;padding:6px;z-index:2}.menu-toggle span{height:1px;background:white;width:100%;transition:.25s}.menu-toggle[aria-expanded=true] span:first-child{transform:translateY(3.5px) rotate(45deg)}.menu-toggle[aria-expanded=true] span:last-child{transform:translateY(-3.5px) rotate(-45deg)}.nav{position:absolute;top:68px;left:0;right:0;display:none;flex-direction:column;align-items:stretch;gap:0;background:#090b0bf5;padding:10px var(--pad) 22px;border-bottom:1px solid var(--line)}.nav.open{display:flex}.nav a{padding:13px 0}.nav-edit{border:0;padding-left:0}.hero{padding-top:130px;min-height:92svh}.moon{top:20%;right:7%;opacity:.8}.torii{width:74vw;height:38vh;right:-8%;bottom:16%}.hero h1{font-size:clamp(56px,16vw,110px)}.hero-bottom{align-items:flex-start}.intro-grid,.contact-grid{grid-template-columns:1fr;gap:24px}.projects{grid-template-columns:1fr}.project-card{min-height:330px}.section{padding-top:88px;padding-bottom:88px}.timeline-row{grid-template-columns:1fr;gap:8px}.stats{margin-top:45px}.stat+.stat{padding-left:10px}.stat strong{font-size:23px}.stat span{font-size:7px}.cta{align-items:start;flex-direction:column}.footer{flex-wrap:wrap}.editor-grid{grid-template-columns:1fr}.page-top{padding-top:140px}.scroll-cue{display:none}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.reveal{opacity:1;transform:none}}

.trap{position:absolute!important;left:-10000px!important;top:auto!important;width:1px!important;height:1px!important;overflow:hidden!important}
.has-photo{grid-template-columns:clamp(150px,19vw,250px) 1.1fr .8fr;align-items:center}.profile-photo{margin:0;max-width:250px}.profile-photo img{width:100%;aspect-ratio:4/5;object-fit:cover;filter:saturate(.78);border:1px solid var(--line);padding:7px;background:#101313}.profile-photo figcaption{font:9px var(--mono);color:#d8d8cc;margin-top:10px}.profile-photo figcaption span{color:var(--muted)}.photo-editor{display:flex;align-items:center;gap:20px;border-top:1px solid var(--line);padding-top:20px;margin:24px 0}.photo-editor img{width:85px;height:85px;object-fit:cover;border-radius:50%;border:1px solid var(--line)}.photo-editor img[hidden]{display:none}.photo-editor>div{flex:1}.photo-editor input{color:var(--muted);font-size:12px}.photo-editor label{font:9px var(--mono);color:var(--muted);text-transform:uppercase;letter-spacing:.12em}.photo-editor .editor-hint{margin:5px 0 0}@media(max-width:760px){.has-photo{grid-template-columns:1fr}.profile-photo{width:160px;margin-bottom:12px}}
.hero-copy{position:relative;max-width:64vw}.hero-portrait{position:absolute;z-index:3;right:clamp(36px,9vw,138px);top:19%;width:clamp(210px,24vw,330px);margin:0;padding:8px;border:1px solid #e6e6d82e;background:#0c0e0ed9;box-shadow:0 25px 80px #0009;transform:rotate(2deg);transition:transform .6s var(--ease)}.hero-portrait:hover{transform:rotate(0) translateY(-5px)}.hero-portrait img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;object-position:center 47%;filter:grayscale(1) contrast(1.04)}.hero-portrait figcaption{display:flex;align-items:center;gap:10px;padding:9px 4px 2px;font:9px var(--mono);letter-spacing:.08em;color:var(--paper)}.hero-portrait figcaption i{font-style:normal;color:var(--muted)}.hero-portrait .seal{flex:0 0 auto}@media(max-width:760px){.hero-copy{max-width:100%}.hero-portrait{top:87px;right:var(--pad);width:68px;padding:3px;transform:none}.hero-portrait img{aspect-ratio:1;object-fit:cover;border-radius:50%}.hero-portrait figcaption{display:none}.hero-copy .eyebrow{max-width:calc(100% - 85px)}}

/* Ambient Japanese night-garden motion */
:root{--scroll-y:0px;--hero-scroll:0px;--pointer-x:0;--pointer-y:0}
body::before,body::after{content:"";position:fixed;inset:-18vh -12vw;z-index:-1;pointer-events:none;will-change:transform,background-position}
body::before{opacity:.52;background:radial-gradient(ellipse at 16% 24%,#9c33251b,transparent 30%),radial-gradient(ellipse at 82% 68%,#b88a3910,transparent 32%),radial-gradient(ellipse at 54% 8%,#37494722,transparent 34%);background-size:160% 160%;animation:night-drift 26s ease-in-out infinite alternate;transform:translate3d(calc(var(--pointer-x)*-8px),calc(var(--pointer-y)*-7px),0)}
body::after{opacity:.11;background-image:radial-gradient(#e9cda2 0.7px,transparent .8px),radial-gradient(#e9cda2 0.6px,transparent .7px);background-size:83px 83px,131px 131px;background-position:0 calc(var(--scroll-y)*-.11),37px calc(var(--scroll-y)*-.2);mask-image:linear-gradient(transparent,#000 20%,#000 82%,transparent)}
.hero::before{will-change:background-position,transform;animation:hero-breathe 18s ease-in-out infinite alternate;background-size:150% 150%;background-position:calc(50% + var(--pointer-x)*1.2%) calc(50% + var(--pointer-y)*.8%)}
.moon{transform:translate3d(calc(var(--pointer-x)*-9px),calc(var(--hero-scroll)*-.45 + var(--pointer-y)*-7px),0);will-change:transform,filter;animation:moon 9s ease-in-out infinite alternate, moon-glow 7s ease-in-out infinite alternate}
.torii{transform:translate3d(calc(var(--pointer-x)*5px),calc(var(--hero-scroll)*-.16),0);transform-origin:center bottom;will-change:transform;animation:torii-sway 11s ease-in-out infinite alternate}
.hero-portrait{animation:portrait-float 7s ease-in-out infinite alternate}
.hero-portrait:hover{animation-play-state:paused}
.section-header .rule{transform-origin:left;animation:rule-breathe 4s ease-in-out infinite alternate}
.reveal{opacity:0;transform:translate3d(0,28px,0) scale(.99);filter:blur(4px);transition:opacity .8s var(--ease),transform .8s var(--ease),filter .8s var(--ease)}
.reveal.visible{opacity:1;transform:translate3d(0,0,0) scale(1);filter:blur(0)}
.hero .reveal:nth-child(2){transition-delay:.12s}.hero .reveal:nth-child(3){transition-delay:.24s}.hero .reveal:nth-child(4){transition-delay:.36s}
.hobby-card,.skill-tag,.timeline-row,.contact-info>a,.field input,.field textarea{transition:transform .35s var(--ease),border-color .3s,background-color .3s,box-shadow .35s}
.hobby-card:hover{transform:translateY(-9px) rotateX(2deg);border-color:#e0231c80;box-shadow:0 22px 48px #0006,0 0 26px #e0231c13}
.hobby-card:hover .hobby-symbol{transform:translateY(-4px) rotate(-8deg);color:var(--red)}
.hobby-symbol{transition:transform .45s var(--ease),color .3s}
.skill-tag:hover{transform:translateY(-4px);border-color:#e0231c;box-shadow:0 9px 24px #0005}
.timeline-row:hover{transform:translateX(7px);border-color:#e0231c66}
.contact-info>a:hover{transform:translateX(5px);border-color:#e0231c}
.btn{position:relative;overflow:hidden}.btn::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 20%,#ffffff20 48%,transparent 72%);transform:translateX(-130%);transition:transform .55s var(--ease);pointer-events:none}.btn:hover::after{transform:translateX(130%)}
.nav a:not(.nav-edit){position:relative}.nav a:not(.nav-edit)::after{content:"";position:absolute;left:0;right:100%;bottom:-5px;height:1px;background:var(--red);transition:right .3s var(--ease)}.nav a:not(.nav-edit):hover::after{right:0}
@keyframes night-drift{0%{background-position:0 20%}100%{background-position:100% 80%}}
@keyframes hero-breathe{0%{background-size:145% 145%}100%{background-size:165% 165%}}
@keyframes moon-glow{0%{filter:drop-shadow(0 0 48px #ba291d4a)}100%{filter:drop-shadow(0 0 88px #ba291d75)}}
@keyframes torii-sway{0%{rotate:-.4deg}100%{rotate:.4deg}}
@keyframes portrait-float{0%{translate:0 0;rotate:2deg}100%{translate:0 -8px;rotate:1deg}}
@keyframes rule-breathe{0%{transform:scaleX(.78);opacity:.55}100%{transform:scaleX(1);opacity:1}}
@media(max-width:760px){.hero::before{animation-duration:30s}.moon{width:94px;top:16%;right:8%;opacity:.48;transform:translate3d(0,calc(var(--hero-scroll)*-.3),0)}.torii{width:62vw;height:30vh;right:-10%;bottom:7%;opacity:.2;transform:translate3d(0,calc(var(--hero-scroll)*-.12),0)}.hero-portrait{animation:none}.hobby-card:hover,.timeline-row:hover{transform:translateY(-3px)}}
@media(prefers-reduced-motion:reduce){body::before,body::after,.hero::before,.moon,.torii,.hero-portrait,.section-header .rule{animation:none!important}.moon,.torii{transform:none!important}.reveal{filter:none!important;opacity:1!important;transform:none!important;transition:none!important}.hobby-card,.skill-tag,.timeline-row,.contact-info>a,.btn::after{transition:none!important}}

/* Personal Japanese zine theme: new type, angular controls, paper-like cards. */
:root{--sans:'Outfit','Zen Kaku Gothic New',sans-serif;--display:'Outfit','Zen Kaku Gothic New',sans-serif;--jp:'Zen Kaku Gothic New',sans-serif;--red:#e62d25;--corner-cut:14px}
body{font-family:var(--sans)}h1,h2,h3,.wordmark{font-family:var(--display)}.hero h1{font-weight:600;letter-spacing:-.075em}.nav{font-size:10px;letter-spacing:.16em}
.section{overflow:clip}.section::before{content:"";position:absolute;top:0;left:var(--pad);right:var(--pad);height:1px;background:linear-gradient(90deg,transparent,var(--line),#e0231c33,transparent);transform:scaleX(.8);transform-origin:left;opacity:.7}
.btn{clip-path:polygon(0 0,calc(100% - var(--corner-cut)) 0,100% var(--corner-cut),100% 100%,var(--corner-cut) 100%,0 calc(100% - var(--corner-cut)));border-radius:0;padding:15px 21px;transition:transform .35s cubic-bezier(.2,1.4,.35,1),filter .3s,box-shadow .35s,background .25s;box-shadow:5px 5px 0 #a91e18}
.btn:hover{transform:translateY(-5px) scale(1.035);box-shadow:8px 10px 0 #851c17,0 0 26px #e0231c35;filter:saturate(1.22)}.btn:active{transform:translateY(1px) scale(.98);box-shadow:2px 2px 0 #851c17}.btn.primary{background:linear-gradient(125deg,#ee392e,#be1e1b)}.nav-edit{clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,8px 100%,0 calc(100% - 8px));border:1px solid #e6e6d846}
.hobby-card,.language-card,.social-card,.editor-card,.timeline-row{border-radius:3px 24px 3px 3px;border:1px solid #e6e6d81b;background:linear-gradient(145deg,#151818df,#0e1010e8);box-shadow:0 16px 44px #0003;position:relative;overflow:hidden}
.hobby-card::before,.language-card::before,.social-card::before,.editor-card::before{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 15%,#ffffff09 50%,transparent 82%);transform:translateX(-120%);transition:transform .8s var(--ease);pointer-events:none}.hobby-card:hover::before,.language-card:hover::before,.social-card:hover::before,.editor-card:hover::before{transform:translateX(120%)}
.language-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px}.language-card{min-height:180px;padding:24px;display:flex;flex-direction:column;justify-content:space-between;transform:translateY(0) rotate(0);transition:transform .5s cubic-bezier(.2,1.35,.3,1),border-color .3s,box-shadow .4s;transition-delay:calc(var(--card-index)*25ms)}.language-card:hover{transform:translateY(-12px) rotate(-1.5deg) scale(1.025);border-color:#e0231c8c;box-shadow:0 28px 60px #0007,0 0 30px #e0231c22}.language-icon{display:grid;place-items:center;width:55px;height:55px;clip-path:polygon(10% 0,100% 0,90% 100%,0 88%);background:#e0231c;color:white;font:700 17px var(--mono);box-shadow:0 0 25px #e0231c30;animation:icon-bob 4s ease-in-out infinite;animation-delay:calc(var(--card-index)*-280ms)}.lang-c,.lang-cpp{background:#326a9d}.lang-html,.lang-html5{background:#e65a2c}.lang-css,.lang-css3{background:#2879b9}.lang-python{background:#34749d}.language-card h3{font-size:20px;margin:18px 0 3px}.language-caption{font:9px var(--mono);letter-spacing:.15em;text-transform:uppercase;color:var(--muted)}
.social-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.social-card{display:flex;align-items:center;gap:15px;min-height:86px;padding:16px;transition:transform .4s cubic-bezier(.2,1.3,.3,1),border-color .3s,box-shadow .3s}.social-card:hover{transform:translate(4px,-5px) rotate(-.5deg);border-color:#e0231c99;box-shadow:0 16px 40px #0007,0 0 23px #e0231c18}.social-icon{display:grid;place-items:center;flex:0 0 40px;height:40px;clip-path:polygon(15% 0,100% 12%,85% 100%,0 88%);background:#242323;color:#f0c8a4;font:500 11px var(--mono);transition:transform .4s,background .3s}.social-card:hover .social-icon{transform:rotate(12deg) scale(1.12);background:#b9221c}.social-card strong,.social-card small{display:block}.social-card strong{font-size:14px}.social-card small{color:var(--muted);font-size:11px}.social-arrow{margin-left:auto;color:var(--red);font-size:18px;transition:transform .3s}.social-card:hover .social-arrow{transform:translate(3px,-3px)}.contact-socials{grid-template-columns:1fr;margin-top:22px}
.admin-login{max-width:520px;margin:0 auto;padding:clamp(28px,5vw,52px);display:grid;gap:12px}.admin-login label{font:10px var(--mono);text-transform:uppercase;letter-spacing:.14em;color:var(--muted);margin-top:9px}.admin-login input{width:100%;min-height:48px;background:#090b0b;color:var(--paper);border:1px solid var(--line);padding:12px 14px;border-radius:2px 12px 2px 2px}.login-mark{font:44px var(--jp);color:var(--red);animation:seal-beat 3s ease-in-out infinite}.admin-login .btn{margin-top:12px;justify-self:start}.admin-login .form-note{min-height:1.5em}
.editor-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.editor-grid .field:has(textarea){grid-column:1/-1}.editor-card{padding:clamp(22px,4vw,42px)}.editor-card input,.editor-card textarea{border-radius:2px 15px 2px 2px}.editor-actions .btn,.editor-actions label.btn{cursor:pointer}
.hero-portrait{border-radius:2px 28px 2px 2px;animation:portrait-float 6s ease-in-out infinite alternate,portrait-flash 8s linear infinite;background:#111313;padding:9px;box-shadow:0 30px 80px #000b}.hero-portrait::before{content:"";position:absolute;inset:-2px;z-index:0;border-radius:3px 29px 3px 3px;background:conic-gradient(from 0deg,transparent 0 19%,#e0231c 24%,#f0bd84 30%,transparent 37% 65%,#e0231c 72%,transparent 79%);animation:frame-orbit 7s linear infinite;filter:blur(.5px)}.hero-portrait img,.hero-portrait figcaption{position:relative;z-index:1}.hero-portrait img{border-radius:2px 22px 2px 2px;transition:filter .6s,transform .8s var(--ease)}.hero-portrait:hover img{filter:grayscale(.35) contrast(1.12);transform:scale(1.025)}.profile-photo{position:relative;isolation:isolate}.profile-photo img{border-radius:2px 28px 2px 2px;animation:portrait-flash 8s linear infinite}
body::before{opacity:.74;background-image:radial-gradient(ellipse at 15% 20%,#ac2c252c,transparent 29%),radial-gradient(ellipse at 82% 64%,#d89b3a20,transparent 32%),radial-gradient(ellipse at 50% 95%,#267d7330,transparent 35%),radial-gradient(ellipse at 70% 10%,#ee48241c,transparent 25%);background-size:170% 180%;animation:night-drift 18s ease-in-out infinite alternate,ambient-pulse 9s ease-in-out infinite alternate}
body::after{opacity:.2;background-size:47px 47px,113px 113px;background-position:12px calc(var(--scroll-y)*-.18),29px calc(var(--scroll-y)*-.31);animation:stars-float 24s linear infinite}
.hero::before{background-image:radial-gradient(ellipse at 72% 36%,#70251bcc 0,#281513b5 26%,transparent 57%),radial-gradient(ellipse at 18% 85%,#06332b77,transparent 42%),linear-gradient(112deg,#090b0b 35%,#17110f 100%);animation:hero-breathe 13s ease-in-out infinite alternate}.hero::after{height:42%;background:linear-gradient(transparent 0%,#090b0b77 55%,var(--bg) 100%)}
.moon{animation:moon 8s ease-in-out infinite alternate,moon-glow 4s ease-in-out infinite alternate;filter:drop-shadow(0 0 76px #e23a2390)}.torii{opacity:.55;animation:torii-sway 8s ease-in-out infinite alternate}
.hobby-card{transition:transform .5s cubic-bezier(.2,1.25,.3,1),border-color .3s,box-shadow .4s}.hobby-card:hover{transform:translateY(-11px) rotate(-1deg) scale(1.015)}
.site-loader{position:fixed;inset:0;z-index:1000;background:#090b0b;display:grid;place-items:center;overflow:hidden;transition:visibility 1s}.loader-door{position:absolute;top:0;bottom:0;width:50.2%;z-index:2;background:repeating-linear-gradient(90deg,#e1d6bd 0 2px,#c9bda6 2px 4px,#ded2ba 4px 57px,#cbbda3 58px 60px);box-shadow:inset 0 0 60px #30241b55;transition:transform 1.15s cubic-bezier(.75,0,.2,1)}.loader-door-left{left:0;border-right:3px solid #e0231c}.loader-door-right{right:0;border-left:3px solid #e0231c}.loader-center{z-index:3;display:flex;flex-direction:column;align-items:center;gap:16px;color:var(--paper);transition:opacity .3s,transform .5s}.loader-kanji{font:clamp(70px,14vw,150px)/1 var(--jp);color:#e0231c;text-shadow:0 0 42px #e0231c77;animation:loader-stamp .8s cubic-bezier(.2,1.5,.3,1) both}.loader-name{font:10px var(--mono);letter-spacing:.32em}.loader-caption{font:10px var(--jp);letter-spacing:.16em;color:#c3b9a5}.loader-track{height:2px;width:150px;background:#ffffff24;overflow:hidden}.loader-track i{display:block;height:100%;background:#e0231c;transform-origin:left;animation:loading-line 1.1s cubic-bezier(.55,0,.25,1) both}.site-loader.is-opening .loader-door-left{transform:translateX(-102%)}.site-loader.is-opening .loader-door-right{transform:translateX(102%)}.site-loader.is-opening .loader-center{opacity:0;transform:scale(.9)}.site-loader.is-gone{visibility:hidden;pointer-events:none}
.petal{z-index:1;text-shadow:0 0 14px #ff594399;animation-name:petal-sway,fall;animation-duration:13s,18s!important;animation-timing-function:ease-in-out,linear!important;animation-iteration-count:infinite!important}
@keyframes frame-orbit{to{transform:rotate(1turn)}}@keyframes portrait-flash{0%,100%{box-shadow:0 0 22px #e0231c17}50%{box-shadow:0 0 42px #e0231c55}}@keyframes icon-bob{0%,100%{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-7px) rotate(3deg)}}@keyframes seal-beat{0%,100%{transform:rotate(-5deg) scale(1)}50%{transform:rotate(4deg) scale(1.08)}}@keyframes ambient-pulse{0%{filter:hue-rotate(-8deg) brightness(.85)}100%{filter:hue-rotate(14deg) brightness(1.15)}}@keyframes stars-float{to{background-position:12px calc(var(--scroll-y)*-.18 - 113px),29px calc(var(--scroll-y)*-.31 + 47px)}}@keyframes loading-line{0%{transform:scaleX(0)}100%{transform:scaleX(1)}}@keyframes loader-stamp{0%{transform:scale(1.8) rotate(-16deg);opacity:0;filter:blur(10px)}100%{transform:scale(1) rotate(0);opacity:1;filter:blur(0)}}@keyframes petal-sway{0%,100%{margin-left:0}50%{margin-left:24px}}
@media(max-width:760px){.social-grid{grid-template-columns:1fr}.language-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.language-card{min-height:154px;padding:17px}.editor-grid{grid-template-columns:1fr}.hero-portrait{border-radius:50%;animation:portrait-flash 8s linear infinite}.hero-portrait::before{border-radius:50%}.hero-portrait img{border-radius:50%}.hero::before{animation-duration:26s}}
@media(prefers-reduced-motion:reduce){.language-icon,.hero-portrait,.profile-photo img,.social-card,.hobby-card,.language-card{animation:none!important}.hobby-card:hover,.language-card:hover,.social-card:hover,.btn:hover{transform:none!important}.hobby-card::before,.language-card::before,.social-card::before,.editor-card::before{display:none}}
.site-loader{transition:visibility 1s,background-color .55s ease .45s}.site-loader.is-opening{background-color:transparent;pointer-events:none}
@property --frame-angle{syntax:'<angle>';inherits:false;initial-value:0deg}
.hero-portrait{--frame-angle:0deg;border:2px solid transparent;background:linear-gradient(#111313,#111313) padding-box,conic-gradient(from var(--frame-angle),#e0231c 0deg,transparent 75deg,#f0bd84 155deg,transparent 235deg,#e0231c 360deg) border-box;animation:portrait-float 6s ease-in-out infinite alternate,frame-orbit 7s linear infinite}
@keyframes frame-orbit{to{--frame-angle:360deg}}
@media(max-width:760px){.hero-portrait{animation:portrait-flash 8s linear infinite,frame-orbit 7s linear infinite}}
.language-card,.social-card,.hobby-card{transition:opacity .72s var(--ease),filter .72s var(--ease),transform .5s cubic-bezier(.2,1.3,.3,1),border-color .3s,box-shadow .4s}.hero-portrait.reveal{transition:opacity .8s var(--ease),filter .8s var(--ease),transform .8s var(--ease),rotate .8s var(--ease)}
.seal{font:700 9px var(--mono);letter-spacing:-.08em}.seal.tiny{font-size:7px}

/* Optional sound control */
.sound-toggle{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:34px;padding:7px 11px;border:1px solid var(--line);background:#111414;color:var(--muted);font:9px var(--mono);letter-spacing:.13em;text-transform:uppercase;cursor:pointer;clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,8px 100%,0 calc(100% - 8px));transition:color .25s,border-color .25s,background .25s,transform .3s,box-shadow .3s}.sound-toggle:hover{color:var(--paper);border-color:#e0231c99;background:#1a1110;transform:translateY(-2px);box-shadow:0 5px 20px #e0231c20}.sound-toggle:focus-visible{outline:2px solid var(--amber);outline-offset:4px}.sound-toggle[aria-pressed="true"]{color:var(--paper);border-color:#e0231c77}.sound-icon{display:inline-grid;place-items:center;width:17px;height:17px;color:var(--red);font:17px/1 var(--jp);transform-origin:center}.sound-toggle[aria-pressed="true"] .sound-icon{animation:sound-pulse 1.3s ease-in-out infinite}@keyframes sound-pulse{0%,100%{transform:scale(1);filter:drop-shadow(0 0 0 #e0231c00)}50%{transform:scale(1.16);filter:drop-shadow(0 0 5px #e0231caa)}}
@media(max-width:760px){.sound-toggle{justify-content:flex-start;min-height:42px;margin:8px 0;padding:10px 0;background:transparent;border:0;border-bottom:1px solid var(--line);clip-path:none}.sound-toggle:hover{transform:none;box-shadow:none}.sound-toggle:focus-visible{outline-offset:1px}}
@media(prefers-reduced-motion:reduce){.sound-icon{animation:none!important}}

/* The 1.5s homepage opener is an intentional first-impression sequence,
   so keep it visible even when the visitor requests reduced motion. */
@media(prefers-reduced-motion:reduce){
  #site-loader{display:grid!important;visibility:visible!important}
  #site-loader .loader-door{transition:transform 1.15s cubic-bezier(.75,0,.2,1)!important}
  #site-loader .loader-center{transition:opacity .3s,transform .5s!important}
  #site-loader .loader-kanji{animation:loader-stamp .8s cubic-bezier(.2,1.5,.3,1) both!important}
  #site-loader .loader-track i{animation:loading-line 1.1s cubic-bezier(.55,0,.25,1) both!important}
}

/* Pull-rope theme control, mounted just beneath the fixed navigation. */
.theme-rope{--rope-pull:0px;--rope-angle:0deg;position:absolute;top:67px;right:clamp(40px,6vw,94px);z-index:5;width:46px;height:130px;padding:0;border:0;background:transparent;color:var(--paper);cursor:grab;touch-action:none;overflow:visible;filter:drop-shadow(0 7px 10px #0005);transition:filter .3s;}
.theme-rope:hover,.theme-rope:focus-visible{filter:drop-shadow(0 0 13px #e0231c66)}.theme-rope:active{cursor:grabbing}.theme-rope:focus-visible{outline:2px solid var(--amber);outline-offset:3px;border-radius:24px}
.rope-anchor{position:absolute;top:-4px;left:50%;width:14px;height:9px;border:2px solid #ba874d;border-radius:50%;transform:translateX(-50%);background:#171512;box-shadow:0 0 0 3px #0002}
.rope-cord{position:absolute;top:2px;left:50%;width:3px;height:calc(100% - 28px + var(--rope-pull));border-radius:3px;background:repeating-linear-gradient(180deg,#c9a46d 0 3px,#725336 3px 5px);transform:translateX(-50%) rotate(var(--rope-angle));transform-origin:top center;transition:height .42s cubic-bezier(.2,1.5,.35,1),transform .42s cubic-bezier(.2,1.5,.35,1);box-shadow:1px 0 2px #0008}
.rope-tassel{position:absolute;top:calc(100% - 29px + var(--rope-pull));left:50%;display:grid;place-items:center;width:29px;height:35px;border:1px solid #f3b17888;border-radius:9px 9px 15px 15px;background:linear-gradient(125deg,#e34735 0%,#b51e1c 55%,#711a19 100%);transform:translateX(-50%) rotate(var(--rope-angle));transform-origin:top center;transition:top .42s cubic-bezier(.2,1.5,.35,1),transform .42s cubic-bezier(.2,1.5,.35,1),filter .25s;box-shadow:inset 2px 1px 4px #ffffff35,inset -3px -3px 5px #410b0b77,0 4px 8px #0005}
.rope-tassel::before{content:"";position:absolute;top:-5px;width:13px;height:7px;border-radius:5px 5px 1px 1px;background:linear-gradient(90deg,#9d1b19,#ef5744,#8a1717)}.rope-tassel::after{content:"";position:absolute;bottom:-7px;left:5px;width:17px;height:9px;background:repeating-linear-gradient(90deg,#b62a23 0 2px,#e14938 2px 3px);clip-path:polygon(0 0,100% 0,82% 100%,62% 22%,47% 100%,31% 22%,16% 100%)}
.rope-tassel i{display:grid;place-items:center;width:15px;height:15px;border:1px solid #ffd38a;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff4cb,#d99c55 60%,#713b22);box-shadow:0 0 7px #ffcf8b99;color:#4c2717;font:9px/1 var(--mono);font-style:normal}.rope-tassel i::before{content:"◐"}.theme-rope:hover .rope-tassel{filter:brightness(1.22);transform:translateX(-50%) rotate(-5deg) translateY(2px)}.theme-rope.is-pulling .rope-tassel{filter:brightness(1.3);transition-duration:.08s}.theme-rope.is-pulling .rope-cord{transition-duration:.08s}
@keyframes rope-sway{0%,100%{rotate:-2deg}50%{rotate:2deg}}.theme-rope:hover .rope-cord{animation:rope-sway 1.1s ease-in-out infinite}.theme-rope.is-pulling .rope-cord{animation:none}
.topbar:has(.nav.open) .theme-rope{opacity:0;pointer-events:none}

/* Deep ink and warm-paper modes share the same Japanese night-garden art. */
:root[data-theme="light"]{--bg:#eee8dc;--panel:#fff9ed;--paper:#27211c;--muted:#746b61;--line:rgba(57,43,32,.17);--red:#bd3027;--amber:#805728;color-scheme:light}
:root[data-theme="light"] body{background:var(--bg);color:var(--paper)}
:root[data-theme="light"] body::before{opacity:.44;background-image:radial-gradient(ellipse at 15% 20%,#ae39231b,transparent 29%),radial-gradient(ellipse at 82% 64%,#b98a391a,transparent 32%),radial-gradient(ellipse at 50% 95%,#36796918,transparent 35%),radial-gradient(ellipse at 70% 10%,#ee48240c,transparent 25%)}
:root[data-theme="light"] body::after{opacity:.14;background-image:radial-gradient(#775a3a 0.7px,transparent .8px),radial-gradient(#775a3a 0.6px,transparent .7px)}
:root[data-theme="light"] .topbar{background:linear-gradient(#f4eee3ed,#f4eee300);border-color:transparent}
:root[data-theme="light"] .topbar.scrolled{background:#f4eee3e8;border-color:var(--line)}
:root[data-theme="light"] .wordmark,:root[data-theme="light"] .nav a{color:#322821}
:root[data-theme="light"] .wordmark i,:root[data-theme="light"] .nav a:not(.nav-edit){color:#72675c}
:root[data-theme="light"] .nav a:hover{color:var(--red)}
:root[data-theme="light"] .nav-edit{color:#382c25;border-color:#57422e40}
:root[data-theme="light"] .hero::before{background-image:radial-gradient(ellipse at 74% 34%,#e8b6a04f 0,transparent 35%),radial-gradient(ellipse at 18% 85%,#b8d1bf55,transparent 42%),linear-gradient(112deg,#f1eadc 30%,#e8dece 100%)}
:root[data-theme="light"] .hero::after{background:linear-gradient(transparent 0%,#eee8dc66 65%,var(--bg) 100%)}
:root[data-theme="light"] .hero-sub,:root[data-theme="light"] .intro-note,:root[data-theme="light"] .timeline-row p,:root[data-theme="light"] .page-top p,:root[data-theme="light"] .project-card p,:root[data-theme="light"] .cta p{color:#685d52}
:root[data-theme="light"] .hero-bottom,:root[data-theme="light"] .footer{color:#665c51}
:root[data-theme="light"] .page-top{background:radial-gradient(ellipse at 82% 60%,#d3917530 0,transparent 40%)}
:root[data-theme="light"] .hobby-card,:root[data-theme="light"] .language-card,:root[data-theme="light"] .social-card,:root[data-theme="light"] .editor-card,:root[data-theme="light"] .timeline-row{border-color:#4c39291d;background:linear-gradient(145deg,#fff9edee,#e8dfd0f2);box-shadow:0 16px 44px #4c392918}
:root[data-theme="light"] .social-card strong,:root[data-theme="light"] .hobby-card h3,:root[data-theme="light"] .language-card h3{color:#29221d}
:root[data-theme="light"] .social-card small,:root[data-theme="light"] .language-caption,:root[data-theme="light"] .hobby-card p{color:#74685b}
:root[data-theme="light"] .skill,:root[data-theme="light"] .tag{color:#4b4036;border-color:#54412e30}
:root[data-theme="light"] .skill:hover{background:#bd302714}
:root[data-theme="light"] .cta{background:linear-gradient(110deg,#e8dfd0,#fff7e9);border-color:#58412e2b}
:root[data-theme="light"] .footer{border-color:var(--line)}
:root[data-theme="light"] .footer a{color:#33271f}
:root[data-theme="light"] .field label,:root[data-theme="light"] .admin-login label{color:#74675b}
:root[data-theme="light"] .field input,:root[data-theme="light"] .field textarea,:root[data-theme="light"] .admin-login input,:root[data-theme="light"] .editor-card input,:root[data-theme="light"] .editor-card textarea{color:#2b241e;background:linear-gradient(135deg,#fffaf0,#f3eadb);border-color:#65503b30;box-shadow:inset 0 2px 4px #57432b12,0 5px 15px #57432b0c}
:root[data-theme="light"] .field input::placeholder,:root[data-theme="light"] .field textarea::placeholder{color:#928374}
:root[data-theme="light"] .sound-toggle{color:#67594b;background:#fff8ec;border-color:#60492c36}
:root[data-theme="light"] .sound-toggle[aria-pressed="true"]{color:#342820;background:#f3e2ce}
:root[data-theme="light"] .theme-rope{filter:drop-shadow(0 7px 10px #513e2b25)}
:root[data-theme="light"] .rope-tassel i::before{content:"☼"}
:root[data-theme="light"] .rope-anchor{background:#eee8dc}
:root[data-theme="light"] .btn:not(.primary){color:#3c2d22;background:linear-gradient(145deg,#fff7e9,#e8ddcb);border-color:#6b4b302f;box-shadow:0 3px 0 #b8a38a,0 10px 24px #60432118,inset 0 1px #fff}
:root[data-theme="light"] .btn:not(.primary):hover{color:#211913;box-shadow:0 5px 0 #ab9277,0 16px 30px #60432126,inset 0 1px #fff}

/* Tactile, lantern-cut calls to action and paper-like form controls. */
.btn{isolation:isolate;clip-path:none;border-radius:3px 18px 3px 18px;padding:14px 19px;background:linear-gradient(145deg,#211e1a,#111313);border:1px solid #d8b07956;box-shadow:0 3px 0 #673025,0 10px 22px #0005,inset 0 1px #ffffff18;transition:transform .28s cubic-bezier(.2,1.35,.3,1),color .22s,background .25s,border-color .25s,box-shadow .28s,filter .25s}
.btn::before{content:"";position:absolute;inset:3px;z-index:-1;border:1px solid #eac48a26;border-radius:2px 14px 2px 14px;pointer-events:none;transition:inset .3s,border-color .3s}
.btn:hover{transform:translateY(-4px) rotate(-.6deg);box-shadow:0 6px 0 #673025,0 16px 32px #0006,0 0 24px #e0231c22,inset 0 1px #ffffff24;filter:saturate(1.16)}.btn:hover::before{inset:1px;border-color:#f3c98d6b}.btn:active{transform:translateY(2px) scale(.985);box-shadow:0 1px 0 #673025,0 3px 8px #0004}.btn span{display:inline-grid;place-items:center;width:24px;height:24px;border:1px solid #f5d29162;border-radius:50%;background:#fff1d70d;transition:transform .3s,background .3s}.btn:hover span{transform:rotate(45deg) scale(1.08);background:#fff1d71c}
.btn.primary{background:radial-gradient(ellipse at 20% 0,#ff6c4d 0,transparent 44%),linear-gradient(135deg,#e43b2d,#a7191a);border-color:#ffc18b88;box-shadow:0 3px 0 #731714,0 10px 24px #a4191845,inset 0 1px #ffffff38}.btn.primary::before{border-color:#ffe5c355}.btn.primary:hover{box-shadow:0 6px 0 #731714,0 17px 34px #a4191855,0 0 28px #e8433455,inset 0 1px #ffffff55}.btn.primary:active{box-shadow:0 1px 0 #731714,0 3px 8px #80131055}
.field{position:relative}.field label{transition:color .25s,transform .25s}.field:focus-within label{color:var(--amber);transform:translateX(3px)}
.field input,.field textarea{border-radius:3px 13px 3px 13px;background:linear-gradient(145deg,#101313,#0b0e0e);box-shadow:inset 0 2px 5px #0005,0 7px 18px #0002;transition:transform .25s,border-color .25s,box-shadow .25s,background .25s}
.admin-login input,.editor-card input:not([type="file"]),.editor-card textarea{border-radius:3px 13px 3px 13px;background:linear-gradient(145deg,#101313,#0b0e0e);box-shadow:inset 0 2px 5px #0005,0 7px 18px #0002;transition:transform .25s,border-color .25s,box-shadow .25s,background .25s}
.admin-login input:hover,.editor-card input:not([type="file"]):hover,.editor-card textarea:hover{border-color:#d6b47d66;transform:translateY(-1px)}
.admin-login input:focus,.editor-card input:not([type="file"]):focus,.editor-card textarea:focus{border-color:#e85a45;box-shadow:inset 0 2px 5px #0004,0 0 0 3px #e0231c17,0 9px 22px #0003;transform:translateY(-2px)}
.field input:hover,.field textarea:hover{border-color:#d6b47d66;transform:translateY(-1px)}
.field input:focus,.field textarea:focus{border-color:#e85a45;box-shadow:inset 0 2px 5px #0004,0 0 0 3px #e0231c17,0 9px 22px #0003;transform:translateY(-2px)}
.field textarea{background-image:repeating-linear-gradient(180deg,transparent 0 31px,#e6e6d80a 32px,#e6e6d80a 33px),linear-gradient(145deg,#101313,#0b0e0e);line-height:1.9}
body,.topbar,.topbar.scrolled,.footer,.cta,.hobby-card,.language-card,.social-card,.editor-card,.timeline-row,.field input,.field textarea{transition-property:background-color,background-image,color,border-color,box-shadow;transition-duration:.45s}
@media(max-width:760px){.theme-rope{top:62px;right:72px;height:112px}.topbar:has(.nav.open) .theme-rope{display:none}.btn{padding:13px 16px}.btn:hover{transform:translateY(-2px)}}
@media(prefers-reduced-motion:reduce){.theme-rope,.rope-cord,.rope-tassel,.btn,.btn::before,.btn span,.field label,.field input,.field textarea{transition:none!important}.theme-rope:hover .rope-cord{animation:none!important}.theme-rope:hover .rope-tassel,.btn:hover,.btn:active{transform:none!important}}

/* A single flexible hanging assembly keeps the cord attached to its lantern. */
.rope-hanging{position:absolute;top:2px;left:50%;width:30px;height:calc(100% - 28px + var(--rope-pull));transform:translateX(-50%) rotate(var(--rope-angle));transform-origin:50% 0;transition:height .42s cubic-bezier(.2,1.5,.35,1),transform .42s cubic-bezier(.2,1.5,.35,1);pointer-events:none}
.rope-cord{position:absolute;top:0;left:50%;width:3px;height:calc(100% - 15px);transform:translateX(-50%);transform-origin:top center;transition:none;background:repeating-linear-gradient(180deg,#c9a46d 0 3px,#725336 3px 5px);box-shadow:1px 0 2px #0008}
.rope-tassel{position:absolute;top:calc(100% - 15px);left:50%;display:grid;place-items:center;width:29px;height:35px;border:1px solid #f3b17888;border-radius:9px 9px 15px 15px;background:linear-gradient(125deg,#e34735 0%,#b51e1c 55%,#711a19 100%);transform:translateX(-50%);transform-origin:top center;transition:filter .25s;box-shadow:inset 2px 1px 4px #ffffff35,inset -3px -3px 5px #410b0b77,0 4px 8px #0005}
.theme-rope:hover .rope-hanging{animation:rope-sway 1.5s ease-in-out infinite}.theme-rope.is-pulling .rope-hanging{animation:none;transition-duration:.07s}.theme-rope:hover .rope-tassel{transform:translateX(-50%);filter:brightness(1.22)}.theme-rope.is-pulling .rope-tassel{filter:brightness(1.3)}
@keyframes rope-sway{0%,100%{rotate:-1.5deg}50%{rotate:1.5deg}}

/* Quiet sakura branches frame the scrolling canvas without obscuring content. */
.sakura-backdrop{position:fixed;inset:0;z-index:2;pointer-events:none;overflow:hidden;opacity:.16}
.sakura-branch{position:absolute;width:clamp(190px,27vw,390px);height:auto;overflow:visible;transform-origin:top left;animation:branch-sway 16s ease-in-out infinite alternate;filter:drop-shadow(0 10px 18px #9b3c2830)}
.sakura-branch-left{left:-270px;top:12vh}.sakura-branch-right{right:-330px;top:48vh;transform:scaleX(-1) rotate(-8deg);animation-delay:-7s;opacity:.78}
.branch-wood{fill:none;stroke:#65442f;stroke-width:7;stroke-linecap:round;stroke-linejoin:round}.branch-blooms{fill:#e897a4;stroke:#d98091;stroke-width:1.7;stroke-linejoin:round}.branch-centers{fill:#f5cf99}
@keyframes branch-sway{from{rotate:-1.2deg}to{rotate:1.2deg}}

/* Contact links use a layered paper-and-lacquer card with distinct platform accents. */
.social-card{min-height:104px;padding:18px 20px;border-radius:4px 22px 4px 4px;isolation:isolate;gap:16px;background:linear-gradient(120deg,#fffaf0ed,#eee4d5f2);border-color:#66503c30;box-shadow:0 12px 28px #50382313,inset 0 1px #fff}
.social-card::after{content:"";position:absolute;left:0;top:12px;bottom:12px;width:3px;background:var(--social-accent,#b4322a);transform:scaleY(.22);transform-origin:center;transition:transform .4s cubic-bezier(.2,1.3,.3,1);z-index:-1}
.social-card:hover{transform:translate(3px,-6px) rotate(-.35deg);border-color:color-mix(in srgb,var(--social-accent,#b4322a) 50%,transparent);box-shadow:0 22px 42px #50382322,0 0 25px color-mix(in srgb,var(--social-accent,#b4322a) 12%,transparent)}
.social-card:hover::after{transform:scaleY(1)}.social-discord{--social-accent:#5865f2}.social-instagram{--social-accent:#d24979}.social-github{--social-accent:#292522}.social-linkedin{--social-accent:#0a66c2}
.social-icon{clip-path:none;border-radius:12px 4px 12px 4px;background:linear-gradient(145deg,color-mix(in srgb,var(--social-accent,#ad2a24) 85%,white),var(--social-accent,#ad2a24));color:#fff;box-shadow:0 5px 12px color-mix(in srgb,var(--social-accent,#ad2a24) 22%,transparent);font-weight:700}
.social-copy{position:relative;z-index:1}.social-card strong{font-size:14px;letter-spacing:.01em;color:#29221d}.social-card small{margin-top:3px;color:#74685b;font-size:11px}.social-kanji{margin-left:auto;color:color-mix(in srgb,var(--social-accent,#ad2a24) 18%,transparent);font:500 33px/1 'Zen Kaku Gothic New',sans-serif;transition:transform .45s cubic-bezier(.2,1.3,.3,1),color .3s}.social-card:hover .social-kanji{transform:rotate(-12deg) scale(1.17);color:color-mix(in srgb,var(--social-accent,#ad2a24) 35%,transparent)}.social-arrow{position:relative;z-index:1;margin-left:0;color:var(--social-accent,#ad2a24);font-size:21px}.contact-socials .social-card{background:linear-gradient(120deg,#fffaf0ed,#eee4d5f2)}
:root[data-theme="dark"] .social-card{background:linear-gradient(145deg,#1c1d1aee,#111312f2);border-color:#e8dfca20;box-shadow:0 16px 36px #0004,inset 0 1px #ffffff0b}
:root[data-theme="dark"] .social-card strong{color:#eee6da}:root[data-theme="dark"] .social-card small{color:#aaa397}
:root[data-theme="dark"] .branch-wood{stroke:#d0a982}.sakura-backdrop{z-index:2}.hero,.section,.page-top,.footer{position:relative;z-index:1}.topbar{position:fixed;z-index:40}
@media(max-width:760px){.sakura-backdrop{opacity:.14}.sakura-branch{width:clamp(160px,43vw,270px)}.sakura-branch-left{left:-185px;top:15vh}.sakura-branch-right{right:-240px;top:55vh}.social-grid{grid-template-columns:1fr}.social-card{min-height:92px}}
@media(prefers-reduced-motion:reduce){.sakura-branch,.rope-hanging,.social-card::after,.social-kanji{animation:none!important;transition:none!important}}
.social-watermark{position:absolute;right:17px;top:50%;width:112px;height:112px;display:grid;place-items:center;transform:translateY(-50%) rotate(-8deg);color:var(--social-accent,#ad2a24);opacity:.10;pointer-events:none;z-index:0;transition:opacity .4s,transform .6s cubic-bezier(.2,1.2,.3,1)}
.social-watermark svg{display:block;width:100%;height:100%;overflow:visible;filter:drop-shadow(0 7px 10px color-mix(in srgb,var(--social-accent,#ad2a24) 15%,transparent))}
.social-card:hover .social-watermark{opacity:.17;transform:translateY(-50%) rotate(0) scale(1.1)}
.social-icon,.social-copy,.social-kanji,.social-arrow{position:relative;z-index:1}
.social-kanji{position:absolute;top:9px;right:15px;margin:0;font-size:11px;line-height:1;opacity:.62;z-index:2}.social-arrow{margin-left:auto}
:root[data-theme="dark"] .social-watermark{opacity:.13}:root[data-theme="dark"] .social-card:hover .social-watermark{opacity:.2}
@media(max-width:760px){.social-watermark{right:7px;width:92px;height:92px;opacity:.085}.social-card:hover .social-watermark{opacity:.15}}
@media(prefers-reduced-motion:reduce){.social-watermark,.social-watermark svg{transition:none!important;animation:none!important}}
.social-icon svg{display:block;width:23px;height:23px;fill:currentColor}
:root[data-theme="light"] .menu-toggle{color:#332821}
:root[data-theme="light"] .menu-toggle span{background:#332821}
@media(max-width:760px){.theme-rope{height:150px}.nav{z-index:2}:root[data-theme="light"] .nav{background:#f4eee3fa;box-shadow:0 14px 28px #49372518}:root[data-theme="light"] .nav a:not(.nav-edit){color:#514437}:root[data-theme="light"] .nav a:hover{color:var(--red)}}
.language-icon-svg{width:62px;height:62px;clip-path:none;background:transparent;box-shadow:none;animation:icon-bob 4s ease-in-out infinite;filter:drop-shadow(0 8px 9px #17120f20)}
.language-icon-svg svg{display:block;width:100%;height:100%;overflow:visible}
.sakura-fall{position:fixed;inset:0;z-index:3;overflow:hidden;pointer-events:none;opacity:.28}
.sakura-fall span{position:absolute;top:-8vh;left:var(--x);font-family:'Zen Kaku Gothic New',serif;font-size:var(--size);line-height:1;color:#e78b9d;text-shadow:0 0 12px #e78b9d55;animation:fall var(--duration) linear var(--delay) infinite, petal-sway 4.8s ease-in-out var(--delay) infinite}
:root[data-theme="dark"] .sakura-fall span{color:#f3a4a9;text-shadow:0 0 14px #e0231c70}
@media(prefers-reduced-motion:reduce){.sakura-fall span{animation:none!important;display:none}}

/* Softer, clearer social controls: fixed icon wells prevent stretched logo bars. */
.social-card{display:grid!important;grid-template-columns:48px minmax(0,1fr) 34px;grid-template-rows:1fr;align-items:center;min-width:0;min-height:96px;padding:18px 20px;gap:16px;overflow:hidden;border-radius:18px;background:linear-gradient(145deg,#fffaf2,#f2e9dc);border:1px solid #765d4326;box-shadow:0 8px 24px #543b2112,inset 0 1px #fff;transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease,background .3s ease}
.social-card::before,.social-card::after{content:none}
.social-card:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--social-accent,#b4322a) 38%,transparent);box-shadow:0 14px 30px #543b2120,0 0 18px color-mix(in srgb,var(--social-accent,#b4322a) 9%,transparent)}
.social-icon{grid-column:1;grid-row:1;display:grid;place-items:center;flex:none;width:48px;min-width:48px;max-width:48px;height:48px;padding:0;overflow:hidden;clip-path:none;border-radius:50%;background:color-mix(in srgb,var(--social-accent,#6b6258) 13%,#fff);color:var(--social-accent,#51483f);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--social-accent,#6b6258) 18%,transparent);transition:transform .25s ease,background .25s ease,color .25s ease}
.social-icon svg{display:block;flex:none;width:24px;height:24px;fill:currentColor;stroke:none}
.social-card:hover .social-icon{transform:scale(1.06);background:var(--social-accent,#51483f);color:white}
.social-copy{grid-column:2;grid-row:1;display:grid;gap:3px;min-width:0;position:relative;z-index:1}
.social-card strong{font:600 16px/1.3 var(--sans);letter-spacing:0;color:#29221d;text-transform:none}
.social-card small{font:400 12px/1.45 var(--sans);letter-spacing:0;color:#766a5d;text-transform:none;overflow-wrap:anywhere}
.social-arrow{grid-column:3;grid-row:1;display:grid;place-items:center;width:34px;height:34px;margin-left:auto;border:1px solid #745c4426;border-radius:50%;color:var(--social-accent,#51483f);font-size:16px;transition:transform .25s ease,background .25s ease,color .25s ease}
.social-card:hover .social-arrow{transform:translate(2px,-2px);background:var(--social-accent,#51483f);color:#fff}
:root[data-theme="dark"] .social-card{background:linear-gradient(145deg,#1b1d1a,#111312);border-color:#e8dfca24;box-shadow:0 12px 28px #0004,inset 0 1px #ffffff0b}
:root[data-theme="dark"] .social-card strong{color:#f1eadf}:root[data-theme="dark"] .social-card small{color:#b7afa3}
:root[data-theme="dark"] .social-icon{background:color-mix(in srgb,var(--social-accent,#6b6258) 23%,#191a18);color:#f7f1e9;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--social-accent,#6b6258) 48%,transparent)}
:root[data-theme="dark"] .social-card:hover .social-icon,:root[data-theme="dark"] .social-card:hover .social-arrow{background:var(--social-accent,#51483f);color:white}
@media(max-width:760px){.social-card{min-height:88px;padding:15px 16px}.social-icon{flex-basis:44px;width:44px;min-width:44px;max-width:44px;height:44px}.social-card strong{font-size:15px}}

/* Smooth lacquer buttons and a warm, visible lantern glow in dark mode. */
.btn,.nav-edit{clip-path:none;border-radius:999px}
.btn{padding:13px 20px;box-shadow:0 3px 0 #673025,0 8px 20px #0004,inset 0 1px #ffffff18}
.btn::before{inset:4px;border-radius:999px}
.btn:hover{transform:translateY(-2px);box-shadow:0 5px 0 #673025,0 13px 26px #0005,0 0 19px #e0231c1c}
.btn:active{transform:translateY(1px) scale(.99)}
.nav-edit{padding:9px 14px}
:root[data-theme="dark"] .rope-tassel{box-shadow:inset 2px 1px 4px #ffffff55,inset -3px -3px 5px #410b0b77,0 0 9px #ff754c,0 0 24px #e3322380,0 0 42px #d62e1e55}
:root[data-theme="dark"] .rope-tassel i{background:radial-gradient(circle at 35% 30%,#fff9d5,#ffd06d 55%,#e68b34);box-shadow:0 0 8px #ffe5a2,0 0 18px #ff873d,0 0 30px #e6392699;color:#56300e}
@keyframes lantern-glimmer{0%,100%{box-shadow:inset 2px 1px 4px #ffffff45,inset -3px -3px 5px #410b0b77,0 0 8px #ff754c,0 0 20px #e3322377,0 0 34px #d62e1e44}50%{box-shadow:inset 2px 1px 4px #ffffff66,inset -3px -3px 5px #410b0b77,0 0 13px #ff9a60,0 0 30px #ef4634aa,0 0 50px #d62e1e66}}
:root[data-theme="dark"] .rope-tassel{animation:lantern-glimmer 2.8s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){:root[data-theme="dark"] .rope-tassel{animation:none!important}}

/* Give the platform marks more visual weight without enlarging the cards into banners. */
.social-card{grid-template-columns:68px minmax(0,1fr) 34px;min-height:114px}
.social-icon{width:68px;min-width:68px;max-width:68px;height:68px}
.social-icon svg{width:46px;height:46px}
.social-arrow svg{display:block;width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.social-card:hover .social-arrow{transform:translate(1px,-1px);background:color-mix(in srgb,var(--social-accent,#51483f) 10%,transparent);color:var(--social-accent,#51483f)}
@media(max-width:760px){.social-card{grid-template-columns:64px minmax(0,1fr) 32px;min-height:108px}.social-icon{width:64px;min-width:64px;max-width:64px;height:64px}.social-icon svg{width:43px;height:43px}}

.cookie-consent{position:fixed;left:50%;bottom:22px;z-index:70;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:24px;width:min(760px,calc(100vw - 36px));padding:20px 22px;background:linear-gradient(145deg,#fffaf1f5,#eee4d7f7);color:#30271f;border:1px solid #72583c35;border-radius:22px;box-shadow:0 22px 70px #1d160f35,0 3px 12px #38261516;backdrop-filter:blur(20px);transform:translateX(-50%);animation:cookie-arrive .45s cubic-bezier(.2,.8,.2,1) both}
.cookie-consent[hidden]{display:none}
.cookie-copy{display:flex;align-items:flex-start;gap:14px;min-width:0}
.cookie-mark{display:grid;place-items:center;flex:0 0 40px;width:40px;height:40px;border-radius:50%;color:#fff;background:linear-gradient(145deg,#d9563e,#a82825);box-shadow:0 5px 14px #a8282530;font-size:20px}
.cookie-copy h2{margin:0 0 4px;font:600 16px/1.3 var(--sans);letter-spacing:-.02em;color:#30271f}
.cookie-copy p{margin:0;max-width:460px;color:#6d6053;font:400 12px/1.55 var(--sans)}
.cookie-actions{display:flex;align-items:center;gap:9px;white-space:nowrap}
.cookie-actions button{min-height:40px;padding:0 15px;border-radius:999px;font:600 11px var(--sans);cursor:pointer;transition:transform .2s,background .2s,box-shadow .2s}
.cookie-actions button:hover{transform:translateY(-2px)}
.cookie-allow{border:1px solid #ad302b;background:linear-gradient(135deg,#d94637,#ad2423);color:#fff;box-shadow:0 3px 0 #761a1a,0 7px 15px #a8282528}
.cookie-decline{border:1px solid #65503a35;background:#ffffff70;color:#574a3e}
.footer-cookie-settings{padding:0;border:0;background:none;color:inherit;font:inherit;letter-spacing:inherit;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.footer-cookie-settings:hover{color:var(--red)}
:root[data-theme="dark"] .cookie-consent{background:linear-gradient(145deg,#252521f5,#171918f7);color:#f1eadf;border-color:#f1eadf20;box-shadow:0 22px 70px #0008}
:root[data-theme="dark"] .cookie-copy h2{color:#f1eadf}:root[data-theme="dark"] .cookie-copy p{color:#c2b8aa}
:root[data-theme="dark"] .cookie-decline{background:#ffffff0c;color:#e8dfd3;border-color:#e8dfd333}
@keyframes cookie-arrive{from{opacity:0;transform:translate(-50%,14px)}to{opacity:1;transform:translate(-50%,0)}}
@media(max-width:700px){.cookie-consent{bottom:12px;grid-template-columns:1fr;gap:14px;padding:17px;border-radius:18px}.cookie-copy{gap:11px}.cookie-copy p{font-size:11px}.cookie-actions{justify-content:flex-end}.cookie-actions button{min-height:42px}.footer-cookie-settings{font-size:9px}}
@media(prefers-reduced-motion:reduce){.cookie-consent{animation:none!important}}
@media(min-width:761px) and (max-width:1180px){.topbar{height:68px}.wordmark i{display:none}.menu-toggle{display:flex;flex-direction:column;gap:6px;width:34px;padding:7px;z-index:3}.menu-toggle span{height:2px;background:#332821;width:100%;transition:.25s}.menu-toggle[aria-expanded="true"] span:first-child{transform:translateY(4px) rotate(45deg)}.menu-toggle[aria-expanded="true"] span:last-child{transform:translateY(-4px) rotate(-45deg)}.nav{position:absolute;top:68px;left:0;right:0;display:none;flex-direction:column;align-items:stretch;gap:0;padding:10px var(--pad) 22px;background:#f4eee3fa;border-bottom:1px solid var(--line);box-shadow:0 14px 28px #49372518;z-index:2}.nav.open{display:flex}.nav a{padding:13px 0;color:#514437}.nav-edit{border:0;padding-left:0}.theme-rope{top:62px;right:72px;height:150px}.topbar:has(.nav.open) .theme-rope{opacity:0;pointer-events:none}:root[data-theme="dark"] .nav{background:#090b0bf5}:root[data-theme="dark"] .nav a{color:#e6e6d8}:root[data-theme="dark"] .menu-toggle span{background:#f1eee5}}
@media(hover:none){.social-card:hover,.language-card:hover,.hobby-card:hover,.project-card:hover{transform:none}.social-card:active,.language-card:active,.hobby-card:active{transform:scale(.985)}.btn:hover{transform:none}.btn:active{transform:scale(.98)}}
.menu-toggle:focus-visible,.nav a:focus-visible,.sound-toggle:focus-visible,.theme-rope:focus-visible,.social-card:focus-visible{outline:2px solid var(--red);outline-offset:4px}
.opening-sound-prompt{position:fixed;right:22px;bottom:118px;z-index:60;padding:12px 17px;border:1px solid #e9b76d88;border-radius:999px;background:linear-gradient(135deg,#29211c,#121313);color:#f4e9d8;font:500 11px var(--mono);letter-spacing:.08em;box-shadow:0 8px 28px #0005,0 0 20px #e0231c20;cursor:pointer;animation:opening-sound-arrive .35s ease-out both;transition:transform .2s,border-color .2s,box-shadow .2s}
.opening-sound-prompt:hover{transform:translateY(-2px);border-color:#e9b76d;box-shadow:0 11px 30px #0006,0 0 23px #e0231c35}
.opening-sound-prompt[hidden]{display:none}
@keyframes opening-sound-arrive{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:700px){.opening-sound-prompt{right:14px;bottom:184px;min-height:44px;padding:12px 15px}}

/* Sakura lacquer card finish: soft petals, warm paper, and responsive motion. */
.hobby-card,.language-card,.social-card,.timeline-row,.project-card,.editor-card{
  position:relative;isolation:isolate;overflow:hidden;border:1px solid #c86e7a30;border-radius:25px 25px 34px 20px;
  background:radial-gradient(ellipse at 100% 0%,#efc2cb5c,transparent 36%),linear-gradient(145deg,#fffaf2f5,#f0e4d7f2);
  box-shadow:0 12px 30px #543b2112,inset 0 1px #ffffffc9;
  transition:transform .38s cubic-bezier(.2,.8,.2,1),border-color .32s,box-shadow .38s,background .4s;
  transition-delay:calc(var(--card-index,0)*45ms)
}
.hobby-card::after,.language-card::after,.social-card::after,.timeline-row::after,.project-card::after,.editor-card::after{
  content:'✿';position:absolute;z-index:0;top:-17px;right:17px;color:#d66f8290;font:500 76px/1 'Zen Kaku Gothic New',sans-serif;
  opacity:.14;pointer-events:none;transform:rotate(-16deg) scale(.92);transform-origin:center;
  animation:card-blossom-drift 7s ease-in-out calc(var(--card-index,0)*-430ms) infinite alternate;
  transition:opacity .35s,filter .35s,transform .45s cubic-bezier(.2,1.2,.3,1)
}
.hobby-card:hover,.language-card:hover,.social-card:hover,.timeline-row:hover,.project-card:hover,.editor-card:hover{
  transform:translateY(-8px) scale(1.012);border-color:#c7566b70;
  box-shadow:0 22px 48px #6e394021,0 8px 24px #cf73831b,inset 0 1px #ffffffdd;transition-delay:0ms
}
.hobby-card:hover::after,.language-card:hover::after,.social-card:hover::after,.timeline-row:hover::after,.project-card:hover::after,.editor-card:hover::after{
  opacity:.32;filter:drop-shadow(0 5px 10px #d65d7952);transform:rotate(9deg) scale(1.16)
}
.hobby-card>* ,.language-card>* ,.timeline-row>* ,.project-card>* ,.editor-card>*{position:relative;z-index:1}
.social-card .social-watermark,.social-card .social-icon,.social-card .social-copy,.social-card .social-kanji,.social-card .social-arrow{z-index:1}
.social-card .social-watermark{z-index:0}
.language-card{background:radial-gradient(ellipse at 100% 0%,#efc2cb70,transparent 42%),linear-gradient(145deg,#fffaf3,#f1e6dc)}
.language-card .language-icon{border-radius:17px;background-color:#f7e8e6;box-shadow:0 8px 18px #5d3c2816,0 0 0 1px #c76c7728;animation:icon-bob 4.5s ease-in-out infinite;animation-delay:calc(var(--card-index,0)*-320ms)}
.language-card .language-icon-svg{background:transparent;box-shadow:none;filter:drop-shadow(0 7px 8px #543b2126)}
.language-card h3,.hobby-card h3{letter-spacing:-.025em}
.hobby-card{background:radial-gradient(ellipse at 100% 0%,#f4cbd260,transparent 40%),linear-gradient(145deg,#fffaf3,#f0e4d7)}
.hobby-card .hobby-symbol{color:#c96f7e;text-shadow:0 4px 13px #cf778326;animation:hobby-sakura-sway 5s ease-in-out calc(var(--card-index,0)*-350ms) infinite}
.timeline-row{background:radial-gradient(ellipse at 100% 0%,#efc2cb4a,transparent 38%),linear-gradient(145deg,#fffaf2,#f1e7dc)}
.timeline-row h3{letter-spacing:-.025em}
.social-card{background:radial-gradient(ellipse at 100% 0%,color-mix(in srgb,var(--social-accent,#cf7181) 12%,transparent),transparent 42%),linear-gradient(145deg,#fffaf2,#f0e5d9)}
.social-card::before{content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(115deg,transparent 15%,#ffffff70 48%,transparent 82%);transform:translateX(-130%);transition:transform .75s cubic-bezier(.2,.8,.2,1);pointer-events:none}
.social-card:hover::before{transform:translateX(130%)}
.project-card{background:radial-gradient(ellipse at 100% 0%,#eeb6c330,transparent 40%),linear-gradient(145deg,#fff9ef,#eaddd0)}
.project-card::after{color:#ca657a}
.editor-card{border-radius:28px;background:radial-gradient(ellipse at 100% 0%,#eeb6c32b,transparent 38%),linear-gradient(145deg,#fffaf1,#eee1d3)}
.skill{position:relative;overflow:hidden;border:1px solid #c66a782b;border-radius:999px;background:linear-gradient(135deg,#fff8ef,#f4e5dd);box-shadow:0 4px 12px #543b2110;transition:transform .28s cubic-bezier(.2,1.2,.3,1),box-shadow .28s,border-color .28s,background .28s;transition-delay:calc(var(--card-index,0)*35ms)}
.skill::before{content:'✿';margin-right:9px;color:#c65f75;font-size:.9em}
.skill:hover{transform:translateY(-4px) scale(1.04);border-color:#c65f7580;background:#fff2ed;box-shadow:0 9px 20px #85455320;transition-delay:0ms}
.reveal.visible[style*="--card-index"]{transition-delay:calc(var(--card-index,0)*55ms)}
.reveal.visible[style*="--card-index"]:hover{transition-delay:0ms}
:root[data-theme="dark"] .hobby-card,:root[data-theme="dark"] .language-card,:root[data-theme="dark"] .timeline-row,:root[data-theme="dark"] .project-card,:root[data-theme="dark"] .editor-card{
  border-color:#e698a33b;background:radial-gradient(ellipse at 100% 0%,#b93c4b24,transparent 40%),linear-gradient(145deg,#282321,#171817);
  box-shadow:0 16px 36px #0005,inset 0 1px #fff1
}
:root[data-theme="dark"] .social-card{border-color:#e698a33b;background:radial-gradient(ellipse at 100% 0%,color-mix(in srgb,var(--social-accent,#d48691) 17%,transparent),transparent 42%),linear-gradient(145deg,#282321,#171817);box-shadow:0 16px 36px #0005,inset 0 1px #fff1}
:root[data-theme="dark"] .skill{border-color:#e698a33b;background:linear-gradient(135deg,#292321,#191a19);color:#f1e8df;box-shadow:0 6px 16px #0003}
:root[data-theme="dark"] .skill:hover{background:#38272a;border-color:#e698a3aa}
:root[data-theme="dark"] .hobby-card::after,:root[data-theme="dark"] .language-card::after,:root[data-theme="dark"] .social-card::after,:root[data-theme="dark"] .timeline-row::after,:root[data-theme="dark"] .project-card::after,:root[data-theme="dark"] .editor-card::after{color:#f095a4a8}
@keyframes card-blossom-drift{0%{translate:0 0;rotate:-5deg}100%{translate:-5px 7px;rotate:5deg}}
@keyframes hobby-sakura-sway{0%,100%{transform:rotate(-5deg) translateY(0)}50%{transform:rotate(5deg) translateY(-4px)}}
@media(hover:none){.hobby-card:active,.language-card:active,.social-card:active,.timeline-row:active,.project-card:active{transform:scale(.985);transition-delay:0ms}}
@media(prefers-reduced-motion:reduce){
  .hobby-card::after,.language-card::after,.social-card::after,.timeline-row::after,.project-card::after,.editor-card::after,.hobby-card .hobby-symbol,.language-card .language-icon{animation:none!important;transition:none!important}
  .hobby-card:hover,.language-card:hover,.social-card:hover,.timeline-row:hover,.project-card:hover,.editor-card:hover,.skill:hover{transform:none!important}
  .social-card::before{display:none}
}