/* Fonts are loaded through WordPress wp_enqueue_style(). */

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}

:root {
    --paper:  #F8F4EC;
    --ink:    #1A1814;
    --accent: #E05C1F;
    --red:    #E05C1F;
    --muted:  rgba(26,24,20,.38);
    --rule:   rgba(26,24,20,.1);
    --thin:   1px solid var(--rule);
}

html,body{
    background:var(--paper);
    color:var(--ink);
    font-family:'Cormorant Garamond',serif;
    overflow:hidden;
    width:100%;height:100vh;
    cursor:none;
    user-select:none;
}
::-webkit-scrollbar{display:none;}

/* Compact language control, using the existing paper/ink system. */
.language-switch{display:flex;flex-shrink:0;margin-right:14px;border:var(--thin);}
.language-switch button{font:10px/1 'JetBrains Mono',monospace;min-width:34px;min-height:40px;border:0;background:transparent;color:var(--ink);cursor:pointer;}
.language-switch button[aria-pressed="true"]{background:var(--ink);color:var(--paper);}
.language-switch button:focus-visible{outline:2px solid var(--accent);outline-offset:3px;}
html[lang="vi"] .m-haiku,html[lang="vi"] .g-stamp,html[lang="vi"] .ma-jp{font-family:'Cormorant Garamond',serif;line-height:1.2;}
html[lang="vi"] .ma-jp{display:none;}
html[lang="vi"] .act0-en{line-height:1.15;}
html[lang="vi"] .hero-actions{flex-wrap:wrap;}
@media(max-width:700px){
    .language-switch{margin-right:0;}
    .language-switch button{min-width:29px;}
    #top-bar .logo-en{max-width:85px;}
    #top-bar .top-cta{max-width:83px;text-align:center;justify-content:center;}
    html[lang="vi"] .seal-motto{line-height:1.25;}
}
@media(max-width:370px){
    #top-bar .logo-en{display:none;}
    html[lang="vi"] .ma-title{font-size:21px;}
}

/* ── AUDIO TOGGLE ────────────────────────────────────────────────────── */
#audio-toggle{
    display:flex;align-items:center;justify-content:center;
    width:36px;height:36px;
    background:transparent;border:var(--thin);
    color:var(--ink);cursor:pointer;
    transition:background .22s,color .22s,border-color .22s;
    flex-shrink:0;
}
#audio-toggle:hover{background:var(--ink);color:var(--paper);border-color:var(--ink);}
#audio-toggle.muted{border-color:var(--red);color:var(--red);}
#audio-toggle.muted:hover{background:var(--red);color:var(--paper);border-color:var(--red);}
/* Pulse ring while audio playing */
#audio-toggle::after{
    content:'';position:absolute;width:36px;height:36px;
    border-radius:0;border:1px solid rgba(26,24,20,.2);
    animation:audio-pulse 2.5s ease-in-out infinite;
    pointer-events:none;
}
#audio-toggle.muted::after{animation:none;}
@keyframes audio-pulse{
    0%,100%{transform:scale(1);opacity:.4;}
    50%{transform:scale(1.4);opacity:0;}
}


/* ── GRAIN / PAPER TEXTURE ───────────────────────────────────────────── */
.grain{
    position:fixed;inset:0;z-index:9998;pointer-events:none;
    opacity:.07;
    background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.68' numOctaves='5' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ── CURSOR ─────────────────────────────────────────────────────────── */
.cursor-dot{
    position:fixed;width:5px;height:5px;background:var(--red);
    border-radius:50%;pointer-events:none;z-index:99999;
    transform:translate(-50%,-50%);
}
.cursor-ring{
    position:fixed;width:28px;height:28px;
    border:1px solid rgba(224,92,31,.45);
    border-radius:50%;pointer-events:none;z-index:99998;
    transform:translate(-50%,-50%);
    transition:width .35s cubic-bezier(.16,1,.3,1),height .35s cubic-bezier(.16,1,.3,1),border-color .35s;
}
.cursor-ring.big{width:52px;height:52px;border-color:var(--red);}

/* ── INK CANVAS ─────────────────────────────────────────────────────── */
#ink-canvas{
    position:fixed;inset:0;z-index:2;pointer-events:none;
    opacity:.55;
}

/* ── LEFT VERTICAL RULE ─────────────────────────────────────────────── */
#left-rule{
    position:fixed;left:72px;top:0;bottom:0;width:1px;
    background:var(--rule);z-index:10;
}
#right-rule{
    position:fixed;right:72px;top:0;bottom:0;width:1px;
    background:var(--rule);z-index:10;
}

/* ── TOP BAR ────────────────────────────────────────────────────────── */
#top-bar{
    position:fixed;top:0;left:0;right:0;height:60px;z-index:200;
    display:flex;align-items:center;padding:0 72px;
    border-bottom:var(--thin);
    background:var(--paper);
}
/* Logo image in nav */
.nav-logo{
    height:30px;width:auto;
    mix-blend-mode:multiply;
    object-fit:contain;
    display:block;
    transition:opacity .2s;
}
.nav-logo:hover{opacity:.7;}

/* Seal logo in hero */
.seal-logo{
    width:80px;height:auto;
    mix-blend-mode:multiply;
    object-fit:contain;
    display:block;
    margin:0 auto 8px;
}

.logo-en{
    font-family:'Syne',sans-serif;font-weight:800;font-size:11px;
    letter-spacing:.18em;text-transform:uppercase;color:var(--ink);
}
.logo-sep{width:1px;height:20px;background:var(--rule);margin:0 20px;}
.top-meta{
    font-family:'JetBrains Mono',monospace;font-size:9px;
    letter-spacing:.14em;text-transform:uppercase;color:var(--muted);
}
.top-spacer{flex:1;}
.top-cta{
    font-family:'JetBrains Mono',monospace;font-size:9px;
    letter-spacing:.16em;text-transform:uppercase;color:var(--ink);
    border:var(--thin);padding:8px 18px;cursor:pointer;
    transition:background .25s,color .25s;background:transparent;
    text-decoration:none;
}
.top-cta:hover{background:var(--ink);color:var(--paper);}

/* ── BOTTOM BAR ─────────────────────────────────────────────────────── */
#bottom-bar{
    position:fixed;bottom:0;left:0;right:0;height:48px;z-index:200;
    border-top:var(--thin);background:var(--paper);
    display:flex;align-items:center;padding:0 72px;
    justify-content:space-between;
    font-family:'JetBrains Mono',monospace;font-size:9px;
    letter-spacing:.14em;text-transform:uppercase;color:var(--muted);
}
.b-nav{display:flex;gap:0;align-items:center;}
.b-nav-btn{
    padding:0 20px;height:48px;display:flex;align-items:center;
    cursor:pointer;border-right:var(--thin);transition:color .2s,background .2s;
    color:var(--muted);
}
.b-nav-btn:first-child{border-left:var(--thin);}
.b-nav-btn:hover{color:var(--ink);background:rgba(26,24,20,.04);}
.b-nav-btn.gone{opacity:0;pointer-events:none;}

/* ── CHAPTER INDICATOR ──────────────────────────────────────────────── */
#ch-indicator{
    position:fixed;top:60px;right:72px;z-index:150;
    writing-mode:vertical-rl;
    font-family:'JetBrains Mono',monospace;font-size:9px;
    letter-spacing:.2em;text-transform:uppercase;color:var(--muted);
    padding:16px 0;
    display:flex;align-items:center;gap:12px;
}
.ch-ind-line{width:1px;height:40px;background:var(--rule);}
.ch-ind-num{color:var(--ink);font-weight:400;}

/* ── PROGRESS BAR ───────────────────────────────────────────────────── */
#progress-bar{
    position:fixed;left:0;bottom:0;width:3px;top:60px;
    z-index:199;
}
.progress-fill{
    width:3px;background:var(--red);height:0%;
    transition:height .65s cubic-bezier(.16,1,.3,1);
}

/* ── CHAPTER TRANSITION ─────────────────────────────────────────────── */
#ch-wipe{
    position:fixed;inset:0;z-index:9990;pointer-events:none;
    background:var(--paper);opacity:0;
    transition:opacity .28s ease;
}
#ch-wipe.on{opacity:1;}

/* ── PANELS ─────────────────────────────────────────────────────────── */
.panel{
    position:fixed;top:60px;bottom:48px;left:72px;right:72px;
    display:flex;flex-direction:column;justify-content:flex-end;
    padding:40px 0;
    opacity:0;pointer-events:none;
    transition:opacity .22s ease;
    z-index:50;
}
.panel.active{opacity:1;pointer-events:auto;}

/* ─ ACT 0 ──── ORIGIN ───────────────────────────────────────────────── */
.act0-jp{
    font-family:'Noto Serif JP',serif;font-weight:200;
    font-size:clamp(3.5rem,9vw,10rem);
    line-height:1;letter-spacing:-.02em;
    color:var(--ink);margin-bottom:12px;
    overflow:hidden;
    opacity:0;transform:translateY(40px);
    transition:opacity .9s ease .08s,transform .9s cubic-bezier(.16,1,.3,1) .08s;
}
.act0-en{
    font-family:'Cormorant Garamond',serif;font-weight:300;font-style:italic;
    font-size:clamp(2rem,5vw,5.5rem);
    line-height:.95;letter-spacing:-.02em;color:var(--red);
    overflow:hidden;
    opacity:0;transform:translateY(30px);
    transition:opacity .8s ease .25s,transform .8s cubic-bezier(.16,1,.3,1) .25s;
}
.act0-body{
    font-family:'JetBrains Mono',monospace;font-size:10px;
    letter-spacing:.14em;color:var(--muted);
    max-width:420px;line-height:1.8;margin-top:28px;
    opacity:0;transform:translateY(12px);
    transition:opacity .6s ease .45s,transform .6s cubic-bezier(.16,1,.3,1) .45s;
}
.panel.active .act0-jp,
.panel.active .act0-en,
.panel.active .act0-body{opacity:1;transform:translateY(0);}

.act0-layout{display:grid;grid-template-columns:1fr auto;align-items:flex-end;gap:60px;}
@media(max-width:900px){.act0-layout{grid-template-columns:1fr;}}
.act0-right{
    text-align:right;padding-bottom:8px;
    opacity:0;transform:translateX(20px);
    transition:opacity .7s ease .6s,transform .7s cubic-bezier(.16,1,.3,1) .6s;
}
.panel.active .act0-right{opacity:1;transform:translateX(0);}
.act0-seal{
    font-family:'Noto Serif JP',serif;font-weight:300;
    font-size:clamp(1rem,2.5vw,2rem);
    color:var(--red);line-height:1.3;
    border:1px solid rgba(224,92,31,.3);
    padding:16px 20px;display:inline-block;
    text-align:center;letter-spacing:.06em;
}
.act0-seal-sub{
    font-family:'JetBrains Mono',monospace;font-size:8px;
    letter-spacing:.2em;text-transform:uppercase;color:var(--muted);
    margin-top:10px;
}

/* ─ ACT 1 ──── SERVICES ─────────────────────────────────────────────── */
.act1-grid{
    display:grid;grid-template-columns:repeat(3,1fr);
    border-left:var(--thin);border-top:var(--thin);
}
@media(max-width:700px){.act1-grid{grid-template-columns:1fr;}}
@media(max-width:900px){.act1-grid{grid-template-columns:repeat(2,1fr);}}

.ma-cell{
    padding:26px 26px 24px;
    border-right:var(--thin);border-bottom:var(--thin);
    opacity:0;transform:translateY(18px);
    transition:opacity .55s ease,transform .6s cubic-bezier(.16,1,.3,1);
    cursor:default;
}
.ma-cell::after{content:'';display:block;height:1px;background:var(--red);width:0;margin-top:14px;transition:width .4s cubic-bezier(.16,1,.3,1);}
.ma-cell:hover::after{width:100%;}
.panel.active .ma-cell{opacity:1;transform:translateY(0);}
.panel.active .ma-cell:nth-child(1){transition-delay:.05s;}
.panel.active .ma-cell:nth-child(2){transition-delay:.13s;}
.panel.active .ma-cell:nth-child(3){transition-delay:.21s;}
.panel.active .ma-cell:nth-child(4){transition-delay:.29s;}
.panel.active .ma-cell:nth-child(5){transition-delay:.37s;}
.panel.active .ma-cell:nth-child(6){transition-delay:.45s;}

.ma-jp{
    font-family:'Syne',sans-serif;font-weight:700;
    font-size:1.8rem;color:var(--rule);display:block;
    margin-bottom:8px;letter-spacing:-.01em;
    transition:color .4s;
}
.ma-cell:hover .ma-jp{color:rgba(224,92,31,.18);}
.ma-num{
    font-family:'JetBrains Mono',monospace;font-size:9px;
    letter-spacing:.2em;text-transform:uppercase;color:var(--red);
    margin-bottom:12px;display:block;
}
.ma-title{
    font-family:'Cormorant Garamond',serif;font-weight:400;
    font-size:1.35rem;letter-spacing:-.01em;margin-bottom:8px;
}
.ma-body{
    font-family:'JetBrains Mono',monospace;font-size:9px;
    line-height:1.75;color:var(--muted);letter-spacing:.06em;
    text-transform:uppercase;
}


/* ─ ACT 2 ──── MANIFESTO ────────────────────────────────────────────── */
.manifesto-wrap{}
.m-kicker{
    font-family:'JetBrains Mono',monospace;font-size:9px;
    letter-spacing:.22em;text-transform:uppercase;color:var(--red);
    margin-bottom:24px;display:block;
}
.m-haiku{
    font-family:'Noto Serif JP',serif;font-weight:200;
    font-size:clamp(1.6rem,4vw,4.5rem);
    line-height:1.45;letter-spacing:.04em;
    color:var(--ink);margin-bottom:32px;
}
.m-haiku span{display:block;}
.m-haiku em{
    font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:300;
    font-size:.75em;color:var(--muted);letter-spacing:-.01em;
    display:block;margin-top:4px;
}
.m-rule-grid{
    display:grid;grid-template-columns:repeat(3,1fr);gap:0;
    border-top:var(--thin);
}
@media(max-width:700px){
    .m-rule-grid{grid-template-columns:repeat(2,1fr);}
    .m-rule-cell:last-child{grid-column:1 / -1;}
}
.m-rule-cell{
    padding:16px 0 16px 20px;border-right:var(--thin);border-bottom:var(--thin);
    opacity:0;transform:translateY(10px);
    transition:opacity .5s,transform .5s cubic-bezier(.16,1,.3,1);
}
.panel.active .m-rule-cell{opacity:1;transform:translateY(0);}
.panel.active .m-rule-cell:nth-child(1){transition-delay:.05s;}
.panel.active .m-rule-cell:nth-child(2){transition-delay:.12s;}
.panel.active .m-rule-cell:nth-child(3){transition-delay:.19s;}
.panel.active .m-rule-cell:nth-child(4){transition-delay:.26s;}
.m-rule-label{font-family:'JetBrains Mono',monospace;font-size:8px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin-bottom:4px;}
.m-rule-val{font-family:'Cormorant Garamond',serif;font-size:1.1rem;letter-spacing:-.01em;}

/* ─ ACT 3 ──── WORKS ────────────────────────────────────────────────── */
.works-kicker{font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:var(--red);margin-bottom:16px;display:block;}
.works-list{border-top:var(--thin);}
.w-item{
    display:grid;grid-template-columns:36px 1fr auto 24px;
    align-items:baseline;gap:20px;
    padding:16px 0;border-bottom:var(--thin);cursor:pointer;
    transition:padding-left .35s cubic-bezier(.16,1,.3,1);
    position:relative;
}
.w-item:hover{padding-left:10px;}
.w-item:hover .w-title-j{color:var(--red);}
.w-item:hover .w-arr{transform:translate(3px,-3px) rotate(45deg);color:var(--red);}
.w-num-j{font-family:'JetBrains Mono',monospace;font-size:9px;color:var(--muted);}
.w-title-j{
    font-family:'Cormorant Garamond',serif;font-weight:300;
    font-size:clamp(1.2rem,2.5vw,2.2rem);letter-spacing:-.01em;
    transition:color .25s;
}
.w-cat-j{font-family:'JetBrains Mono',monospace;font-size:9px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);}
.w-arr{font-size:14px;color:var(--muted);transition:transform .3s cubic-bezier(.16,1,.3,1),color .25s;}

/* Hover capsule */
.hover-capsule{
    position:fixed;z-index:9000;width:260px;height:170px;
    overflow:hidden;pointer-events:none;
    opacity:0;transform:translate(-50%,-50%) scale(.9) rotate(-1.5deg);
    transition:opacity .28s,transform .28s cubic-bezier(.16,1,.3,1);
    box-shadow:4px 4px 0 0 var(--ink);
    border:var(--thin);
}
.hover-capsule.on{opacity:1;transform:translate(-50%,-50%) scale(1) rotate(0deg);}
.hover-capsule img{width:100%;height:100%;object-fit:cover;filter:grayscale(40%) sepia(10%);}

/* ─ ACT 4 ──── GENESIS ──────────────────────────────────────────────── */
.genesis-jp{
    display:grid;grid-template-columns:1fr 1fr;gap:0;
    border:var(--thin);
}
@media(max-width:700px){.genesis-jp{grid-template-columns:1fr;}}
.g-left-jp{padding:36px;border-right:var(--thin);}
.g-right-jp{padding:36px;}

.g-stamp{
    font-family:'Noto Serif JP',serif;font-weight:200;
    font-size:clamp(2rem,4vw,4.5rem);line-height:.95;letter-spacing:.03em;
    color:var(--ink);margin-bottom:20px;
}
.g-stamp em{
    font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:300;
    color:var(--red);font-size:.8em;display:block;letter-spacing:-.01em;
}
.g-contact-row{display:flex;gap:0;border-top:var(--thin);flex-wrap:wrap;}
.g-contact-cell{flex:1;min-width:140px;padding:14px;border-right:var(--thin);}
.g-contact-cell:last-child{border-right:none;}
.g-cl{font-family:'JetBrains Mono',monospace;font-size:8px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:4px;}
.g-cv a{font-size:12px;font-weight:400;color:var(--ink);text-decoration:none;transition:color .2s;}
.g-cv a:hover{color:var(--red);}

.g-form-jp label{
    display:block;font-family:'JetBrains Mono',monospace;font-size:8px;
    letter-spacing:.16em;text-transform:uppercase;color:var(--muted);
    margin:14px 0 4px;
}
.g-form-jp label:first-child{margin-top:0;}
.g-form-jp input,.g-form-jp textarea{
    width:100%;background:transparent;border:none;border-bottom:var(--thin);
    padding:8px 0;color:var(--ink);font-family:'Cormorant Garamond',serif;
    font-size:15px;outline:none;transition:border-color .3s;
}
.g-form-jp input:focus,.g-form-jp textarea:focus{border-color:var(--ink);}
.g-form-jp textarea{resize:none;height:70px;}
.g-send{
    width:100%;margin-top:20px;padding:13px;
    background:var(--ink);color:var(--paper);border:none;
    font-family:'JetBrains Mono',monospace;font-size:9px;
    letter-spacing:.18em;text-transform:uppercase;cursor:pointer;
    transition:background .25s;
}
.g-send:hover{background:var(--red);}

/* ── CASE MODAL ─────────────────────────────────────────────────────── */
#case-modal{
    position:fixed;inset:0;z-index:9999;
    background:rgba(248,244,236,.93);backdrop-filter:blur(14px);
    display:flex;align-items:center;justify-content:center;
    padding:20px;opacity:0;pointer-events:none;transition:opacity .35s;
}
#case-modal.open{opacity:1;pointer-events:auto;}
.case-box{
    background:var(--paper);border:var(--thin);
    max-width:780px;width:100%;max-height:88vh;overflow-y:auto;
    padding:44px;position:relative;
    transform:translateY(16px);transition:transform .4s cubic-bezier(.16,1,.3,1);
    box-shadow:6px 6px 0 0 var(--ink);
}
#case-modal.open .case-box{transform:translateY(0);}
.case-box::-webkit-scrollbar{display:none;}
.case-close{
    position:absolute;top:16px;right:16px;width:30px;height:30px;
    border:var(--thin);background:transparent;color:var(--muted);cursor:pointer;
    display:flex;align-items:center;justify-content:center;font-size:13px;
    transition:color .2s,border-color .2s;
}
.case-close:hover{color:var(--ink);border-color:var(--ink);}

/* Mobile layout: keep the same visual system while fitting the fixed story UI
   inside narrow and dynamic browser viewports. */
@media (max-width:700px){
    html,body{
        height:100dvh;
        min-height:-webkit-fill-available;
        cursor:auto;
    }

    .cursor-dot,.cursor-ring,.hover-capsule{display:none!important;}

    #left-rule{left:16px;}
    #right-rule{right:16px;}

    #top-bar{
        height:56px;
        padding:0 16px;
        gap:8px;
    }
    #top-bar>a:first-child{
        min-width:0;
        gap:8px!important;
    }
    .nav-logo{height:24px;}
    .logo-en{
        font-size:8px;
        letter-spacing:.12em;
        white-space:nowrap;
    }
    .logo-sep,.top-meta{display:none;}
    .top-spacer{min-width:0;}
    #audio-toggle{
        position:relative;
        width:32px;
        height:32px;
    }
    #audio-toggle::after{width:32px;height:32px;}
    .top-cta{
        padding:7px 8px;
        font-size:7px;
        letter-spacing:.1em;
        white-space:nowrap;
    }

    #progress-bar{top:56px;}
    #ch-indicator{
        top:56px;
        right:16px;
        padding:12px 0;
        gap:8px;
        font-size:7px;
    }
    .ch-ind-line{height:28px;}

    .panel{
        top:56px;
        bottom:44px;
        left:16px;
        right:32px;
        padding:24px 0 20px;
        overflow-y:auto;
        overscroll-behavior:contain;
        -webkit-overflow-scrolling:touch;
    }

    #panel-1{justify-content:flex-start;}

    .act0-layout{
        grid-template-columns:1fr;
        gap:20px;
    }
    .act0-jp{font-size:clamp(3.5rem,18vw,5.2rem);}
    .act0-en{font-size:clamp(2rem,10vw,3.25rem);}
    .act0-body{
        max-width:90%;
        margin-top:18px;
        font-size:8px;
        line-height:1.65;
    }
    .act0-right{
        padding:0;
        text-align:right;
    }
    .act0-seal{padding:10px 12px;}
    .seal-logo{width:58px;}

    .act1-grid{grid-template-columns:1fr;}
    .ma-cell{padding:14px 14px 13px;}
    .ma-num{margin-bottom:5px;}
    .ma-jp{
        display:inline;
        margin:0 0 0 8px;
        font-size:1.15rem;
    }
    .ma-title{margin-top:5px;margin-bottom:3px;font-size:1.1rem;}
    .ma-body{font-size:7px;line-height:1.5;}

    .m-kicker{margin-bottom:14px;}
    .m-haiku{
        margin-bottom:20px;
        font-size:clamp(1.45rem,8vw,2.4rem);
        line-height:1.25;
    }
    .m-rule-cell{padding:12px 8px 12px 10px;}

    .w-item{
        grid-template-columns:28px minmax(0,1fr) 18px;
        gap:4px 8px;
        padding:12px 0;
    }
    .w-num-j{grid-row:1 / span 2;}
    .w-title-j{font-size:1.3rem;}
    .w-cat-j{
        grid-column:2;
        font-size:7px;
        line-height:1.4;
    }
    .w-arr{
        grid-column:3;
        grid-row:1 / span 2;
        align-self:center;
    }

    #panel-4{
        justify-content:flex-start!important;
    }
    .genesis-jp{
        grid-template-columns:1fr;
        margin:auto 0;
    }
    .g-left-jp,.g-right-jp{padding:20px;}
    .g-left-jp{
        border-right:none;
        border-bottom:var(--thin);
    }
    .g-stamp{font-size:clamp(2rem,11vw,3rem);}
    .g-form-jp label{margin-top:10px;}
    .g-form-jp input,.g-form-jp textarea{padding:6px 0;}
    .g-form-jp textarea{height:54px;}
    .g-send{margin-top:14px;}

    #bottom-bar{
        height:44px;
        padding:0 16px;
    }
    .b-nav-btn{
        height:44px;
        padding:0 12px;
    }
    #bottom-bar>div:last-child{gap:12px!important;}
    #bottom-bar>div:last-child span{display:none;}

    .case-box{
        max-height:calc(100dvh - 32px);
        padding:38px 20px 24px;
    }
}

@media (hover:none),(pointer:coarse){
    html,body{cursor:auto;}
    .cursor-dot,.cursor-ring,.hover-capsule{display:none!important;}
}

/* LINEBASE — considered refinements of the original paper-and-ink system. */
:root{--muted:#6d685f;--accent-text:#a54119;--gutter:72px;--footer-height:68px;}
html,body{height:100dvh;user-select:text;cursor:auto;}
button,a,input,textarea,select{-webkit-tap-highlight-color:transparent;}
button{font:inherit;}
a,button{touch-action:manipulation;}
button{border-radius:0;}
[hidden]{display:none!important;}
:focus-visible{outline:2px solid var(--accent-text);outline-offset:5px;}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;}
.skip-link{position:fixed;left:16px;top:-80px;z-index:100000;background:var(--paper);color:var(--ink);padding:14px;}
.skip-link:focus{top:8px;}
.cursor-dot{display:none;}
.cursor-ring{width:34px;height:34px;opacity:.4;}
.grain{opacity:.045;}
#top-bar{gap:0;}
#audio-toggle{width:40px;height:40px;position:relative;}
#audio-toggle::after{display:none;}
#audio-toggle.muted{color:var(--muted);border-color:var(--rule);}
.top-cta{min-height:40px;display:flex;align-items:center;font-size:10px;letter-spacing:.08em;}
.top-meta{font-size:10px;letter-spacing:.06em;}
.panel{bottom:var(--footer-height);padding:30px 0;overflow-y:auto;overflow-x:hidden;justify-content:safe flex-end;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:rgba(26,24,20,.18) transparent;}
.panel:not(.active){visibility:hidden;}
.panel::-webkit-scrollbar,.case-box::-webkit-scrollbar{display:block;width:3px;}
.panel::-webkit-scrollbar-thumb,.case-box::-webkit-scrollbar-thumb{background:rgba(26,24,20,.18);}
.panel:focus{outline:none;}
#panel-0{justify-content:safe center;}
.act0-layout{grid-template-columns:minmax(0,1fr) 190px;gap:40px;align-items:end;}
.edition-line{font:10px/1.6 'JetBrains Mono',monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:20px;}
.edition-line span{display:inline-block;margin-left:20px;color:var(--accent-text);}
.act0-jp{font-size:clamp(4rem,8.1vw,9.6rem);line-height:1.03;margin-bottom:14px;letter-spacing:-.04em;}
.act0-en{font-size:clamp(2rem,3.7vw,4.5rem);line-height:1.04;}
.act0-body{font-size:11px;letter-spacing:.035em;line-height:1.8;max-width:470px;margin-top:22px;}
.hero-actions{margin-top:26px;display:flex;align-items:center;gap:28px;flex-wrap:wrap;}
.text-link{background:none;border:0;border-bottom:1px solid var(--accent);padding:10px 0;color:var(--ink);font:11px/1.5 'JetBrains Mono',monospace;text-decoration:none;letter-spacing:.025em;cursor:pointer;display:inline-flex;align-items:center;gap:24px;}
.text-link:hover{color:var(--accent-text);}
.hero-hint{font:10px/1.6 'JetBrains Mono',monospace;color:var(--muted);max-width:170px;}
.act0-right{padding-bottom:2px;}
.act0-seal{width:176px;padding:20px 16px 13px;background:transparent;cursor:pointer;border-color:rgba(224,92,31,.4);transition:background .25s,transform .4s;}
.act0-seal:hover{background:rgba(224,92,31,.035);transform:rotate(-2deg);}
.seal-logo{width:86px;margin:21px auto 18px;}
.seal-heading,.seal-replay,.act0-seal-sub{display:block;font:9px/1.6 'JetBrains Mono',monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-text);}
.seal-motto{display:block;font:italic 21px/1.15 'Cormorant Garamond',serif;letter-spacing:0;color:var(--ink);}
.act0-seal-sub{color:var(--muted);margin-top:18px;}
.seal-replay{font-size:8px;letter-spacing:.04em;margin-top:14px;padding-top:10px;border-top:1px solid rgba(224,92,31,.25);}
.stamped{animation:mark-press .6s ease;}
@keyframes mark-press{0%{transform:scale(1);}35%{transform:rotate(-3deg) scale(.94);}100%{transform:scale(1);}}

#bottom-bar{height:var(--footer-height);gap:28px;padding:0 var(--gutter);color:var(--muted);}
.b-nav{flex-shrink:0;gap:4px;}
.b-nav-btn,.b-nav-btn:first-child{padding:0;width:36px;height:44px;justify-content:center;font-size:18px;border:0;background:none;color:var(--ink);}
.b-nav-btn:disabled{opacity:.25;cursor:default;}
.chapter-nav{display:flex;align-items:stretch;gap:28px;height:100%;flex:1;justify-content:center;}
.chapter-nav a{position:relative;display:flex;align-items:center;gap:7px;text-decoration:none;color:var(--muted);font:10px/1.3 'JetBrains Mono',monospace;letter-spacing:.02em;border-top:2px solid transparent;min-height:44px;padding:0 2px;}
.chapter-nav a span{font-size:9px;opacity:.65;}
.chapter-nav a[aria-current]{color:var(--ink);border-top-color:var(--accent);}
.chapter-nav a[aria-current] span{color:var(--accent-text);opacity:1;}
.chapter-nav a:hover{color:var(--accent-text);}
.footer-signature{font:italic 17px/1.3 'Cormorant Garamond',serif;text-transform:none;letter-spacing:0;white-space:nowrap;}
#ch-indicator{right:calc(var(--gutter) - 24px);font-size:9px;}
#ch-ind-en{color:var(--muted)!important;}
#progress-bar{bottom:var(--footer-height);}

#panel-1{justify-content:safe center;}
#panel-4{justify-content:safe center!important;}
.act1-grid{flex-shrink:0;}
.ma-cell{background:transparent;text-align:left;color:var(--ink);border-top:0;border-left:0;font:inherit;cursor:pointer;padding:22px 24px 18px;position:relative;}
.ma-cell::after{margin-top:13px;}
.ma-cell[aria-pressed=true]{background:rgba(224,92,31,.035);}
.ma-cell[aria-pressed=true]::after{width:100%;}
.ma-cell[aria-pressed=true] .ma-title{color:var(--accent-text);}
.ma-cell:focus-visible{outline-offset:-4px;}
.ma-num{color:var(--accent-text);font-size:10px;margin-bottom:10px;}
.ma-jp{position:absolute;right:18px;top:19px;font-size:22px;opacity:.8;pointer-events:none;}
.ma-title{font-size:27px;margin:0 0 9px;}
.ma-body{font-size:10px;letter-spacing:.02em;line-height:1.7;max-width:92%;}
.service-detail{display:flex;justify-content:space-between;align-items:center;gap:28px;padding:24px;border:var(--thin);border-top:0;min-height:132px;flex-shrink:0;}
.detail-index{font:9px/1.5 'JetBrains Mono',monospace;text-transform:uppercase;letter-spacing:.12em;color:var(--accent-text);}
.service-detail h2{font:400 27px/1.2 'Cormorant Garamond',serif;margin:7px 0;}
.service-detail p{font:12px/1.65 'JetBrains Mono',monospace;color:var(--muted);max-width:580px;letter-spacing:-.025em;}
.service-cta{flex-shrink:0;}
.m-kicker,.works-kicker{font-size:10px;color:var(--accent-text);}
.m-haiku{font-size:clamp(1.6rem,3.65vw,4rem);}
.m-haiku em{color:var(--muted);}
.m-rule-label{font-size:10px;letter-spacing:.1em;}
.m-rule-val{font-size:21px;}
.m-rule-cell{padding:17px 20px;}
.w-item{width:100%;text-align:left;border:0;border-bottom:var(--thin);background:none;color:var(--ink);font:inherit;min-height:65px;padding:18px 0;}
.w-item:focus-visible{outline-offset:-4px;padding-left:10px;}
.w-item:focus-visible .w-title-j{color:var(--accent-text);}
.w-title-j{font-size:clamp(1.6rem,2.8vw,2.45rem);}
.w-num-j,.w-cat-j{font-size:10px;letter-spacing:.045em;}
.w-arr{font-size:20px;}
.works-footnote{font:11px/1.7 'JetBrains Mono',monospace;color:var(--muted);margin-top:24px;}
.hover-capsule{transform:scale(.97);width:240px;height:156px;}
.hover-capsule.on{transform:scale(1);}
.g-stamp{line-height:1.1;}
.g-stamp em{margin-top:9px;}
.g-left-jp,.g-right-jp{padding:30px;}
.g-cl,.g-form-jp label{font-size:10px;letter-spacing:.08em;}
.g-cv a{font-size:16px;overflow-wrap:anywhere;}
.g-form-jp label{margin:14px 0 5px;}
.g-form-jp label span{float:right;font-size:8px;letter-spacing:.02em;text-transform:none;}
.g-form-jp input,.g-form-jp textarea,.g-form-jp select{font:400 17px/1.5 'Cormorant Garamond',serif;min-height:42px;width:100%;color:var(--ink);background:transparent;border:0;border-bottom:1px solid rgba(26,24,20,.22);padding:8px 0;border-radius:0;}
.g-form-jp input::placeholder,.g-form-jp textarea::placeholder{color:#756f66;opacity:1;}
.g-form-jp select{padding-right:18px;cursor:pointer;}
.g-form-jp textarea{min-height:80px;resize:vertical;}
.g-send{font-size:10px;min-height:44px;letter-spacing:.09em;}
.form-note{font:10px/1.7 'JetBrains Mono',monospace;color:var(--muted);margin-top:12px;}
.brief-draft{border-top:var(--thin);margin-top:18px;padding-top:16px;}
#brief-status{font:11px/1.7 'JetBrains Mono',monospace;color:var(--muted);}
#brief-preview{height:155px;font:11px/1.8 'JetBrains Mono',monospace;margin-top:10px;}
.draft-actions{display:flex;gap:24px;flex-wrap:wrap;}
.case-box{max-height:calc(100dvh - 48px);padding:48px 40px 36px;}
#case-modal:not(.open){visibility:hidden;}
.case-close{width:auto;min-width:58px;height:36px;padding:0 10px;font:10px 'JetBrains Mono',monospace;color:var(--ink);}
.case-box p{color:var(--muted)!important;}
#case-content>div{color:var(--muted)!important;}
#case-content>div:first-child{color:var(--accent-text)!important;}
.case-box [style*="font-size:8px"]{font-size:10px!important;color:var(--muted)!important;}
@media(max-height:740px) and (min-width:901px){
    .edition-line{margin-bottom:12px;}
    .act0-jp{font-size:min(8.1vw,13.1vh);}
    .act0-en{font-size:min(3.7vw,6.1vh);}
    .act0-body{margin-top:18px;}
    .hero-actions{margin-top:18px;}
    .ma-cell{padding:17px 22px 13px;}
    .ma-num{margin-bottom:6px;}
    .service-detail{padding:18px 24px;min-height:120px;}
}
@media(max-width:1100px){
    .chapter-nav{gap:18px;}
    .footer-signature{display:none;}
}
@media(max-width:900px){
    :root{--gutter:32px;}
    #top-bar,#bottom-bar{padding-left:var(--gutter);padding-right:var(--gutter);}
    #left-rule{left:var(--gutter);}#right-rule{right:var(--gutter);}
    .panel{left:var(--gutter);right:var(--gutter);}
    .act0-layout{grid-template-columns:minmax(0,1fr) 150px;gap:24px;}
    .act0-seal{width:146px;padding:16px 12px;}
    .seal-logo{width:70px;}
    .edition-line span{display:block;margin:7px 0 0;}
    .top-meta,.logo-sep{display:none;}
    #top-bar{gap:12px;}
    #ch-indicator{right:8px;}
    #panel-1{justify-content:flex-start;}
    .service-detail{flex-direction:column;align-items:flex-start;gap:8px;}
    .ma-jp{font-size:19px;}
}
@media(max-width:700px){
    :root{--gutter:20px;--footer-height:66px;}
    #ink-canvas{opacity:.2;}
    #top-bar{height:60px;padding:0 20px;gap:8px;}
    #top-bar>a:first-child{gap:8px!important;}
    .logo-en{font-size:8px;letter-spacing:.1em;white-space:normal;max-width:145px;}
    .nav-logo{height:26px;}
    #audio-toggle{width:36px;height:40px;flex-shrink:0;}
    .top-cta{font-size:9px;padding:0 9px;letter-spacing:0;min-height:40px;}
    .panel{top:60px;bottom:var(--footer-height);left:20px;right:20px;padding:28px 0;}
    #ch-indicator{display:none;}
    #progress-bar{top:60px;width:2px;}
    .progress-fill{width:2px;}
    #panel-0{justify-content:flex-start;}
    .act0-layout{grid-template-columns:minmax(0,1fr);gap:26px;}
    .edition-line{font-size:9px;margin-bottom:25px;letter-spacing:.055em;}
    .edition-line span{display:block;margin:5px 0 0;}
    .act0-jp{font-size:clamp(3.4rem,17.2vw,5.2rem);line-height:1.02;margin-bottom:16px;letter-spacing:-.04em;}
    .act0-en{font-size:clamp(1.9rem,9.6vw,3rem);}
    .act0-body{max-width:100%;font-size:10px;line-height:1.8;letter-spacing:.015em;margin-top:22px;}
    .hero-actions{gap:16px;margin-top:22px;flex-wrap:nowrap;align-items:center;}
    .text-link{font-size:10px;gap:15px;min-height:44px;}
    .hero-hint{font-size:9px;max-width:130px;}
    .act0-right{text-align:right;}
    .act0-seal{width:100%;display:grid;grid-template-columns:48px 1fr auto;align-items:center;gap:8px 15px;text-align:left;padding:14px 16px;border-color:rgba(224,92,31,.3);}
    .seal-logo{grid-row:1 / span 2;width:46px;margin:0;}
    .seal-heading{grid-column:2;font-size:8px;letter-spacing:.06em;}
    .seal-motto{grid-column:2;font-size:18px;grid-row:2;}
    .seal-motto br{display:none;}
    .act0-seal-sub{grid-column:3;grid-row:1;font-size:7px;margin:0;}
    .seal-replay{grid-column:3;grid-row:2;font-size:7px;margin:0;padding-top:0;border-top:0;text-align:right;max-width:55px;}
    #bottom-bar{padding:0 12px;gap:0;}
    .b-nav{display:none;}
    .chapter-nav{width:100%;gap:0;justify-content:space-between;}
    .chapter-nav a{flex:1;flex-direction:column;justify-content:center;gap:5px;font-size:8px;padding:0 2px;text-transform:uppercase;letter-spacing:.015em;}
    .chapter-nav a span{font-size:9px;}
    .chapter-nav a[aria-current]{border-top-width:2px;}
    .act1-grid{grid-template-columns:1fr 1fr;}
    .ma-cell{padding:16px 13px 12px;}
    .ma-jp{display:none;}
    .ma-num{font-size:9px;margin-bottom:7px;}
    .ma-title{font-size:24px;margin:0 0 7px;}
    .ma-body{font-size:9px;line-height:1.7;max-width:100%;text-transform:none;}
    .ma-cell::after{margin-top:12px;}
    .service-detail{padding:18px 16px;gap:8px;min-height:0;}
    .service-detail h2{font-size:25px;}
    .service-detail p{font-size:11px;line-height:1.75;}
    .m-haiku{font-size:clamp(1.7rem,8vw,2.5rem);line-height:1.4;margin-bottom:30px;}
    .m-kicker{margin-bottom:25px;}
    .m-rule-label{font-size:9px;}
    .m-rule-cell{padding:14px 12px;}
    .m-rule-val{font-size:20px;}
    .w-item{padding:17px 0;gap:6px 10px;min-height:80px;}
    .w-title-j{font-size:28px;}
    .w-cat-j{font-size:9px;line-height:1.6;}
    .w-num-j{font-size:9px;}
    .works-footnote{font-size:10px;line-height:1.8;}
    .g-left-jp,.g-right-jp{padding:22px 18px;}
    .genesis-jp{margin:0;}
    #panel-4{justify-content:flex-start!important;}
    .g-stamp{font-size:38px;}
    .g-cv a{font-size:17px;}
    .g-contact-row{display:block;}
    .g-contact-cell{padding:12px 0;border-right:0;}
    .g-contact-cell+.g-contact-cell{padding-left:0;border-top:var(--thin);}
    .g-form-jp label{font-size:9px;margin-top:16px;}
    .g-form-jp input,.g-form-jp textarea,.g-form-jp select{font-size:18px;min-height:44px;}
    .g-form-jp textarea{min-height:95px;}
    .case-box{padding:55px 22px 28px;}
    #case-modal{padding:16px;}
}
@media(max-width:370px){
    #top-bar{padding:0 16px;gap:5px;}
    .logo-en{font-size:7px;max-width:123px;}
    .nav-logo{height:22px;}
    .top-cta{font-size:8px;padding:0 7px;}
    .hero-actions{flex-wrap:wrap;gap:6px;}
    .hero-hint{max-width:none;}
    .act0-seal{grid-template-columns:42px 1fr;}
    .seal-replay,.act0-seal-sub{display:none;}
    .g-contact-row{display:block;}
    .g-contact-cell+.g-contact-cell{padding-left:0;border-top:var(--thin);}
    .g-contact-cell{border-right:0;}
}
/* Works: a quiet project index beside a persistent photographic plate. */
#panel-3{justify-content:safe center;}
.works-kicker{flex-shrink:0;margin-bottom:20px;}
.works-layout{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,1fr);gap:clamp(32px,5vw,72px);align-items:start;flex-shrink:0;}
.works-index{min-width:0;}
.works-list .w-item{grid-template-columns:28px minmax(0,1fr) 22px;gap:4px 15px;min-height:72px;padding:10px 0;align-items:center;transition:color .2s,background .2s;}
.works-list .w-num-j{grid-column:1;grid-row:1 / span 2;align-self:center;font-size:9px;}
.works-list .w-title-j{grid-column:2;grid-row:1;font-size:clamp(28px,2.5vw,36px);line-height:1.08;}
.works-list .w-cat-j{grid-column:2;grid-row:2;font-size:9px;line-height:1.45;letter-spacing:.055em;}
.works-list .w-arr{grid-column:3;grid-row:1 / span 2;align-self:center;font-size:18px;opacity:0;transform:translateX(-5px);}
.works-list .w-item:hover,.works-list .w-item:focus-visible{padding-left:0;}
.works-list .w-item:focus-visible{outline-offset:-3px;}
.works-list .w-item[aria-pressed=true] .w-title-j,.works-list .w-item[aria-pressed=true] .w-num-j{color:var(--accent-text);}
.works-list .w-item:hover .w-title-j{color:var(--accent-text);}
.works-list .w-item[aria-pressed=true] .w-arr{opacity:1;transform:translateX(0);color:var(--accent-text);}
.works-index .works-footnote{font-size:10px;line-height:1.7;max-width:410px;margin-top:18px;}
.works-preview{position:sticky;top:0;min-width:0;margin:0;padding-top:0;}
.works-preview-image{position:relative;display:block;width:100%;aspect-ratio:4/3;overflow:hidden;padding:0;border:var(--thin);background:var(--paper);cursor:pointer;}
.works-preview-images{display:block;position:absolute;inset:0;}
.works-preview-images img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(25%) sepia(8%);opacity:0;transition:opacity .32s ease;}
.works-preview-images img.is-current{opacity:1;}
.works-preview-images img[data-failed=true]{visibility:hidden;}
.works-image-error{position:absolute;inset:0;padding:28px;align-content:center;text-align:center;font:11px/1.8 'JetBrains Mono',monospace;color:var(--muted);}
.works-preview figcaption{border-bottom:var(--thin);padding:18px 0 14px;}
.works-preview-meta{display:flex;justify-content:space-between;gap:18px;font:9px/1.6 'JetBrains Mono',monospace;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);}
#works-preview-count{color:var(--accent-text);white-space:nowrap;}
#works-preview-category{text-align:right;}
.works-preview-caption{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:6px;}
.works-preview-caption h2{font:300 clamp(25px,2.4vw,34px)/1.12 'Cormorant Garamond',serif;letter-spacing:-.01em;}
.works-preview-caption .text-link{flex-shrink:0;font-size:9px;gap:14px;min-height:44px;}
@media(min-width:701px) and (max-width:1000px){
    .works-layout{gap:28px;grid-template-columns:minmax(0,1fr) minmax(0,1fr);}
    .works-list .w-title-j{font-size:28px;}
    .works-preview-caption{display:block;}
    .works-preview-caption .text-link{margin-top:8px;}
}
@media(max-width:700px){
    #panel-3{justify-content:flex-start;}
    .works-kicker{font-size:9px;margin-bottom:18px;}
    .works-layout{display:flex;flex-direction:column;gap:20px;}
    .works-index{width:100%;order:2;}
    .works-preview{width:100%;order:1;z-index:2;background:var(--paper);padding-bottom:10px;}
    .works-preview-image{aspect-ratio:16/9;max-height:190px;}
    .works-preview figcaption{padding:10px 0 8px;}
    .works-preview-meta{font-size:8px;gap:12px;}
    .works-preview-caption{gap:10px;margin-top:2px;}
    .works-preview-caption h2{font-size:27px;}
    .works-preview-caption .text-link{font-size:9px;gap:8px;}
    .works-list .w-item{min-height:66px;padding:11px 0;gap:4px 12px;}
    .works-list .w-title-j{font-size:27px;}
    .works-list .w-cat-j{font-size:8px;}
    .works-index .works-footnote{font-size:9px;margin-top:18px;}
}
@media(max-width:370px){
    .works-preview-caption h2{font-size:23px;}
    .works-preview-caption .text-link{font-size:8px;}
}
@media(max-width:700px) and (max-height:520px){
    .works-preview{position:static;}
}
@media(prefers-reduced-motion:reduce){
    *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important;}
    .cursor-ring,.hover-capsule{display:none!important;}
}

/* Japan × original 3D mark: only the Hero seal differs from the approved edition. */
@media(min-width:701px){
    .act0-layout{grid-template-columns:minmax(0,1fr) 205px;}
    .act0-seal{width:200px;}
}
.seal-sculpture{
    position:relative;
    display:block;
    width:100%;
    height:142px;
    margin:9px auto 8px;
}
.seal-sculpture canvas{
    display:block;
    width:100%;
    height:100%;
    pointer-events:none;
    filter:drop-shadow(3px 7px 5px rgba(99,48,21,.18));
}
.seal-sculpture .seal-logo{
    position:absolute;
    width:92px;
    max-width:84%;
    height:auto;
    top:50%;left:50%;
    margin:0;
    transform:translate(-50%,-50%);
}
.seal-sculpture[data-renderer="webgl"] .seal-logo{opacity:0;}
@media(min-width:701px) and (max-width:900px){
    .act0-layout{grid-template-columns:minmax(0,1fr) 150px;}
    .act0-seal{width:146px;}
    .seal-sculpture{height:118px;}
}
@media(max-width:700px){
    .act0-seal{grid-template-columns:64px minmax(0,1fr) auto;gap:8px 12px;}
    .seal-sculpture{grid-column:1;grid-row:1 / span 2;width:64px;height:62px;margin:0;}
    .seal-sculpture .seal-logo{width:45px;}
}
@media(max-width:370px){
    .act0-seal{grid-template-columns:54px minmax(0,1fr) auto;gap:6px 9px;padding:12px;}
    .seal-sculpture{width:54px;height:56px;}
}