/* Xbox 360 Design Style Guide, Nov 2007: pages 12, 18–24, 26–35, 51, 60, 72, 89. */
@font-face{font-family:Convection;src:url('./fonts/convection.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:Convection;src:url('./fonts/convection-bold.ttf') format('truetype');font-style:normal;font-weight:700;font-display:swap}
@font-face{font-family:'Convection UI';src:url('./fonts/convectionui.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
:root{font-family:Convection,'Segoe UI','Trebuchet MS',Arial,sans-serif;--dash-text:rgb(15 15 15 / 90%);--dash-text-highlight:0 1px rgb(235 235 235 / 35%)}
.brand-text,.profile-trigger,.library-heading,.project-intro h2,.gamer-card h2,.profile-content h2,.profile-content h3,.viewer-top h2,.case-label strong,.library-switch button{font-family:'Convection UI',Convection,'Segoe UI',Arial,sans-serif;font-weight:400}
.library-heading h1,.project-intro h2,.brand-text,.profile-content h2{color:var(--dash-text);text-shadow:var(--dash-text-highlight)}
.brand-text strong{font-weight:400}
.display{--section-glow:#acd47d;--section-ink:#3b5c22;--section-wash:#e3e9dbf5;--section-tile:#d0dac4}
.display[data-section=astros]{--section-glow:#7faed1;--section-ink:#2e536f;--section-wash:#dfe8edf5;--section-tile:#cedde5;--console-selection:linear-gradient(#477993,#315872)}
.display[data-section=astros] .wallpaper{background:radial-gradient(ellipse at 66% 34%,#f3f8fa 0,#e4eaee 32%,#b7c8d2 78%,#9bb3c2 100%)}
.display[data-section=astros] .wallpaper:before{background:radial-gradient(ellipse at 48% 93%,#a8cce399,#f0f6fae0 53%,#fff7)}
.display[data-section=astros] .wallpaper:after{background:linear-gradient(180deg,#b8d3e29c,#becfd900)}
.display[data-section=profile] .wallpaper{background:radial-gradient(ellipse at 66% 34%,#f3f4ef 0,#e3e6df 40%,#abb4a5 100%)}
.display[data-section=profile] .wallpaper:before{background:radial-gradient(ellipse at 48% 93%,#d9dfd499,#f3f5efe0 53%,#fff7)}
.blade-button[aria-current=true]{filter:drop-shadow(2px 0 4px #3b4e3838)}
.blade-button[aria-current=true] span{background:linear-gradient(90deg,color-mix(in srgb,var(--section-glow) 70%,transparent),#f2f7eb);color:var(--section-ink);box-shadow:inset 1px 0 #fff9,1px 0 5px #354b241a}
.project-toolbar,.gallery-filters{background:var(--section-wash)}
.work-media,.work-media.is-cutout{background:var(--section-tile)}
.gallery-filters button{background:linear-gradient(#f6f8f3 0%,#e6eae1 49%,#d0d8c8 50%,#e7ece0 100%);border-color:#9aa791;box-shadow:inset 0 1px #fff,0 1px 2px #394a2920;color:#35472b}
.gallery-filters button[aria-pressed=true]{background:linear-gradient(#f4f9eefa 0%,#e5efdb 45%,#ccdfb5 49%,#eef8e1 100%);color:var(--section-ink);border-color:#799966;box-shadow:inset 0 1px #fff,0 0 0 1px #bed99d,0 2px 4px #3b522b25}
.display[data-section=astros] .gallery-filters button[aria-pressed=true]{background:linear-gradient(#f2f8fc,#d5e7f0 49%,#b3d0e1 50%,#ecf7fc);border-color:#60849e;box-shadow:inset 0 1px #fff,0 0 0 1px #a7c9dd,0 2px 4px #2a465d25}
.work-item .work-media{border:1px solid #8e9e814d;box-shadow:inset 0 1px #ffffff78;transition:transform 180ms var(--ease),box-shadow 180ms var(--ease)}
@media(hover:hover) and (pointer:fine){.work-item:hover .work-media{transform:translateY(-2px);box-shadow:inset 0 1px #fff,0 4px 7px #2d43252e,0 0 0 1px #f5faed}}
.work-item:focus-visible .work-media,.keyboard-navigation .work-item:focus .work-media{box-shadow:inset 0 1px #fff,0 0 0 2px #effbd9,0 0 0 4px #73934d,0 5px 8px #28381d30}
.avatar{position:relative;overflow:hidden}.avatar:after{content:'';position:absolute;inset:0 0 48%;background:linear-gradient(#fff4,#fff0);border-radius:2px;pointer-events:none}
.console-toast{background:linear-gradient(#535853,#252a25);border-color:#8b9487}
.toast-orb,.toast-orb.gamer-toast{position:relative;overflow:visible;border-radius:50%;padding:7px;border:0;box-shadow:inset 0 0 0 1px #a7b39f;background:radial-gradient(circle at 35% 25%,#e1e7d9,#819375);color:#effbd9}
.toast-orb:before{content:'';position:absolute;inset:2px;border-radius:50%;background:conic-gradient(from -90deg,#b0dc35 0deg 83deg,transparent 83deg 97deg,#5f7457 97deg 173deg,transparent 173deg 187deg,#5f7457 187deg 263deg,transparent 263deg 277deg,#5f7457 277deg 353deg,transparent 353deg);mask:radial-gradient(transparent 54%,#000 57%);pointer-events:none}
.toast-orb img{width:100%;height:100%;border-radius:50%;object-fit:cover}
.viewer-image{position:relative}.artwork-loader{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:12px;font-size:15px;color:#52634a;pointer-events:none;opacity:0;animation:loader-reveal 180ms ease 160ms forwards}
.artwork-loader svg{width:32px;height:32px;fill:none;stroke:#7f936e;stroke-width:4;stroke-dasharray:1 8.425;stroke-linecap:round;animation:loader-turn 1.4s linear infinite}.artwork-loader .loader-light{stroke:#fff;stroke-dasharray:1 75;filter:drop-shadow(0 0 2px #819969)}
.artwork-error{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:#465a39}.artwork-error button{padding:10px 18px;border:1px solid #7c9265;border-radius:4px;background:linear-gradient(#f6f8ee,#dae5cc)}
@keyframes loader-turn{to{transform:rotate(360deg)}}@keyframes loader-reveal{to{opacity:1}}
.motion-off .artwork-loader{animation:none;opacity:1}.motion-off .artwork-loader svg{animation:none}.motion-off .work-item .work-media{transition:none}
@media(prefers-reduced-motion:reduce){.artwork-loader{animation:none;opacity:1}.artwork-loader svg{animation:none}.work-item .work-media{transition:none}}