:root{--mh-lg-compact-w:120px;--mh-lg-expanded-w:min(420px,calc(100vw - 24px));--mh-lg-compact-h:38px;--mh-lg-expanded-h:92px;--mh-lg-blur:24px;--mh-lg-ease:cubic-bezier(.22,1,.36,1)}
.mh-island{width:var(--mh-lg-compact-w)!important;min-width:var(--mh-lg-compact-w)!important;height:var(--mh-lg-compact-h)!important;min-height:var(--mh-lg-compact-h)!important;box-sizing:border-box;overflow:hidden;isolation:isolate;contain:layout paint style;transform:translate3d(-50%,0,0);cursor:pointer;touch-action:manipulation;user-select:none;-webkit-tap-highlight-color:transparent;background:radial-gradient(140px 72px at var(--mh-light-x,18%) var(--mh-light-y,0%),rgb(255 255 255/.16),transparent 72%),radial-gradient(120% 160% at 16% 0%,color-mix(in srgb,var(--color-accent) 24%,transparent),transparent 44%),radial-gradient(90% 130% at 84% 0%,rgb(255 255 255/.13),transparent 42%),linear-gradient(180deg,rgb(255 255 255/.10),rgb(255 255 255/.025) 48%,rgb(0 0 0/.08)),color-mix(in srgb,#08130f 66%,transparent)!important;backdrop-filter:blur(var(--mh-lg-blur)) saturate(1.55) brightness(1.08);-webkit-backdrop-filter:blur(var(--mh-lg-blur)) saturate(1.55) brightness(1.08);border:1px solid rgb(255 255 255/.24)!important;box-shadow:0 18px 48px rgb(0 0 0/.28),0 2px 12px rgb(0 0 0/.16),inset 0 1px 0 rgb(255 255 255/.20),inset 0 -1px 0 rgb(0 0 0/.22);transition:none}
.mh-island:before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;pointer-events:none;background:linear-gradient(112deg,transparent 16%,rgb(255 255 255/.17) 27%,transparent 39%),radial-gradient(60% 90% at 28% 0%,rgb(255 255 255/.12),transparent 64%),radial-gradient(60% 90% at 78% 115%,color-mix(in srgb,var(--color-accent) 10%,transparent),transparent 65%);mix-blend-mode:screen;opacity:.95;transform:translate3d(-9%,-6%,0) scale(1.15);transition:none}
.mh-island:after{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;pointer-events:none;background:linear-gradient(180deg,rgb(255 255 255/.06),transparent 20%,transparent 76%,rgb(0 0 0/.12)),radial-gradient(80% 70% at 50% 120%,rgb(0 0 0/.18),transparent 70%);box-shadow:inset 0 0 0 1px rgb(255 255 255/.04)}
.mh-island[data-mh-expanded=true]{width:var(--mh-lg-expanded-w)!important;min-width:var(--mh-lg-expanded-w)!important;height:var(--mh-lg-expanded-h)!important;min-height:var(--mh-lg-expanded-h)!important;border-radius:30px!important;padding:10px 12px!important;align-items:stretch;justify-content:stretch;gap:10px;backdrop-filter:blur(30px) saturate(1.7) brightness(1.10);-webkit-backdrop-filter:blur(30px) saturate(1.7) brightness(1.10);box-shadow:0 26px 72px rgb(0 0 0/.34),0 6px 18px rgb(0 0 0/.18),inset 0 1px 0 rgb(255 255 255/.26),inset 0 -1px 0 rgb(0 0 0/.22)}
.mh-island[data-mh-expanded=true]:before{transform:translate3d(0,0,0) scale(1.02)}
.mh-island-icon{position:relative;z-index:2;flex:0 0 auto;width:10px;height:10px;border-radius:999px;background:var(--mh-lg-accent,var(--color-accent));box-shadow:0 0 0 3px color-mix(in srgb,var(--mh-lg-accent,var(--color-accent)) 18%,transparent),0 0 18px color-mix(in srgb,var(--mh-lg-accent,var(--color-accent)) 36%,transparent)}
.mh-island-label{position:relative;z-index:2;min-width:0;flex:1 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;opacity:1;transition:none;will-change:opacity,transform}.mh-island-label[data-swap=out],.mh-island-label[data-swap=in]{opacity:1!important}
.mh-island__expanded-content{position:absolute;inset:10px 44px 10px 48px;display:grid;grid-template-rows:auto auto 1fr;align-content:center;min-width:0;pointer-events:none;opacity:0;transform:translate3d(0,8px,0) scale(.985);transition:none}
.mh-island[data-mh-expanded=true] .mh-island__expanded-content{opacity:1;transform:translate3d(0,0,0) scale(1);}.mh-island__eyebrow{font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;opacity:.62}.mh-island__title{font-size:15px;line-height:1.1;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mh-island__hint{align-self:end;font-size:10px;opacity:.48;white-space:nowrap}
.mh-island__close{position:absolute;top:10px;right:10px;z-index:4;width:28px;height:28px;border-radius:999px;display:grid;place-items:center;border:1px solid rgb(255 255 255/.12);background:rgb(255 255 255/.08);color:inherit;font-size:18px;line-height:1;opacity:0;transform:scale(.82);pointer-events:none;transition:none}.mh-island[data-mh-expanded=true] .mh-island__close{opacity:.76;transform:scale(1);pointer-events:auto;}.mh-island__close:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}
.mh-island__hit{position:absolute;inset:0;z-index:3;width:100%;height:100%;padding:0;margin:0;border:0;background:transparent}.mh-island[data-mh-expanded=true] .mh-island__hit{right:36px;width:calc(100% - 36px)}
.mh-tabbar{isolation:isolate;overflow:clip;contain:layout paint style;background:radial-gradient(120% 180% at 50% 0%,color-mix(in srgb,var(--color-accent) 10%,transparent),transparent 44%),linear-gradient(180deg,rgb(255 255 255/.08),transparent 58%),color-mix(in srgb,var(--theme-surface) 58%,transparent)!important;backdrop-filter:blur(22px) saturate(1.55) brightness(1.05);-webkit-backdrop-filter:blur(22px) saturate(1.55) brightness(1.05);border-color:rgb(255 255 255/.14)!important;box-shadow:0 18px 42px rgb(0 0 0/.24),inset 0 1px 0 rgb(255 255 255/.18),inset 0 -1px 0 rgb(0 0 0/.16)}
.mh-tabbar__selection{position:absolute;left:0;top:0;width:0;height:0;border-radius:999px;pointer-events:none;z-index:0;background:radial-gradient(120% 160% at 50% 0%,color-mix(in srgb,var(--color-accent) 24%,transparent),transparent 64%),color-mix(in srgb,var(--color-accent) 15%,transparent);box-shadow:inset 0 1px 0 rgb(255 255 255/.14),0 4px 18px color-mix(in srgb,var(--color-accent) 11%,transparent);opacity:0;transform:translate3d(0,0,0);transition:none;will-change:transform,width,height}.mh-tabbar__selection[data-ready=true]{opacity:1}.mh-tab{z-index:1}.mh-tab[aria-current=page]{background:transparent!important}.mh-tab[aria-current=page]:before{display:none!important}
.mh-screen{transform:translate3d(0,8px,0) scale(.998);transform-origin:50% 50%;transition:none;filter:blur(0) saturate(1);will-change:transform,opacity,filter}.mh-screen[data-active=true]{transform:translate3d(0,0,0) scale(1)}.mh-screen[data-active=false]{transform:translate3d(0,10px,0) scale(.995);filter:blur(1.5px) saturate(.96)}
::view-transition-old(root),::view-transition-new(root){animation-duration:330ms;animation-timing-function:cubic-bezier(.22,1,.36,1)}::view-transition-old(root){animation-name:mh-vt-out}::view-transition-new(root){animation-name:mh-vt-in}@keyframes mh-vt-out{from{opacity:1;transform:scale(1)}to{opacity:.72;transform:scale(.994)}}@keyframes mh-vt-in{from{opacity:.72;transform:scale(1.006)}to{opacity:1;transform:scale(1)}}
@media (prefers-reduced-motion:reduce){.mh-island,.mh-tabbar,.mh-screen,.mh-island__expanded-content,.mh-island__close,.mh-island:before,.mh-tabbar__selection,::view-transition-old(root),::view-transition-new(root){transition-duration:1ms!important;animation-duration:1ms!important}}@media (prefers-reduced-transparency:reduce){.mh-island,.mh-tabbar{backdrop-filter:none;-webkit-backdrop-filter:none;background:color-mix(in srgb,var(--theme-surface) 94%,transparent)!important}}[data-reduced-transparency=true] .mh-island,[data-reduced-transparency=true] .mh-tabbar{backdrop-filter:none;-webkit-backdrop-filter:none;background:color-mix(in srgb,var(--theme-surface) 94%,transparent)!important}[data-reduced-motion=true] .mh-island,[data-reduced-motion=true] .mh-tabbar,[data-reduced-motion=true] .mh-screen,[data-reduced-motion=true] .mh-island__expanded-content,[data-reduced-motion=true] .mh-island__close,[data-reduced-motion=true] .mh-tabbar__selection{transition-duration:1ms!important}

.mh-island:active{transform:translate3d(-50%,0,0) scale(.985)}

/* ===== Physics v2: JSが --mh-* を毎フレーム書く。CSSはそれを受けるだけ ===== */
.mh-island.mh-phys{width:var(--mh-w,120px)!important;min-width:0!important;height:var(--mh-h,38px)!important;min-height:0!important;border-radius:var(--mh-r,19px)!important;
 transform:translate3d(-50%,0,0) scale(var(--mh-sc,1))!important;transform-origin:50% 0;
 backdrop-filter:blur(var(--mh-blur,24px)) saturate(1.6) brightness(1.08);-webkit-backdrop-filter:blur(var(--mh-blur,24px)) saturate(1.6) brightness(1.08);
 transition:none!important;will-change:width,height,transform;padding:0 14px!important;display:flex;align-items:center;justify-content:center}
.mh-island.mh-phys:active{transform:translate3d(-50%,0,0) scale(var(--mh-sc,1))!important}
.mh-island.mh-phys[data-mh-expanded=true]{padding:0 14px!important}
.mh-island.mh-phys:before{transform:translate3d(calc(-9% + var(--mh-glint,0)*120%),-6%,0) scale(1.15)!important;transition:none!important}
.mh-island.mh-phys .mh-island-icon,.mh-island.mh-phys .mh-island-label{opacity:var(--mh-li,1)}
.mh-island.mh-phys .mh-island-label{opacity:calc(var(--mh-li,1)*var(--mh-lab,1))!important}
.mh-island.mh-phys[data-mh-expanded=true] .mh-island-label,.mh-island.mh-phys[data-mh-expanded=true] .mh-island-icon{pointer-events:none}
.mh-island.mh-phys .mh-island-icon{opacity:var(--mh-li,1);transition:none}
.mh-island.mh-phys .mh-island__expanded-content{opacity:var(--mh-ci,0)!important;transform:translate3d(0,var(--mh-cy,8px),0)!important;transition:none!important;pointer-events:none}
.mh-island.mh-phys .mh-island__close{opacity:calc(var(--mh-ci,0)*.76)!important;transform:scale(calc(.82 + var(--mh-ci,0)*.18))!important;transition:none!important;pointer-events:none}
.mh-island.mh-phys[data-mh-expanded=true] .mh-island__close{pointer-events:auto}
.mh-island.mh-phys .mh-island__hit{touch-action:none}
/* 画面はJSが transform/opacity/filter を直接書く。CSS transition と静的transformを無効化 */
.mh-screen{transition:none!important;will-change:transform,opacity}
.mh-screen[data-active=true],.mh-screen[data-active=false]{filter:none}
.mh-tabbar__selection{transition:none!important;transform-origin:50% 50%}
.mh-tab{will-change:transform}
::view-transition-old(root),::view-transition-new(root){animation:none!important}
@media (prefers-reduced-motion:reduce){.mh-island,.mh-screen{will-change:auto}}

/* watchdog発動後: 物理層なし。最低限のCSS遷移で動作を維持 */
[data-mh-physics-off=true] .mh-island{transition:width .3s ease,height .3s ease,border-radius .3s ease!important;width:var(--mh-lg-compact-w)!important;height:var(--mh-lg-compact-h)!important;transform:translate3d(-50%,0,0)!important}
[data-mh-physics-off=true] .mh-island[data-mh-expanded=true]{width:var(--mh-lg-expanded-w)!important;height:var(--mh-lg-expanded-h)!important;border-radius:30px!important}
[data-mh-physics-off=true] .mh-screen{transition:opacity .25s ease!important}
[data-mh-physics-off=true] .mh-screen[data-active=false]{opacity:0;visibility:hidden}
[data-mh-physics-off=true] .mh-screen[data-active=true]{opacity:1;visibility:visible}
