/* V169 — mobile-only interaction layer. Desktop (>800px) is intentionally untouched. */
.mobile-radial-nav{display:none}

@media(max-width:800px){
  :root{--mobile-safe-top:env(safe-area-inset-top,0px);--mobile-safe-bottom:env(safe-area-inset-bottom,0px)}

  /* Keep the existing desktop header, but make its two utility controls compact enough
     to leave the exact top-centre position clear for the radial navigation handle. */
  .header{z-index:5600!important}
  .header-grid{grid-template-columns:minmax(0,1fr) auto!important;column-gap:8px!important}
  .header .nav{display:none!important}
  .brand,.brand-window{width:102px!important;min-width:102px!important;height:40px!important}
  .brand>img,.brand-window>img,.brand img{width:102px!important;max-width:102px!important;height:40px!important}
  .header-actions{gap:5px!important}
  .header-actions .language-button{width:58px!important;min-width:58px!important;height:36px!important;min-height:36px!important;padding:0 8px!important;border-radius:12px!important;font-size:11px!important}
  .header-actions .language-dot{display:none!important}
  .header-actions .nav-download-button{position:relative;width:48px!important;min-width:48px!important;height:36px!important;min-height:36px!important;padding:0 6px!important;gap:3px!important;border-radius:12px!important;font-size:10px!important}
  .header-actions .nav-download-button>span{display:none!important}
  .header-actions .nav-download-button::before{content:"CV";font-size:10px;font-weight:750;letter-spacing:.06em}
  .header-actions .nav-download-button>b{font-size:12px!important}

  /* Top-centre semicircular radial carousel navigation. */
  .mobile-radial-nav{display:block;position:fixed;inset:0;z-index:12000;pointer-events:none;font-family:Inter,Arial,Helvetica,sans-serif}
  .mobile-radial-scrim{position:absolute;inset:0;background:rgba(1,8,13,.12);backdrop-filter:blur(1.5px);-webkit-backdrop-filter:blur(1.5px);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .32s ease,visibility 0s linear .34s}
  .mobile-radial-nav.is-open .mobile-radial-scrim{opacity:1;visibility:visible;pointer-events:auto;transition-delay:0s}
  .mobile-radial-panel{
    position:absolute;top:0;left:50%;width:min(96vw,500px);height:clamp(198px,53vw,245px);
    overflow:hidden;pointer-events:none;isolation:isolate;
    border:1px solid rgba(255,255,255,.14);border-top:0;
    border-radius:0 0 50% 50% / 0 0 100% 100%;
    background:
      radial-gradient(ellipse at 50% -5%,rgba(255,255,255,.11),transparent 43%),
      linear-gradient(180deg,rgba(5,18,27,.94),rgba(5,18,27,.80) 56%,rgba(4,14,22,.72));
    box-shadow:0 24px 55px rgba(0,0,0,.30),inset 0 -1px 0 rgba(255,255,255,.05);
    backdrop-filter:blur(24px) saturate(1.08);-webkit-backdrop-filter:blur(24px) saturate(1.08);
    transform:translate3d(-50%,-104%,0) scaleY(.58);transform-origin:50% 0;
    opacity:.15;visibility:hidden;
    transition:transform .50s cubic-bezier(.16,1,.3,1),opacity .30s ease,visibility 0s linear .52s;
  }
  .mobile-radial-nav.is-open .mobile-radial-panel{transform:translate3d(-50%,0,0) scaleY(1);opacity:1;visibility:visible;pointer-events:auto;transition-delay:0s}
  .mobile-radial-nav.is-closing .mobile-radial-panel{transform:translate3d(-50%,-104%,0) scaleY(.56);opacity:.12}
  .mobile-radial-panel::before{content:"";position:absolute;left:7%;right:7%;bottom:7%;height:70%;border-bottom:1px solid rgba(255,255,255,.13);border-radius:0 0 50% 50% / 0 0 100% 100%;pointer-events:none}
  .mobile-radial-panel::after{content:"";position:absolute;left:50%;bottom:10%;width:5px;height:5px;border-radius:50%;background:rgba(255,255,255,.72);box-shadow:0 0 18px rgba(255,255,255,.32);transform:translateX(-50%);pointer-events:none}
  .mobile-radial-track{position:absolute;inset:0;touch-action:none;user-select:none;-webkit-user-select:none;cursor:grab}
  .mobile-radial-track.is-dragging{cursor:grabbing}
  .mobile-radial-item{
    position:absolute;left:var(--x,50%);top:var(--y,50%);z-index:3;
    width:max-content;max-width:38vw;min-height:38px;margin:0;padding:7px 10px;
    border:0;background:transparent;color:rgba(255,255,255,var(--alpha,.55));
    font:600 clamp(10px,2.9vw,13px)/1.12 Inter,Arial,Helvetica,sans-serif;
    letter-spacing:.04em;text-align:center;white-space:normal;cursor:pointer;
    transform:translate(-50%,-50%) scale(var(--scale,.78));transform-origin:center;
    opacity:var(--opacity,.65);filter:blur(var(--blur,0px));
    transition:color .18s ease,text-shadow .18s ease,opacity .18s ease,filter .18s ease;
    -webkit-tap-highlight-color:transparent;
  }
  .mobile-radial-nav.is-snapping .mobile-radial-item{transition:left .29s cubic-bezier(.16,1,.3,1),top .29s cubic-bezier(.16,1,.3,1),transform .29s cubic-bezier(.16,1,.3,1),color .18s ease,text-shadow .18s ease,opacity .18s ease,filter .18s ease}
  .mobile-radial-item.is-active{color:#fff;text-shadow:0 0 22px rgba(255,255,255,.27);font-size:clamp(13px,3.6vw,17px);font-weight:720;letter-spacing:.055em}
  .mobile-radial-item.is-active::after{content:"";position:absolute;left:22%;right:22%;bottom:1px;height:1px;background:rgba(255,255,255,.60);box-shadow:0 0 10px rgba(255,255,255,.18)}
  .mobile-radial-instruction{position:absolute;left:50%;top:26%;z-index:2;transform:translateX(-50%);color:rgba(255,255,255,.42);font-size:8.5px;letter-spacing:.18em;white-space:nowrap;text-transform:uppercase;pointer-events:none}
  .mobile-radial-trigger{
    position:absolute;top:0;left:50%;z-index:7;width:76px;height:37px;padding:3px 8px 5px;
    display:flex;align-items:center;justify-content:center;gap:6px;pointer-events:auto;
    border:1px solid rgba(255,255,255,.17);border-top:0;border-radius:0 0 18px 18px;
    background:rgba(5,18,27,.80);color:rgba(255,255,255,.90);
    box-shadow:0 7px 24px rgba(0,0,0,.20),inset 0 -1px 0 rgba(255,255,255,.04);
    backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
    transform:translateX(-50%);cursor:pointer;-webkit-tap-highlight-color:transparent;
    animation:mobileMenuBreathe 4.6s ease-in-out infinite;
  }
  .mobile-radial-trigger-label{font-size:8px;font-weight:730;letter-spacing:.15em;line-height:1}
  .mobile-radial-trigger-arrow{width:7px;height:7px;border-right:1.4px solid currentColor;border-bottom:1.4px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform .34s cubic-bezier(.16,1,.3,1)}
  .mobile-radial-nav.is-open .mobile-radial-trigger{animation:none;background:rgba(5,18,27,.44)}
  .mobile-radial-nav.is-open .mobile-radial-trigger-arrow{transform:translateY(2px) rotate(225deg)}
  @keyframes mobileMenuBreathe{0%,72%,100%{transform:translateX(-50%) translateY(0);box-shadow:0 7px 24px rgba(0,0,0,.20)}82%{transform:translateX(-50%) translateY(2px);box-shadow:0 9px 28px rgba(0,0,0,.24),0 0 18px rgba(255,255,255,.035)}90%{transform:translateX(-50%) translateY(0)}}
  body.mobile-nav-open{overflow:hidden!important}

  /* WhatsApp stays reachable without covering long-form mobile content. */
  .whatsapp-float{width:50px!important;height:50px!important;min-width:50px!important;padding:0!important;border-radius:50%!important;display:grid!important;place-items:center!important;right:14px!important;bottom:calc(14px + var(--mobile-safe-bottom))!important}
  .whatsapp-float>span:last-child{display:none!important}
  .whatsapp-float-icon{margin:0!important}

  /* Mobile reader: the viewport itself becomes the reader. No outer card/frame. */
  .html-reader-overlay{padding:0!important;background:#0f1720!important}
  .html-reader-shell{width:100vw!important;height:100svh!important;border:0!important;border-radius:0!important;box-shadow:none!important;background:#0f1720!important;grid-template-rows:1fr!important;overflow:hidden!important}
  .html-reader-toolbar{position:absolute!important;z-index:10!important;top:calc(10px + var(--mobile-safe-top));right:10px!important;left:auto!important;width:auto!important;min-height:0!important;padding:0!important;border:0!important;background:transparent!important;pointer-events:none!important}
  .html-reader-toolbar h1{display:none!important}
  .html-reader-close{width:40px!important;height:40px!important;pointer-events:auto!important;border:1px solid rgba(255,255,255,.18)!important;background:rgba(7,17,24,.34)!important;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);font-size:25px!important;opacity:.62;transition:opacity .18s ease,background .18s ease!important}
  .html-reader-close:active{opacity:1;background:rgba(7,17,24,.68)!important}
  .html-reader-frame{position:absolute!important;inset:0!important;width:100vw!important;height:100svh!important;border:0!important;background:#0f1720!important}
  .html-reader-loading{inset:0!important;background:#0f1720!important;color:rgba(255,255,255,.72)!important}

  /* Work / Management: default mobile state keeps the sphere as the main visual.
     Selecting a word extracts its content into a full-screen layer while the sphere
     recedes behind it. */
  .management-field-grid{display:block!important;min-height:0!important}
  .management-sphere-panel{height:min(78svh,680px)!important;min-height:540px!important;border-right:0!important;border-bottom:0!important;transition:filter .48s ease,opacity .48s ease,transform .52s cubic-bezier(.16,1,.3,1)!important}
  .management-sphere-wrap{inset:112px 0 0!important}
  .management-sphere{width:min(88vw,430px)!important;height:min(88vw,430px)!important;max-width:none!important;max-height:none!important;transition:transform .56s cubic-bezier(.16,1,.3,1),opacity .48s ease,filter .48s ease!important}
  .management-sphere-word{font-size:clamp(10px,2.75vw,12px)!important;padding:5px 4px!important}
  .management-insight-panel{display:none!important}
  .management-field-stage.is-mobile-concept-open .management-sphere{transform:scale(.82)!important;opacity:.20!important;filter:blur(1.7px) saturate(.72)!important}
  .management-field-stage.is-mobile-concept-open .management-sphere-heading,.management-field-stage.is-mobile-concept-open .management-sphere-hint{opacity:.08!important;transition:opacity .28s ease!important}
  .management-field-stage.is-mobile-concept-open .management-sphere-wrap{pointer-events:none!important}
  body.management-mobile-focus{overflow:hidden!important}
  body.management-mobile-focus .mobile-radial-nav{opacity:0!important;pointer-events:none!important}
  body>.management-insight-panel.is-mobile-focus-layer{
    display:flex!important;position:fixed!important;inset:0!important;z-index:11500!important;
    width:100vw!important;height:100svh!important;min-height:0!important;padding:calc(66px + var(--mobile-safe-top)) 22px calc(28px + var(--mobile-safe-bottom))!important;
    overflow-y:auto!important;overscroll-behavior:contain!important;
    background:linear-gradient(180deg,rgba(4,14,22,.58),rgba(4,14,22,.77) 42%,rgba(4,14,22,.91) 100%)!important;
    backdrop-filter:blur(.7px);-webkit-backdrop-filter:blur(.7px);
    opacity:0;transform:translateY(18px);pointer-events:none;
    transition:opacity .36s ease,transform .48s cubic-bezier(.16,1,.3,1)!important;
  }
  body>.management-insight-panel.is-mobile-focus-layer.is-mobile-focus-visible{opacity:1;transform:translateY(0);pointer-events:auto}
  body>.management-insight-panel.is-mobile-focus-layer.is-mobile-focus-closing{opacity:0;transform:translateY(14px);pointer-events:none}
  .management-mobile-close{
    position:fixed;top:calc(12px + var(--mobile-safe-top));right:14px;z-index:2;width:42px;height:42px;
    display:grid;place-items:center;margin:0;padding:0;border:1px solid rgba(255,255,255,.18);border-radius:50%;
    background:rgba(7,17,24,.30);color:#fff;font:300 28px/1 Arial,sans-serif;cursor:pointer;
    backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);-webkit-tap-highlight-color:transparent;
  }
  body>.management-insight-panel.is-mobile-focus-layer .management-insight-kicker{padding-right:52px}
  body>.management-insight-panel.is-mobile-focus-layer .management-concept-name{margin-top:18px;font-size:clamp(18px,5vw,24px);animation:mobileConceptExtract .52s cubic-bezier(.16,1,.3,1) both}
  body>.management-insight-panel.is-mobile-focus-layer .management-concept-title{min-height:0!important;font-size:clamp(30px,8vw,42px)!important;line-height:1.02!important}
  body>.management-insight-panel.is-mobile-focus-layer .management-position{font-size:clamp(16px,4.2vw,18px)!important;line-height:1.72!important}
  body>.management-insight-panel.is-mobile-focus-layer .management-signals{margin-top:28px!important;padding-top:18px!important}
  body>.management-insight-panel.is-mobile-focus-layer .management-signal-item{font-size:14px!important;line-height:1.58!important;padding:12px 0!important}
  body>.management-insight-panel.is-mobile-focus-layer .management-audio{margin-top:22px}
  @keyframes mobileConceptExtract{0%{opacity:0;transform:translateY(18vh) scale(1.08);letter-spacing:.16em}100%{opacity:1;transform:translateY(0) scale(1);letter-spacing:.08em}}
}

@media(max-width:420px){
  .brand,.brand-window{width:94px!important;min-width:94px!important}
  .brand>img,.brand-window>img,.brand img{width:94px!important;max-width:94px!important}
  .header-actions .language-button{width:52px!important;min-width:52px!important;padding:0 6px!important}
  .header-actions .nav-download-button{width:44px!important;min-width:44px!important}
  .mobile-radial-trigger{width:68px}
  .mobile-radial-panel{width:98vw}
  .management-field-hero{padding-left:20px!important;padding-right:20px!important}
  .management-field-hero h2{font-size:clamp(38px,11vw,46px)!important}
  .management-sphere-panel{min-height:520px!important}
  body>.management-insight-panel.is-mobile-focus-layer{padding-left:19px!important;padding-right:19px!important}
}

/* All Reading: mobile is intentionally a landscape experience. */
.library-orientation-guard{display:none}
body.html-reader-open .library-orientation-guard{display:none!important}
@media(max-width:900px) and (orientation:portrait){
  body:has(.library-orientation-guard){overflow:hidden!important}
  .reading-room{min-width:0!important;min-height:100svh!important;width:100vw!important;height:100svh!important;overflow:hidden!important;place-items:center!important}
  .reading-room .library-stage{width:94vw!important;min-width:0!important;max-width:94vw!important;opacity:.20!important;filter:blur(8px) brightness(.62)!important;transform:scale(.90)!important;pointer-events:none!important}
  .library-orientation-guard{
    position:fixed;inset:0;z-index:13000;display:flex;flex-direction:column;align-items:center;justify-content:center;
    padding:32px;text-align:center;color:#f3e8d6;background:radial-gradient(circle at 50% 45%,rgba(18,42,55,.54),rgba(3,9,14,.86) 66%);
    backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px)
  }
  .library-orientation-phone{position:relative;width:42px;height:70px;margin-bottom:25px;border:1.5px solid rgba(243,232,214,.76);border-radius:9px;animation:libraryRotatePhone 2.5s cubic-bezier(.16,1,.3,1) infinite}
  .library-orientation-phone::after{content:"";position:absolute;left:50%;bottom:5px;width:4px;height:4px;border-radius:50%;background:rgba(243,232,214,.68);transform:translateX(-50%)}
  .library-orientation-guard strong{font:400 clamp(28px,8vw,38px)/1.02 Georgia,"Times New Roman",serif;letter-spacing:-.02em}
  .library-orientation-guard span{max-width:290px;margin-top:12px;color:rgba(243,232,214,.62);font-size:11px;line-height:1.6;letter-spacing:.09em;text-transform:uppercase}
  @keyframes libraryRotatePhone{0%,22%{transform:rotate(0deg)}60%,86%{transform:rotate(90deg)}100%{transform:rotate(90deg)}}
}
@media(max-width:950px) and (orientation:landscape){
  body:has(.reading-room){overflow:hidden!important}
  .reading-room{width:100vw!important;height:100svh!important;min-width:0!important;min-height:0!important;overflow:hidden!important;place-items:center!important}
  .reading-room .library-stage{width:min(100vw,calc(100svh * 7088 / 3987))!important;min-width:0!important;max-width:none!important;height:auto!important}
  .book-detail-panel{display:none!important}
  .shelf-book{touch-action:manipulation}
  .library-back-hotspot{font-size:clamp(11px,2vw,16px)!important}
}

@media(prefers-reduced-motion:reduce){
  .mobile-radial-trigger{animation:none!important}
  .mobile-radial-panel,.mobile-radial-item,.management-sphere,.management-insight-panel{transition-duration:.01ms!important}
  .library-orientation-phone{animation:none!important;transform:rotate(90deg)!important}
}

/* =========================================================
   V170 mobile refinements — desktop remains untouched.
   ========================================================= */
@media(max-width:800px){
  /* Thinner, fully transparent mobile header. */
  .header{
    height:50px!important;min-height:0!important;
    background:transparent!important;border:0!important;box-shadow:none!important;
    backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
  }
  .header::before,.header::after{display:none!important}
  .safe.header-grid,.header-grid{height:50px!important;min-height:0!important;padding-top:0!important;padding-bottom:0!important}
  .brand,.brand-window{width:88px!important;min-width:88px!important;height:32px!important}
  .brand>img,.brand-window>img,.brand img{width:88px!important;max-width:88px!important;height:32px!important}
  .header-actions{gap:4px!important}
  .header-actions .language-button{
    width:50px!important;min-width:50px!important;height:30px!important;min-height:30px!important;
    padding:0 6px!important;border-radius:10px!important;font-size:10px!important;
    background:rgba(4,16,24,.08)!important;border-color:rgba(255,255,255,.08)!important;
    box-shadow:none!important;backdrop-filter:blur(7px)!important;-webkit-backdrop-filter:blur(7px)!important;
  }
  .header-actions .nav-download-button{
    width:39px!important;min-width:39px!important;height:30px!important;min-height:30px!important;
    padding:0 4px!important;border-radius:10px!important;font-size:9px!important;
    background:rgba(4,16,24,.08)!important;border-color:rgba(255,255,255,.08)!important;
    box-shadow:none!important;backdrop-filter:blur(7px)!important;-webkit-backdrop-filter:blur(7px)!important;
  }

  /* Narrower semicircular menu; collapsed state leaves only a tiny top-centre handle. */
  .mobile-radial-panel{
    width:min(84vw,430px)!important;
    height:clamp(158px,43vw,190px)!important;
    border-color:rgba(255,255,255,.12)!important;
    background:radial-gradient(ellipse at 50% -5%,rgba(255,255,255,.085),transparent 44%),linear-gradient(180deg,rgba(5,18,27,.90),rgba(5,18,27,.74) 58%,rgba(4,14,22,.64))!important;
  }
  .mobile-radial-panel::before{left:8%!important;right:8%!important;bottom:6%!important;height:68%!important}
  .mobile-radial-panel::after{bottom:9%!important;width:4px!important;height:4px!important}
  .mobile-radial-item{max-width:32vw!important;min-height:32px!important;padding:5px 7px!important;font-size:clamp(9px,2.55vw,12px)!important}
  .mobile-radial-item.is-active{font-size:clamp(12px,3.25vw,15px)!important}
  .mobile-radial-instruction{top:23%!important;font-size:7.5px!important;letter-spacing:.16em!important}
  .mobile-radial-trigger{
    top:-7px!important;width:38px!important;height:18px!important;padding:0!important;gap:0!important;
    border-radius:0 0 11px 11px!important;border-color:rgba(255,255,255,.14)!important;
    background:rgba(5,18,27,.24)!important;box-shadow:0 3px 12px rgba(0,0,0,.10)!important;
    backdrop-filter:blur(8px)!important;-webkit-backdrop-filter:blur(8px)!important;
  }
  .mobile-radial-trigger-arrow{width:6px!important;height:6px!important;transform:translateY(2px) rotate(45deg)!important}
  .mobile-radial-nav.is-open .mobile-radial-trigger{top:0!important;background:rgba(5,18,27,.20)!important}
  .mobile-radial-nav.is-open .mobile-radial-trigger-arrow{transform:translateY(0) rotate(225deg)!important}
  .mobile-radial-trigger-label{
    position:absolute;left:50%;top:20px;transform:translateX(-50%);
    font-size:7px!important;letter-spacing:.14em!important;opacity:0;pointer-events:none;
    transition:opacity .24s ease,transform .28s ease;white-space:nowrap;
  }
  .mobile-nav-hinting:not(.is-open) .mobile-radial-trigger-label{opacity:.66;transform:translateX(-50%) translateY(1px)}
  @keyframes mobileMenuBreathe{0%,74%,100%{transform:translateX(-50%) translateY(0)}84%{transform:translateX(-50%) translateY(1.5px)}92%{transform:translateX(-50%) translateY(0)}}

  /* Work management: concept view is clean full-screen; the sphere disappears visually. */
  .management-field-stage.is-mobile-concept-open .management-sphere{
    transform:scale(.86)!important;opacity:0!important;filter:none!important;
  }
  .management-field-stage.is-mobile-concept-open .management-sphere-heading,
  .management-field-stage.is-mobile-concept-open .management-sphere-hint{opacity:0!important}

  /* Home Management: moving words are the mobile interaction targets. */
  .home-management-concept{
    pointer-events:auto!important;cursor:pointer;-webkit-tap-highlight-color:transparent;
    touch-action:manipulation;padding:7px 8px!important;
  }
  .home-management-field-instruction{
    max-width:310px!important;
  }
  body.home-management-mobile-focus{overflow:hidden!important}
  body.home-management-mobile-focus .mobile-radial-nav{opacity:0!important;pointer-events:none!important}
  .home-management-concept-overlay{
    position:fixed;inset:0;z-index:11550;display:flex;flex-direction:column;justify-content:center;
    width:100vw;height:100svh;padding:calc(66px + var(--mobile-safe-top)) 24px calc(34px + var(--mobile-safe-bottom));
    background:linear-gradient(180deg,rgba(4,14,22,.91),rgba(4,14,22,.98));
    color:#fff;opacity:0;transform:translateY(16px);pointer-events:none;
    transition:opacity .32s ease,transform .46s cubic-bezier(.16,1,.3,1);
  }
  .home-management-concept-overlay.is-open{opacity:1;transform:none;pointer-events:auto}
  .home-management-concept-overlay-close{
    position:fixed;top:calc(12px + var(--mobile-safe-top));right:14px;width:42px;height:42px;border-radius:50%;
    border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.035);color:#fff;
    font:300 28px/1 Arial,sans-serif;display:grid;place-items:center;z-index:2;
  }
  .home-management-concept-overlay-kicker{margin:0 0 16px;font-size:10px;font-weight:700;letter-spacing:.22em;color:rgba(255,255,255,.47);text-transform:uppercase}
  .home-management-concept-overlay-title{margin:0;font-family:Georgia,"Times New Roman",serif;font-size:clamp(48px,15vw,76px);font-weight:400;line-height:.96;letter-spacing:-.04em}
  .home-management-concept-overlay-rule{width:52px;height:1px;margin:28px 0 24px;background:rgba(239,140,80,.86)}
  .home-management-concept-overlay-copy{max-width:680px;margin:0;font-size:clamp(17px,4.7vw,21px);line-height:1.72;color:rgba(255,255,255,.78)}

  /* Home photo preview: one photograph per screen, horizontal swipe; metadata lives below the photo. */
  .home-mubu-preview-stage{
    position:relative!important;display:block!important;width:100vw!important;height:100svh!important;
    padding:calc(50px + var(--mobile-safe-top)) 12px calc(18px + var(--mobile-safe-bottom))!important;
    overflow:hidden!important;touch-action:none!important;
  }
  .home-mubu-preview-frame{
    position:absolute!important;inset:calc(50px + var(--mobile-safe-top)) 12px calc(18px + var(--mobile-safe-bottom)) 12px!important;
    width:auto!important;height:auto!important;aspect-ratio:auto!important;margin:0!important;
    display:none!important;flex-direction:column!important;align-items:stretch!important;justify-content:center!important;
    border:0!important;box-shadow:none!important;overflow:hidden!important;background:transparent!important;
    transform:none!important;filter:none!important;
  }
  .home-mubu-preview-frame.is-mobile-current{display:flex!important}
  .home-mubu-preview-frame img{
    flex:1 1 auto!important;min-height:0!important;width:100%!important;height:auto!important;max-height:100%!important;
    object-fit:contain!important;object-position:center!important;background:transparent!important;transform:none!important;
    transition:max-height .25s ease!important;
  }
  .home-photo-info{
    position:relative!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;
    flex:0 0 auto!important;width:100%!important;max-width:none!important;max-height:0!important;overflow:hidden!important;
    margin:0!important;padding:0 4px!important;border:0!important;border-radius:0!important;
    background:transparent!important;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
    opacity:0!important;visibility:hidden!important;transform:none!important;pointer-events:none!important;
    font-size:11px!important;line-height:1.52!important;color:rgba(255,255,255,.78)!important;
    transition:max-height .22s ease,opacity .18s ease,padding .22s ease!important;
  }
  .home-mubu-preview.is-mobile-info-peek .home-mubu-preview-frame.is-mobile-current img{max-height:74%!important}
  .home-mubu-preview.is-mobile-info-peek .home-mubu-preview-frame.is-mobile-current .home-photo-info{
    max-height:190px!important;opacity:1!important;visibility:visible!important;padding:13px 4px 0!important;
  }
  .home-photo-mobile-pager{
    position:fixed;z-index:5;left:50%;bottom:calc(9px + var(--mobile-safe-bottom));transform:translateX(-50%);
    display:flex;align-items:center;gap:7px;padding:6px 10px;border-radius:999px;
    background:rgba(4,14,22,.34);backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px);
    color:rgba(255,255,255,.68);font-size:9px;letter-spacing:.12em;pointer-events:none;
  }
  .home-photo-mobile-pager-dot{width:4px;height:4px;border-radius:50%;background:rgba(255,255,255,.28);transition:transform .18s ease,background .18s ease}
  .home-photo-mobile-pager-dot.is-active{transform:scale(1.7);background:#fff}
  .home-mubu-preview-close{top:calc(9px + var(--mobile-safe-top))!important;right:10px!important}

  /* Home 3D mobile fullscreen control and landscape prompt. */
  .home-3d-mobile-fullscreen-button{
    position:absolute;z-index:9;left:10px;top:10px;width:42px;height:42px;border-radius:50%;
    border:1px solid rgba(255,255,255,.18);background:rgba(6,17,24,.48);color:#fff;
    display:grid;place-items:center;font-size:18px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  }
  .home-3d-mobile-fullscreen-button::before{content:"⛶"}
  .home-3d-model-stage.is-mobile-fullscreen,
  body.home-3d-mobile-fullscreen .home-3d-model-stage{
    position:fixed!important;inset:0!important;z-index:14000!important;width:100vw!important;height:100svh!important;
    aspect-ratio:auto!important;margin:0!important;opacity:1!important;transform:none!important;filter:none!important;background:#071018!important;
  }
  .home-3d-model-stage.is-mobile-fullscreen .home-3d-model-shell,
  body.home-3d-mobile-fullscreen .home-3d-model-shell{inset:0!important;border:0!important;border-radius:0!important;transform:none!important}
  .home-3d-model-stage.is-mobile-fullscreen .home-3d-iframe,
  body.home-3d-mobile-fullscreen .home-3d-iframe{pointer-events:auto!important}
  .home-3d-model-stage.is-mobile-fullscreen .home-3d-interaction-shield,
  body.home-3d-mobile-fullscreen .home-3d-interaction-shield{display:none!important}
  .home-3d-mobile-fullscreen-close{
    position:fixed;z-index:14010;right:10px;top:calc(10px + var(--mobile-safe-top));width:42px;height:42px;border-radius:50%;
    border:1px solid rgba(255,255,255,.20);background:rgba(6,17,24,.55);color:#fff;font:300 27px/1 Arial,sans-serif;
    display:none;place-items:center;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  }
  body.home-3d-mobile-fullscreen .home-3d-mobile-fullscreen-close,.home-3d-model-stage.is-mobile-fullscreen .home-3d-mobile-fullscreen-close{display:grid}
  .home-3d-mobile-rotate-hint{
    position:absolute;inset:0;z-index:14005;display:none;place-items:center;text-align:center;padding:30px;
    background:rgba(4,14,22,.70);color:rgba(255,255,255,.86);font-size:11px;letter-spacing:.13em;text-transform:uppercase;
    pointer-events:none;
  }
  @media(orientation:portrait){
    .home-3d-model-stage.is-mobile-fullscreen .home-3d-mobile-rotate-hint,
    body.home-3d-mobile-fullscreen .home-3d-mobile-rotate-hint{display:grid}
  }

  /* Writing page: only the first three books on one visible shelf, PC composition adapted to phone width. */
  .writing-library-zone .library-section{overflow:visible!important}
  .writing-library-zone .library-heading{margin-bottom:20px!important}
  .book-showcase-stage{
    min-height:320px!important;height:auto!important;padding:8px 0 86px!important;overflow:visible!important;
  }
  .book-showcase-row{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important;align-items:end!important;
    padding:0 8px!important;
  }
  .book-showcase-row .book-card:nth-child(n+4){display:none!important}
  .book-showcase-row .book-visual{width:min(100%,112px)!important}
  .book-showcase-stage .book-desk{
    display:block!important;visibility:visible!important;left:-10%!important;right:auto!important;bottom:-54px!important;width:120%!important;
    max-width:none!important;opacity:1!important;
  }
  .book-card::after{height:8px!important;margin-top:-3px!important;filter:blur(3px)!important}
  .book-auto-title{
    left:17%!important;right:5%!important;top:14.8%!important;min-height:23%!important;padding:0 2%!important;
    font-size:clamp(6.8px,2.15vw,9.5px)!important;line-height:1.28!important;letter-spacing:.025em!important;
  }
  .book-card:nth-child(3) .book-auto-title{top:16%!important}
  .library-heading p{font-size:0!important}
  .library-heading p::after{content:"Three selected volumes from the wider reading collection.";font-size:13px;line-height:1.6;color:rgba(255,255,255,.58)}
  html[lang^="zh"] .library-heading p::after{content:"从完整阅读系列中选择的三本作品。"}

  /* My Work writing section: same PC bookshelf logic, only the first three books on mobile. */
  .work-writing-shelf-stage{--work-writing-pad:22px!important;--work-writing-trim:0px!important;padding-bottom:16px!important;overflow:visible!important}
  .work-writing-shelf-stage .section-heading{margin-bottom:20px!important;padding-inline:22px!important}
  .work-writing-shelf-scene{min-height:320px!important;height:auto!important;padding:8px 0 86px!important;overflow:visible!important}
  .work-writing-books{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important;align-items:end!important;padding:0 8px!important}
  .work-writing-books .work-shelf-book:nth-child(n+4){display:none!important}
  .work-shelf-book-visual{width:min(100%,112px)!important}
  .work-writing-desk-wrap{display:block!important;left:-10%!important;right:auto!important;bottom:-54px!important;width:120%!important}
  .work-writing-desk{display:block!important;width:100%!important;opacity:1!important}
  .work-shelf-book::after{height:8px!important;margin-top:-3px!important;filter:blur(3px)!important}

  /* One mobile footer language across every main page. */
  .footer{padding:18px 0 calc(20px + var(--mobile-safe-bottom))!important}
  .footer-grid{display:grid!important;grid-template-columns:1fr!important;gap:11px!important;justify-items:center!important}
  .footer-copyright{justify-self:center!important;text-align:center!important;font-size:10.5px!important}
  .footer-socials{
    width:min(calc(100vw - 24px),390px)!important;max-width:390px!important;margin:0 auto!important;
    display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:6px!important;align-items:center!important;justify-self:center!important;
  }
  .footer-socials .footer-link{
    width:100%!important;min-width:0!important;min-height:34px!important;padding:0 5px!important;
    font-size:9.5px!important;letter-spacing:0!important;white-space:nowrap!important;
  }
  .footer-socials .footer-link-mail{
    grid-column:1/-1!important;width:auto!important;min-width:min(74vw,260px)!important;max-width:290px!important;
    justify-self:center!important;margin-top:3px!important;padding-inline:13px!important;font-size:10px!important;
  }

  /* Landscape library -> portrait reader handoff. */
  .reader-portrait-guard{
    position:fixed;inset:0;z-index:14500;display:none;place-items:center;padding:32px;text-align:center;
    background:radial-gradient(circle at 50% 45%,rgba(18,42,55,.50),rgba(3,9,14,.92) 68%);color:#f3e8d6;
    backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  }
  .reader-portrait-guard-inner{display:flex;flex-direction:column;align-items:center;gap:12px;max-width:300px}
  .reader-portrait-guard-phone{width:42px;height:70px;border:1.5px solid rgba(243,232,214,.76);border-radius:9px;transform:rotate(90deg);animation:readerTurnPortrait 2.3s cubic-bezier(.16,1,.3,1) infinite}
  .reader-portrait-guard strong{font:400 clamp(26px,7vw,36px)/1.05 Georgia,"Times New Roman",serif}
  .reader-portrait-guard span{font-size:10px;line-height:1.6;letter-spacing:.10em;color:rgba(243,232,214,.62);text-transform:uppercase}
  @keyframes readerTurnPortrait{0%,24%{transform:rotate(90deg)}64%,88%,100%{transform:rotate(0deg)}}
}

@media(max-width:950px) and (orientation:landscape){
  body.html-reader-open .reader-portrait-guard{display:grid}
}
@media(max-width:420px){
  .mobile-radial-panel{width:82vw!important}
  .brand,.brand-window{width:82px!important;min-width:82px!important}
  .brand>img,.brand-window>img,.brand img{width:82px!important;max-width:82px!important}
  .header-actions .language-button{width:46px!important;min-width:46px!important}
  .footer-socials{width:calc(100vw - 18px)!important;gap:4px!important}
  .footer-socials .footer-link{font-size:9px!important;padding-inline:3px!important}
}
@media(max-width:800px){
  body.home-3d-mobile-fullscreen{overflow:hidden!important;overscroll-behavior:none!important}
}
@media(max-width:800px){
  .mobile-radial-nav.is-closing .mobile-radial-trigger{top:-7px!important;background:rgba(5,18,27,.18)!important}
}

@media(min-width:801px) and (max-width:950px) and (orientation:landscape){
  .reader-portrait-guard{position:fixed;inset:0;z-index:14500;display:none;place-items:center;padding:32px;text-align:center;background:radial-gradient(circle at 50% 45%,rgba(18,42,55,.50),rgba(3,9,14,.92) 68%);color:#f3e8d6;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
  body.html-reader-open .reader-portrait-guard{display:grid}
  .reader-portrait-guard-inner{display:flex;flex-direction:column;align-items:center;gap:12px;max-width:300px}
  .reader-portrait-guard-phone{width:42px;height:70px;border:1.5px solid rgba(243,232,214,.76);border-radius:9px;transform:rotate(90deg);animation:readerTurnPortraitWide 2.3s cubic-bezier(.16,1,.3,1) infinite}
  .reader-portrait-guard strong{font:400 30px/1.05 Georgia,"Times New Roman",serif}
  .reader-portrait-guard span{font-size:10px;line-height:1.6;letter-spacing:.10em;color:rgba(243,232,214,.62);text-transform:uppercase}
  @keyframes readerTurnPortraitWide{0%,24%{transform:rotate(90deg)}64%,88%,100%{transform:rotate(0deg)}}
}