.personal-links{display:flex;flex-wrap:wrap;gap:16px;align-items:center;margin-top:20px}.personal-links a{color:#236c7b;font-weight:700}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
button:focus-visible,a:focus-visible{outline:3px solid #145b75;outline-offset:4px}
dialog.modal{border:0;width:100%;max-width:100%;height:100%;max-height:100%;margin:0}dialog.modal:not([open]){display:none}dialog.modal::backdrop{background:#183e4c66}
.paused *, .paused *::before,.paused *::after{animation-play-state:paused!important}
.paused .st[data-id]::after{content:'動畫已暫停・按「播放動畫」開始預覽';position:absolute;inset:0;display:grid;place-items:center;padding:20px;text-align:center;font:14px/1.7 system-ui;background:#f1fafb;color:#236c7b}
@media(max-width:600px){h1{font-size:clamp(28px,8vw,40px)}h1 b{white-space:nowrap}}
.grid{grid-template-columns:repeat(auto-fill,minmax(min(300px,100%),1fr))}.st{touch-action:pan-y}.tabs button,.btn,.subs button{min-height:44px;font-family:system-ui,sans-serif}.tools input[type=search]{font-family:system-ui,sans-serif;min-width:0;width:100%}.sec{flex-wrap:wrap}.mbox h2{overflow-wrap:anywhere}
@media(max-width:600px){.wrap{padding-left:18px;padding-right:18px}.hero{padding-top:40px}.tabs{gap:8px}.tabs button{padding:10px 14px;font-size:16px}.tools{align-items:stretch}.tools input[type=search]{flex-basis:100%}.mbox{padding:52px 16px 20px}.modal{padding:10px}.mbox h2{font-size:23px}.hero .note{font-size:14px}.sub span{display:block;margin-left:0}.grid{gap:18px}.sec{font-size:24px}}
@media(hover:hover) and (pointer:fine){.card:hover{transform:translateY(-4px)}}
@media(hover:none){.card:hover{transform:none}}
@media(prefers-reduced-motion:reduce){.blob{animation:none}.card,.btn,.tabs button{transition:none}}