/* A quiet pearl wordmark. The period remains the portal's screen-space origin. */
.boot-screen{display:block;transition:none;transform:none;opacity:1;--portal-radius:0px;--portal-accent:#8ac6ba;background:radial-gradient(ellipse at 50% 44%,#608d8026,transparent 42%),radial-gradient(ellipse at 70% 20%,#9d7c9720,transparent 55%),linear-gradient(145deg,#101e1c,#060c0d 72%)}
.boot-screen::before{inset:0;border:0;background:none;opacity:0}
.boot-screen.is-opening{pointer-events:none;mask-image:radial-gradient(circle at var(--portal-center-x,50%) var(--portal-center-y,50%),transparent calc(var(--portal-radius) + 1px),#000 calc(var(--portal-radius) + 2px));-webkit-mask-image:radial-gradient(circle at var(--portal-center-x,50%) var(--portal-center-y,50%),transparent calc(var(--portal-radius) + 1px),#000 calc(var(--portal-radius) + 2px))}
.boot-mark{position:absolute;left:50%;top:50%;width:max-content;height:1em;display:flex;flex-direction:row;align-items:center;gap:.091em;transform:translate(-50%,-.875em);text-align:initial;z-index:2;font-size:clamp(64px,8.8vw,118px);--portal-dot-size:.078em}
.boot-mark .boot-word{position:static;display:flex;align-items:center;height:1em;font:var(--brand-weight) 1em/1 var(--brand-font);letter-spacing:var(--brand-tracking);text-shadow:none;pointer-events:none}
.boot-mark .boot-letter{display:inline-block;margin:0;padding:0;font:inherit;color:inherit;letter-spacing:inherit;line-height:inherit;cursor:grab;touch-action:none;user-select:none;pointer-events:auto;translate:var(--glyph-drag-x,0px) var(--glyph-drag-y,0px);background:var(--brand-pearl);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 1px 0 #ffffff18) drop-shadow(0 8px 18px #0003)}
.boot-mark .boot-letter:active,.boot-mark .boot-letter.is-dragging{cursor:grabbing}
.boot-mark .boot-word-right>.boot-letter:last-child{padding-right:.12em;margin-right:-.12em}
.boot-mark .boot-word-right{color:var(--portal-accent);column-gap:0}
.boot-mark .boot-word-right .boot-letter{background-image:var(--brand-mint)}
.portal-dot{position:relative;flex:none;transform:translateY(.375em);display:grid;place-items:center;width:var(--portal-dot-size);height:44px;padding:0;border:0;background:none;border-radius:50%;font:inherit;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.portal-dot::before{content:"";position:absolute;left:50%;top:50%;width:44px;height:44px;transform:translate(-50%,-50%);border-radius:50%}
.portal-dot span{display:block;width:var(--portal-dot-size);height:var(--portal-dot-size);padding:0;font:inherit;letter-spacing:0;border-radius:50%;background:radial-gradient(circle at 32% 22%,#fffdf7 8%,#ede4eb 42%,#90b5aa 100%);box-shadow:0 1px 1px #ffffff44 inset,0 0 18px #c6e6d52b;transition:box-shadow .25s,transform .25s}
.boot-mark .boot-i{position:relative;pointer-events:auto;cursor:grab}
.boot-mark .boot-i-glyph{display:inline;padding:0;font:inherit;color:inherit;letter-spacing:inherit}
.boot-i-dot{position:absolute;z-index:2;left:50%;top:.15em;display:block;width:.23em;height:.23em;min-width:20px;min-height:20px;padding:0;font:inherit;letter-spacing:0;border:0;border-radius:50%;background:transparent;transform:translateX(-50%);cursor:pointer;-webkit-tap-highlight-color:transparent}
.boot-i-dot:hover,.boot-i-dot:focus-visible{outline:none;box-shadow:0 0 0 2px #c8e5da99,0 0 18px #c8e5da44}
.portal-dot:hover span,.portal-dot:focus-visible span{transform:scale(1.18);box-shadow:0 0 0 8px #c9e3dd0b,0 0 24px #bededb77}
.portal-dot:focus-visible{outline:1px solid #c4e4d899;outline-offset:0}
.portal-dot:active span{transform:scale(.9)}
.boot-screen.is-opening .portal-dot{opacity:0}
.boot-screen>#portal-help{position:absolute;margin:-1px;letter-spacing:normal}
.boot-signal{position:absolute;z-index:0;left:0;top:calc(50% + clamp(80px,12vh,106px) - 60px);width:100%;height:120px;overflow:visible;pointer-events:none;opacity:.42;filter:drop-shadow(0 0 9px #8fc6ba40)}
.boot-signal-front{z-index:2}
.boot-signal .signal-rear-hidden{visibility:hidden}
.boot-screen .boot-mark{z-index:3}
.boot-era-scene{position:absolute;inset:0;z-index:1;width:100%;height:100%;overflow:visible;pointer-events:none;user-select:none;mask-image:linear-gradient(90deg,#000 0%,#000 28%,#0003 46%,#0003 54%,#000 72%,#000 100%);-webkit-mask-image:linear-gradient(90deg,#000 0%,#000 28%,#0003 46%,#0003 54%,#000 72%,#000 100%)}
.boot-era-scene image,.boot-era-scene .era-artwork{opacity:.42}
.boot-signal path{fill:var(--portal-accent);stroke:var(--portal-accent);stroke-width:.4;vector-effect:non-scaling-stroke;opacity:.12}
.boot-signal path:nth-child(2n){opacity:.18}
.boot-signal path:nth-child(3n){opacity:.07;stroke-width:.6}
.boot-signal path:nth-child(5){opacity:.3}
.portal-letter-layer{position:fixed;inset:0;z-index:41;pointer-events:none;overflow:hidden;contain:layout paint;mask-image:radial-gradient(circle at var(--portal-center-x,50%) var(--portal-center-y,50%),transparent calc(var(--portal-radius) + 2px),#000 calc(var(--portal-radius) + 3px));-webkit-mask-image:radial-gradient(circle at var(--portal-center-x,50%) var(--portal-center-y,50%),transparent calc(var(--portal-radius) + 2px),#000 calc(var(--portal-radius) + 3px))}
.portal-letter-piece{position:absolute;left:0;top:0;display:block;white-space:pre;line-height:1;transform-origin:50% 50%;will-change:transform}
.portal-letter-piece[hidden]{display:none}
.portal-art-layer{clip-path:url(#era-ribbon-clip)}
.portal-art-piece{overflow:visible;pointer-events:none}
.game-shell.is-previewing{visibility:visible;opacity:1;transition:none;transform:scale(var(--menu-scale,.965));transform-origin:50% 50%}
.game-shell.is-active{transition:none}

/* One clear focus treatment and generous Wii-style touch targets throughout. */
.city-dialog{animation:menu-glass-in .2s ease-out}
@keyframes menu-glass-in{from{opacity:.4}to{opacity:1}}
:where(button,a,input,select,textarea):focus-visible{outline:2px solid #d0eabb;outline-offset:4px}
.city-dialog-head>button{min-width:44px;min-height:44px;flex-shrink:0}
.city-dialog .city-button,.profile-tabs button,.playlist-choice,.emblem-actions button,.layer-actions button{min-height:44px}
.city-dialog select,.city-dialog input[type=text],.city-dialog input[type=number]{min-height:44px}
.profile-tabs{flex-wrap:wrap;row-gap:8px}
#account-settings-form{display:grid;gap:22px}
#account-settings-form .city-button{justify-self:end;min-width:130px}
#account-settings-form input{min-height:44px}
#clan-format{font-size:11px;color:#9ab097;font-weight:400}
#settings-feedback{min-height:20px;line-height:1.8}
#edit-user-settings{margin:24px 0}
.channel-stage,.city-dialog{scrollbar-width:thin;scrollbar-color:#829b76 #0c1c12;overscroll-behavior:contain;scroll-padding:18px}
#clock .clock-digit,#clock .clock-colon{display:block}
#calendar-date{max-width:calc(100vw - 210px);font-size:clamp(12px,1.65vw,22px);white-space:normal;text-wrap:balance;text-align:center;line-height:1.4}
.keyboard-navigation .wii-pointer{visibility:hidden}
.gamepad-navigation .wii-pointer{visibility:hidden}
.gamepad-navigation :where(button,select,input,a,[tabindex="0"]):focus{outline:2px solid #d0eabb;outline-offset:4px}
.wii-pointer.pointer-idle{visibility:hidden}
.city-dialog .tap-arrow{min-width:44px;min-height:64px}
@media(max-width:460px){.boot-mark{font-size:clamp(54px,15vw,68px)}.boot-signal{height:100px;top:calc(50% + clamp(80px,12vh,106px) - 50px)}#calendar-date{max-width:calc(100vw - 150px);font-size:11px}.city-dialog{max-height:94svh}.city-dialog-head{padding:16px}.city-dialog-body{padding:20px}.profile-tabs{padding-inline:16px}.custom-tabs{column-gap:0}.custom-tabs button{padding-inline:12px}}
@media(prefers-reduced-motion:reduce){.boot-signal{filter:none}.portal-dot span{transition:none}.game-shell.is-previewing{transform:none}}

/* The eye in COD.CiTY is a tiny detour into the deliberately over-serious archive. */
.classified-dialog{width:min(780px,94vw);max-height:92svh;border-radius:16px;background:#07130c;border-color:#718e79;overflow:auto}
.classified-dialog::backdrop{background:#020704d9;backdrop-filter:blur(7px) saturate(.75)}
.classified-screen{position:relative;overflow:hidden;background:radial-gradient(ellipse at 50% 0,#22442c 0,#0a1a10 45%,#050c08 100%);color:#dcead6}
.classified-screen::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:repeating-linear-gradient(0deg,#c5ead00a 0 1px,transparent 1px 4px),linear-gradient(105deg,transparent 42%,#b5e6bf0c 50%,transparent 58%);mix-blend-mode:screen}
.classified-screen>*{position:relative;z-index:1}
.classified-screen .city-dialog-head{background:#0a1b10cc;border-bottom-color:#82ad8b66}
.classified-screen .city-dialog-head h1{font-family:"Impact","Arial Narrow","Condensed",sans-serif;letter-spacing:.045em;text-transform:none}
.classified-bezel{margin:0 26px 22px;padding:14px;border:1px solid #86a98b88;border-radius:8px;background:#030b06;box-shadow:inset 0 0 0 3px #0f2617,inset 0 0 34px #000,0 0 18px #081f1077}
.classified-marquee{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:7px 10px;border-bottom:1px solid #6f947566;color:#8eaf8c;font-size:10px;letter-spacing:.14em}
.classified-marquee strong{color:#d6e9c8;font:normal 18px/1 "Impact","Arial Narrow",sans-serif;letter-spacing:.08em;white-space:nowrap}
.classified-terminal{min-height:126px;padding:20px 12px 7px;color:#b4ceb1;font-size:12px;line-height:1.9;letter-spacing:.04em}
.classified-terminal p{margin:0 0 8px}
.classified-status{color:#dcebd4;text-transform:uppercase}
.classified-status span{color:#e4ad74}
.classified-about{max-width:660px;color:#d0dfc9;line-height:2.05}
.classified-about .classified-redaction{vertical-align:baseline;white-space:normal}
.classified-redaction-wide{max-width:100%}
.classified-prompt{margin-top:25px!important;color:#79967c;font-size:10px;letter-spacing:.13em}
.classified-prompt kbd{padding:3px 6px;border:1px solid #7d9a7a99;border-radius:3px;background:#1c3421;color:#d6ebcf;font:inherit}
.classified-legal{padding:20px 26px 26px;border-top:1px solid #83aa8a66;background:linear-gradient(#0c2114aa,#07120b)}
.classified-legal h2{margin:0 0 10px;color:#cfe5c8;font:normal 19px/1 "Impact","Arial Narrow",sans-serif;letter-spacing:.1em}
.classified-legal>.subtle{max-width:650px;margin:0 0 20px;color:#91ad91;font-size:11px;line-height:1.75}
.classified-docket{display:grid;grid-template-columns:1fr 1fr;gap:8px 22px;margin:0 0 21px}
.classified-docket>div{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 0;border-bottom:1px solid #6e917255}
.classified-docket dt{color:#759577;font-size:9px;letter-spacing:.13em}
.classified-docket dd{margin:0}
.classified-redaction{display:inline-block;min-width:88px;padding:2px 7px;color:#101612;background:#0b120d;border:1px solid #223326;box-shadow:2px 2px 0 #b7c0b055;font-size:11px;line-height:1;letter-spacing:.08em;text-align:center;user-select:none}
.classified-legal .fine-print{margin:0;color:#718a72;font-size:9px;line-height:1.75;letter-spacing:.02em}
@media(max-width:560px){.classified-bezel{margin-inline:16px}.classified-legal{padding-inline:18px}.classified-docket{grid-template-columns:1fr}.classified-marquee{align-items:flex-start;flex-direction:column;gap:8px}}