/* One shared ornament system: shortcut texture and frame are exactly 75% of Online Players. */
.hero .hero-orb-hub{--orb-center-width:min(187.2px,22.5cqw);--orb-height:min(264.1px,31.742cqw);--online-size:min(224.64px,27cqw);--shortcut-scale:.75;--side-position:calc(50% - var(--orb-center-width) * .95);position:absolute;left:50%;top:100%;width:100%;height:var(--orb-height);transform:translate(-50%,-50%);z-index:3;isolation:isolate;pointer-events:none}
.orb-frame-piece{position:absolute;top:50%;overflow:hidden;pointer-events:none}
.orb-frame-center{left:50%;width:calc(var(--orb-center-width) * 4 / 3);height:100%;transform:translate(-50%,-50%);z-index:4}
.hero-orb-hub .orb-action-frame{position:absolute;top:0;left:-75%;display:block;width:250%;height:100%;max-width:none;object-fit:fill;mask-image:url('../assets/silver-ice-orb-action-frame-black-v2.png');mask-mode:luminance;mask-size:100% 100%;mask-repeat:no-repeat;pointer-events:none;user-select:none}
.hero .hero-orb-hub .harbor-online-stack{left:50%;top:50%;width:var(--online-size);height:auto;aspect-ratio:1;transform:translate(-50%,-50%);z-index:2}
.hero .hero-orb-hub .orb-action{position:absolute;top:50%;width:calc(var(--online-size) * var(--shortcut-scale));height:calc(var(--online-size) * var(--shortcut-scale));min-height:0;padding:0;display:grid;place-items:center;box-sizing:border-box;border:0;border-radius:50%;background:none;color:#edf9ff;text-decoration:none;pointer-events:auto;z-index:3;isolation:isolate;transition:filter .18s ease}
.hero-orb-hub .orb-action-register{left:var(--side-position);transform:translate(-50%,-50%)}
.hero-orb-hub .orb-action-download{right:var(--side-position);transform:translate(50%,-50%)}
.shortcut-orb-art{position:absolute;inset:0;opacity:.9;pointer-events:none;z-index:0}
.hero-orb-hub .shortcut-orb-texture{position:absolute;inset:0;display:block;width:100%;height:100%;max-width:none;object-fit:contain;mix-blend-mode:screen;mask-image:radial-gradient(circle closest-side,#000 70%,transparent 73%)}
.shortcut-orb-frame{position:absolute;left:50%;top:50%;width:calc(var(--orb-center-width) * 4 / 3 * var(--shortcut-scale));height:calc(var(--orb-height) * var(--shortcut-scale));transform:translate(-50%,-50%);overflow:hidden;z-index:2}
.shortcut-orb-well{position:absolute;left:26.75%;top:26.75%;width:46.5%;height:46.5%;border-radius:50%;background:rgba(14,20,29,.82);border:1px solid #d7a04a55;box-shadow:inset 0 0 18px #05081180;z-index:1}
.shortcut-orb-label{position:relative;z-index:3;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;width:80%;font:600 clamp(12px,1.4cqw,16px)/1.2 Georgia,'Times New Roman',serif;text-align:center;text-shadow:0 2px 4px #020915,0 0 8px #020915}
.shortcut-orb-label i{font-size:1.05em;color:#b7e5ff;filter:drop-shadow(0 0 5px #6abaff99)}
.hero .hero-orb-hub .orb-action:hover{filter:brightness(1.15) drop-shadow(0 0 6px #8dd8ff)}
.hero .hero-orb-hub .orb-action:focus-visible{outline:2px solid #e3f7ff;outline-offset:4px}
.hero .hero-orb-hub .orb-action:active{filter:brightness(1.25)}
/* Adjacent ice frames overlap directly around the center orb. */
.wrap>.hero+.main{padding-top:calc(max(min(132.05px,15.871cqw),70px) + 12px)}
@media(max-width:720px){.hero .hero-orb-hub{--orb-center-width:22.96875cqw;--orb-height:32.4cqw;--online-size:30.625cqw}.hero-orb-hub .harbor-online-bubble{width:60%;height:60%;left:20%;top:20%}.shortcut-orb-well{width:60%;height:60%;left:20%;top:20%}.shortcut-orb-label{font-size:12px;gap:3px}.shortcut-orb-label i{font-size:12px}.wrap>.hero+.main{padding-top:calc(max(16.2cqw,70px) + 12px)}}
@media(prefers-reduced-motion:reduce){.hero .hero-orb-hub .orb-action{transition:none}}
/* Polished single silver button with a restrained, static highlight. */
.wrap>.navigation-strip .navigation-account{position:relative;isolation:isolate;overflow:hidden;border:1px solid #dce8f1;border-radius:3px;background:linear-gradient(180deg,#f4f7fa 0%,#d2dce5 46%,#aebdca 52%,#dce5ed 100%);color:#20394e;box-shadow:inset 0 1px 0 #fff,inset 0 -1px 0 #8397a9,0 1px 5px #06132140;text-shadow:0 1px 0 #ffffffb3;cursor:pointer;transition:filter .18s ease,box-shadow .18s ease}
.wrap>.navigation-strip .navigation-account::before{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 25%,#ffffff66 45%,#ffffff12 58%,transparent 72%);opacity:.65;z-index:-1}
.wrap>.navigation-strip .navigation-account i{color:#38566e}
.wrap>.navigation-strip .navigation-account:hover,.wrap>.navigation-strip .navigation-account[aria-expanded="true"]{filter:brightness(1.06);color:#122d43;border-color:#f0f8ff;box-shadow:inset 0 1px 0 #fff,inset 0 -1px 0 #8397a9,0 0 8px #c2e8ff55}
.wrap>.navigation-strip .navigation-account:focus-visible{outline:2px solid #163e5d;outline-offset:-4px}
@media(prefers-reduced-motion:reduce){.wrap>.navigation-strip .navigation-account{transition:none}}

/* User Panel: 20% larger than each existing navigation type size. */
.wrap>.navigation-strip .navigation-account{font-size:16.8px;font-weight:700;line-height:1.1;padding:3px 5px;gap:6px;white-space:normal}
.wrap>.navigation-strip .navigation-account>span{min-width:0}
.wrap>.navigation-strip .navigation-account i{display:inline-block;flex-shrink:0;font-size:1em}
@media(max-width:800px){.wrap>.navigation-strip .navigation-account{font-size:14.4px}}
@media(max-width:720px){.wrap>.navigation-strip .navigation-account{font-size:15.6px}}
