:root{--oki-shell-height:76px}
body{padding-top:calc(var(--oki-shell-height) + env(safe-area-inset-top))}
.oki-shell{position:fixed;z-index:1100;inset:0 0 auto;min-height:var(--oki-shell-height);padding-top:env(safe-area-inset-top);border-bottom:1px solid rgba(23,107,168,.14);background:#fffdfa;color:#173a42;box-shadow:0 14px 42px -34px rgba(23,58,66,.58)}
.oki-shell__inner{width:min(1240px,100%);min-height:var(--oki-shell-height);margin:auto;padding:8px max(14px,env(safe-area-inset-right)) 8px max(14px,env(safe-area-inset-left));display:flex;align-items:center;justify-content:space-between;gap:18px}
.oki-shell-home{display:inline-flex;min-width:0;align-items:center;gap:12px;color:inherit;text-decoration:none}
.oki-shell-home__badge{display:block;flex:0 0 auto;width:54px;height:54px}
.oki-shell-home__copy{display:grid;min-width:0;gap:2px}
.oki-shell-home__eyebrow{color:#2d9fa5;font:700 9px/1.1 "Noto Sans TC","PingFang TC",sans-serif;letter-spacing:.18em;text-transform:uppercase}
.oki-shell-home__label{overflow:hidden;color:#173a42;font:700 clamp(14px,2vw,18px)/1.3 "Noto Serif TC","PingFang TC",serif;letter-spacing:.035em;text-overflow:ellipsis;white-space:nowrap}
.oki-shell-home:hover .oki-shell-home__label{color:#176ba8}
.oki-shell-menu{position:relative;flex:0 0 auto}
.oki-shell-menu__button{position:relative;display:grid;width:54px;height:54px;padding:0;place-items:center;border:1px solid rgba(23,107,168,.2);border-radius:50%;background:#fff;color:#173a42;cursor:pointer;box-shadow:0 12px 28px -22px rgba(23,58,66,.52);transition:transform .55s cubic-bezier(.34,1.56,.64,1),border-color .3s cubic-bezier(.16,1,.3,1),background-color .3s ease}
.oki-shell-menu__button:hover{border-color:#2d9fa5;background:#f2fbfa}
.oki-shell-menu__icon,.oki-shell-menu__icon::before,.oki-shell-menu__icon::after{position:absolute;left:50%;width:22px;height:1.5px;background:currentColor;content:"";transform:translateX(-50%);transition:transform .5s cubic-bezier(.16,1,.3,1),top .5s cubic-bezier(.16,1,.3,1)}
.oki-shell-menu__icon{top:50%}.oki-shell-menu__icon::before{top:-7px}.oki-shell-menu__icon::after{top:7px}
.oki-shell-menu.is-open .oki-shell-menu__button{transform:rotate(180deg);border-color:#2d9fa5}
.oki-shell-menu.is-open .oki-shell-menu__icon{background:transparent}
.oki-shell-menu.is-open .oki-shell-menu__icon::before{top:0;transform:translateX(-50%) rotate(45deg)}
.oki-shell-menu.is-open .oki-shell-menu__icon::after{top:0;transform:translateX(-50%) rotate(-45deg)}
.oki-shell-menu__panel{position:absolute;top:calc(100% + 10px);right:0;width:min(340px,calc(100vw - 28px));padding:10px;border:1px solid rgba(23,107,168,.16);border-radius:18px;background:rgba(255,255,255,.98);box-shadow:0 28px 70px -38px rgba(23,58,66,.48);opacity:0;visibility:hidden;pointer-events:none;transform:translate3d(0,-10px,0) scale(.98);transform-origin:top right;transition:opacity .3s cubic-bezier(.16,1,.3,1),transform .3s cubic-bezier(.16,1,.3,1),visibility 0s linear .3s}
.oki-shell-menu.is-open .oki-shell-menu__panel{opacity:1;visibility:visible;pointer-events:auto;transform:none;transition-delay:0s}
.oki-shell-menu__panel a{display:flex;align-items:center;min-height:48px;padding:9px 12px;border-bottom:1px solid rgba(23,107,168,.1);color:#173a42;text-decoration:none;font:500 14px/1.4 "Noto Sans TC","PingFang TC",sans-serif;letter-spacing:.03em}
.oki-shell-menu__panel a:last-child{border-bottom:0}
.oki-shell-menu__panel a:hover,.oki-shell-menu__panel a[aria-current="page"]{border-radius:10px;color:#176ba8;background:#dff3f180}
.oki-shell-menu__meta{margin-left:auto;padding-left:18px;color:#66868b;font-size:10px;letter-spacing:.12em}
.oki-shell-home:focus-visible,.oki-shell-menu__button:focus-visible,.oki-shell-menu__panel a:focus-visible,.oki-intro__skip:focus-visible{outline:3px solid #d9ad55;outline-offset:3px}

.oki-intro{position:fixed;z-index:2400;inset:0;display:grid;place-items:center;overflow:hidden;background:#f7fbfa;color:#173a42;animation:oki-intro-out .42s cubic-bezier(.76,0,.24,1) 2.18s both}
.oki-intro::before,.oki-intro::after{position:absolute;border-radius:50%;content:"";filter:blur(1px)}
.oki-intro::before{width:min(76vw,760px);aspect-ratio:1;left:-24vw;top:-42vw;background:radial-gradient(circle,rgba(93,202,211,.34),rgba(93,202,211,0) 68%);animation:oki-intro-tide 2.3s ease-out both}
.oki-intro::after{width:min(60vw,600px);aspect-ratio:1;right:-20vw;bottom:-34vw;background:radial-gradient(circle,rgba(23,107,168,.24),rgba(23,107,168,0) 70%);animation:oki-intro-tide 2.3s ease-out reverse both}
.oki-intro__center{position:relative;display:grid;justify-items:center;gap:15px}
.oki-intro__badge{width:clamp(112px,22vw,170px);height:auto;animation:oki-intro-spin 2.05s cubic-bezier(.22,.82,.18,1) both;filter:drop-shadow(0 24px 36px rgba(23,107,168,.16))}
.oki-intro__label{margin:0;font:700 12px/1.4 "Noto Sans TC","PingFang TC",sans-serif;letter-spacing:.28em;text-indent:.28em;color:#176ba8;animation:oki-intro-label 1.5s ease .45s both}
.oki-intro__skip{position:absolute;right:max(18px,env(safe-area-inset-right));bottom:max(18px,env(safe-area-inset-bottom));min-height:44px;padding:8px 16px;border:1px solid rgba(23,107,168,.22);border-radius:999px;background:rgba(255,255,255,.86);color:#173a42;font:600 13px/1 "Noto Sans TC","PingFang TC",sans-serif;cursor:pointer}
.oki-intro-active{overflow:hidden!important}
@keyframes oki-intro-spin{0%{opacity:0;transform:rotate(-150deg) scale(.62)}38%{opacity:1}72%{transform:rotate(18deg) scale(1.06)}100%{opacity:1;transform:rotate(0) scale(1)}}
@keyframes oki-intro-label{0%{opacity:0;transform:translateY(10px)}100%{opacity:1;transform:none}}
@keyframes oki-intro-tide{0%{opacity:0;transform:scale(.68)}100%{opacity:1;transform:scale(1)}}
@keyframes oki-intro-out{to{opacity:0;visibility:hidden;transform:scale(1.025)}}

@media(max-width:640px){:root{--oki-shell-height:68px}.oki-shell__inner{gap:10px;padding-block:7px}.oki-shell-home{gap:9px}.oki-shell-home__badge{width:48px;height:48px}.oki-shell-home__eyebrow{display:none}.oki-shell-home__label{max-width:calc(100vw - 138px);font-size:14px}.oki-shell-menu__button{width:50px;height:50px}}
@media(prefers-reduced-motion:reduce){.oki-shell-menu__button,.oki-shell-menu__icon,.oki-shell-menu__icon::before,.oki-shell-menu__icon::after,.oki-shell-menu__panel{transition:none!important}.oki-intro{display:none!important}}
