/* Theme control: six lit faces and recessed pips on each solid CSS die. */
[hidden] { display: none !important; }
/* Logos belong to the project introduction in the original theme. */
#portfolio-view .project-logo-badge,
#portfolio-view .minor-logo-badge { position: static; background: none; border: 0; border-radius: 0; box-shadow: none; backdrop-filter: none; flex-shrink: 0; }
#portfolio-view .project-logo-badge { width: 76px; height: 76px; margin: 0 0 16px; }
#portfolio-view .project-logo-badge img { width: 76px; height: 76px; }
#portfolio-view .project-logo-badge + h3 { margin-top: 14px; }
#portfolio-view .minor-project-heading { display: flex; align-items: center; gap: 14px; margin: 23px 0 15px; }
#portfolio-view .minor-logo-badge,
#portfolio-view .minor-logo-badge img { width: 52px; height: 52px; }
#portfolio-view .minor-project-heading h3 { margin: 0; }
.app-icon.app-bridge, .app-icon.app-productdeck, .app-icon.app-coincil { border: 0; background: transparent; box-shadow: 0 9px 18px #0004; }
.app-icon.app-bridge::after, .app-icon.app-productdeck::after, .app-icon.app-coincil::after { display: none; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.topbar { padding-right: 100px; }
.theme-dice { position: fixed; top: 58px; right: 20px; width: 92px; height: 72px; padding: 0; border: 0; border-radius: 20px; background: transparent; cursor: pointer; z-index: 20; -webkit-tap-highlight-color: transparent; touch-action: manipulation; }
.theme-dice:focus-visible { outline: 2px solid #fff; outline-offset: 5px; background: #ffffff18; }
.dice-pair { display: block; position: absolute; inset: 0; perspective: 480px; filter: drop-shadow(0 12px 6px #07142855); }
.dice-strings { position: absolute; top: -140px; left: 0; width: 92px; height: 212px; overflow: visible; pointer-events: none; }
.cord-shadow { stroke: #28241dcc; stroke-width: 2.8; }
.cord-thread { stroke: #d7cdb9; stroke-width: 1.3; stroke-linecap: round; }
.die { --size: 33px; position: absolute; width: var(--size); height: var(--size); transform-style: preserve-3d; transition: transform .35s cubic-bezier(.2,.8,.2,1); }
.die-one { top: 13px; left: 13px; transform: rotateX(-24deg) rotateY(-33deg) rotateZ(-15deg); }
.die-two { top: 30px; left: 48px; transform: rotateX(-28deg) rotateY(34deg) rotateZ(16deg); }
.die-face { position: absolute; inset: 0; display: grid; grid-template: repeat(3, 1fr) / repeat(3, 1fr); gap: 3px; padding: 6px; border: 1px solid #e9e5df; border-radius: 5px; background: linear-gradient(145deg, #fff 8%, #f8f6f2 58%, #d3cec6); box-shadow: inset 1px 1px 2px #fff, inset -1px -1px 2px #b5afa5; backface-visibility: hidden; }
.die-face.front { transform: translateZ(calc(var(--size) / 2)); }
.die-face.back { transform: rotateY(180deg) translateZ(calc(var(--size) / 2)); }
.die-face.right { transform: rotateY(90deg) translateZ(calc(var(--size) / 2)); background: linear-gradient(135deg, #e8e5df, #b6b2aa); }
.die-face.left { transform: rotateY(-90deg) translateZ(calc(var(--size) / 2)); background: linear-gradient(150deg, #eeeae4, #c8c2b7); }
.die-face.top { transform: rotateX(90deg) translateZ(calc(var(--size) / 2)); background: linear-gradient(135deg, #fff, #f4f2ed); }
.die-face.bottom { transform: rotateX(-90deg) translateZ(calc(var(--size) / 2)); }
.die-pip { border-radius: 50%; background: #272829; box-shadow: inset 1px 1px 2px #000, 0 1px 0 #fff; }
.die-two .die-pip { background: #29499b; box-shadow: inset 1px 1px 2px #07143a, 0 1px 0 #fff; }
.dice-hint { position: absolute; right: 0; top: 80px; width: max-content; padding: 7px 10px; background: #151a24e8; border: 1px solid #ffffff25; border-radius: 6px; color: #fff; font: 400 10px 'DM Mono', monospace; opacity: 0; transform: translateY(-4px); transition: .2s; pointer-events: none; }
.theme-dice:hover .dice-hint, .theme-dice:focus-visible .dice-hint { opacity: 1; transform: none; }
.theme-dice:hover .die-one { transform: translateY(-3px) rotateX(-30deg) rotateY(-38deg) rotateZ(-19deg); }
.theme-dice:hover .die-two { transform: translateY(-2px) rotateX(-24deg) rotateY(40deg) rotateZ(20deg); }
.theme-dice.is-rolling .dice-pair { animation: dice-drop .7s both; }
.theme-dice.is-rolling .die-one { animation: die-wobble-one .7s both; }
.theme-dice.is-rolling .die-two { animation: die-wobble-two .7s both; }
@keyframes dice-drop { 0%,100% { transform: translateY(0); } 30% { transform: translateY(17px); } 52% { transform: translateY(5px); } 73% { transform: translateY(11px); } 88% { transform: translateY(-2px); } }
@keyframes die-wobble-one { 0%,100% { transform: rotateX(-24deg) rotateY(-33deg) rotateZ(-15deg); } 30% { transform: rotateX(-49deg) rotateY(-9deg) rotateZ(13deg); } 55% { transform: rotateX(-13deg) rotateY(-47deg) rotateZ(-28deg); } 78% { transform: rotateX(-29deg) rotateY(-27deg) rotateZ(-9deg); } }
@keyframes die-wobble-two { 0%,100% { transform: rotateX(-28deg) rotateY(34deg) rotateZ(16deg); } 35% { transform: rotateX(-9deg) rotateY(58deg) rotateZ(-12deg); } 60% { transform: rotateX(-44deg) rotateY(21deg) rotateZ(30deg); } 82% { transform: rotateX(-24deg) rotateY(39deg) rotateZ(10deg); } }

/* The desktop is a second presentation of the original portfolio content. */
body[data-theme="desktop"] { background: #090f1c; }
.desktop { position: relative; isolation: isolate; height: 100svh; min-height: 700px; overflow: hidden; color: #f4f6fb; font-family: Inter, system-ui, sans-serif; }
.desktop-wallpaper { position: absolute; inset: 0; z-index: -2; background: #070b12; overflow: hidden; }
.desktop-wallpaper::before { content: ''; position: absolute; inset: -30%; background: linear-gradient(125deg, transparent 18%, #7598b47a 24%, #d6d5b99e 26%, #294b7540 30%, transparent 34%), linear-gradient(125deg, transparent 36%, #16419c 42%, #a0bbd7d9 47%, #41688e 50%, #051025 56%, transparent 60%), linear-gradient(123deg, transparent 62%, #356098ba 68%, #a8b8cacc 73%, #d8d9c7 77%, #485f72 82%); filter: blur(27px); transform: rotate(-5deg); }
.desktop-wallpaper::after { content: ''; position: absolute; inset: 0; background: repeating-linear-gradient(90deg, #070e1900 0px, #030c2330 4px, #d6eaff0a 6px, #a9c6e216 8px, #040a1540 13px, transparent 17px), url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23ffffff' opacity='.035' filter='url(%23n)' d='M0 0h180v180H0z'/%3E%3C/svg%3E"); box-shadow: inset 0 0 160px #02081350; }
.desktop-menubar { height: 43px; display: flex; align-items: center; gap: 24px; padding: 0 22px; background: #0a0d1470; border-bottom: 1px solid #ffffff18; backdrop-filter: blur(24px); font-size: 12px; }
.desktop-owner { display: flex; align-items: center; gap: 10px; color: inherit; background: transparent; border: 0; padding: 7px 0; font-size: 13px; cursor: pointer; }
.desktop-mark { font-size: 22px; }.desktop-menu-note { color: #c6cbd4; font-size: 11px; }
.desktop-menu-socials { display: flex; align-items: center; gap: 14px; margin-left: auto; }.desktop-menu-socials a { padding: 3px; }.desktop-menu-socials img { width: 14px; height: 14px; filter: invert(1); }

.desktop-intro { position: absolute; left: 37%; top: 19%; pointer-events: none; text-shadow: 0 2px 30px #0003; }.desktop-intro>span { font: 400 9px 'DM Mono', monospace; letter-spacing: .15em; color: #c8d4e4; }.desktop-intro p { font-size: clamp(40px, 4.7vw, 70px); line-height: 1.06; font-weight: 500; letter-spacing: -.065em; margin: 20px 0; }.desktop-intro em { font-family: Georgia, serif; font-weight: 400; }
.desktop-icons { position: absolute; inset: 64px 28px 138px; }
.desktop-shortcut { position: absolute; width: 116px; min-height: 110px; display: flex; flex-direction: column; align-items: center; justify-content: flex-start; gap: 10px; padding: 9px 5px; border: 1px solid transparent; border-radius: 12px; background: transparent; color: #fff; font-size: 12px; line-height: 1.4; text-align: center; cursor: pointer; transition: background .2s, transform .2s; text-shadow: 0 2px 5px #0008; }
.desktop-shortcut:hover { background: #ffffff10; transform: translateY(-4px); }.desktop-shortcut:focus-visible { outline: 2px solid #a9d3ff; background: #ffffff20; outline-offset: 2px; }
.app-icon { position: relative; width: 70px; height: 70px; display: grid; place-items: center; border-radius: 18px; border: 1px solid #ffffff90; background: linear-gradient(145deg,#fff,#d8e1ea); box-shadow: inset 0 2px 2px #fff9, inset 0 -3px 5px #0002, 0 9px 18px #0004; color: #18283c; text-shadow: none; font-size: 38px; }
.app-icon::after { content: ''; position: absolute; inset: 0; border-radius: inherit; background: linear-gradient(140deg, #ffffff50, transparent 45%, #ffffff08); pointer-events: none; }.app-icon img { width: 100%; height: 100%; border-radius: inherit; object-fit: cover; }
.app-about { color: #ff8244; background: linear-gradient(140deg,#fffaf4,#eee9e2); font-size: 59px; }.app-about>span { filter: drop-shadow(0 2px 2px #d5454050); }
.app-base { background: linear-gradient(145deg,#3d424d,#10131a); color: #f5f3e9; font-size: 35px; font-weight: 700; letter-spacing: -.08em; border-color: #b8bdc76b; }
.app-sport { background: linear-gradient(145deg,#beffbe,#3bbc8c); color: #063f35; }.sport-pulse { width: 43px; height: 32px; background: currentColor; clip-path: polygon(0 47%,25% 47%,39% 0,57% 79%,69% 37%,78% 47%,100% 47%,100% 58%,73% 58%,68% 54%,55% 100%,38% 29%,31% 58%,0 58%); }
.app-game { background: linear-gradient(140deg,#eee4ff,#a59cfc); color: #493a9a; font: 600 34px Georgia,serif; }.app-contact { background: linear-gradient(140deg,#eafaff,#8bdafa); color: #146293; }.app-projects { background: linear-gradient(140deg,#d7f8ff,#81c8e8); }
.shortcut-about { left: 5%; top: 6%; transform: rotate(-4deg); }.shortcut-bridge { left: 24%; top: 13%; }.shortcut-productdeck { left: 68%; top: 7%; transform: rotate(4deg); }.shortcut-streamspark { right: 3%; top: 37%; }.shortcut-base { left: 6%; top: 49%; }.shortcut-coincil { left: 28%; top: 70%; transform: rotate(-3deg); }.shortcut-sport { left: 59%; top: 59%; }.shortcut-game { right: 5%; top: 76%; }.shortcut-contact { left: 44%; top: 43%; }
.desktop-footer { position: absolute; bottom: 27px; left: 25px; display: flex; align-items: center; gap: 8px; color: #e3e9f5; font: 400 9px 'DM Mono', monospace; letter-spacing: .04em; }.desktop-live-dot { width: 6px; height: 6px; border-radius: 50%; background: #92e3ae; box-shadow: 0 0 10px #92e3ae80; }.desktop-footer-note { display: none; }
.desktop-dock { position: absolute; bottom: 24px; left: 50%; transform: translateX(-50%); display: flex; align-items: center; gap: 9px; padding: 10px; border: 1px solid #ffffff50; border-radius: 22px; background: #dce5f32b; box-shadow: inset 0 1px 0 #ffffff50, 0 15px 40px #0004; backdrop-filter: blur(22px); }
.desktop-dock :is(button, a) { position: relative; padding: 0; background: transparent; border: 0; color: #fff; cursor: pointer; transition: transform .2s; }.desktop-dock :is(button, a):hover { transform: translateY(-8px); }.desktop-dock :is(button, a):focus-visible { outline: 2px solid #fff; outline-offset: 5px; border-radius: 14px; }
.dock-icon { width: 56px; height: 56px; border-radius: 14px; display: grid; place-items: center; background: linear-gradient(145deg,#fff,#d6dff0); box-shadow: inset 0 1px 1px #fff, 0 3px 5px #0002; font-size: 41px; }.dock-about { color: #8c6ae9; }.dock-projects { color: #1b8cc2; }.dock-lab { color: #6a61bc; font-size: 37px; }.dock-contact { color: #188dcc; }.dock-contact>span { width: 39px; height: 34px; border-radius: 10px; background: linear-gradient(#74d8ff,#3c9ee5); color: white; line-height: 31px; font-size: 28px; box-shadow: 0 3px 4px #35769a30; }
.folder-glyph { display: block; width: 38px; height: 29px; border-radius: 4px; position: relative; background: linear-gradient(#73d3f1,#269bcc); box-shadow: inset 0 1px 0 #ffffff70, 0 2px 4px #12435d30; }.folder-glyph::before { content: ''; position: absolute; width: 17px; height: 6px; left: 0; top: -5px; background: #51b4d8; border-radius: 4px 5px 0 0; }
.dock-label { position: absolute; bottom: calc(100% + 20px); left: 50%; transform: translateX(-50%); background: #202837db; border: 1px solid #ffffff30; border-radius: 6px; padding: 7px 10px; color: #fff; font-size: 11px; white-space: nowrap; opacity: 0; pointer-events: none; transition: opacity .15s; }.desktop-dock :is(button, a):hover .dock-label,.desktop-dock :is(button, a):focus-visible .dock-label { opacity: 1; }.dock-divider { height: 37px; width: 1px; background: #ffffff38; margin: 0 3px; }

/* Native dialogs provide focus management, Escape, and an inert background. */
.desktop-window { width: min(820px, calc(100vw - 40px)); max-height: calc(100svh - 130px); padding: 0; border: 1px solid #ffffffa6; border-radius: 14px; background: #f4f4f2; color: #23252b; box-shadow: 0 40px 120px #0008, 0 0 0 1px #0003; overflow: hidden; }
.desktop-window[open] { display: flex; flex-direction: column; animation: window-open .23s ease-out; }.desktop-window::backdrop { background: #040c2033; backdrop-filter: blur(5px); }
@keyframes window-open { from { opacity: 0; transform: translateY(12px) scale(.97); } to { opacity: 1; transform: none; } }
.window-titlebar { display: flex; align-items: center; flex: 0 0 45px; gap: 8px; padding: 0 16px; background: linear-gradient(#f6f6f6,#e5e5e5); border-bottom: 1px solid #ceced1; position: relative; }
.window-close,.window-light { width: 12px; height: 12px; border-radius: 50%; border: 1px solid #0002; background: #ff6058; padding: 0; }.window-close { cursor: pointer; position: relative; }.window-close::before { content: ''; position: absolute; inset: -10px; }.window-close span { position: absolute; inset: -2px; font: 13px/14px Arial,sans-serif; opacity: 0; color: #681c13; }.window-close:hover span,.window-close:focus-visible span { opacity: 1; }.window-close:focus-visible { outline: 2px solid #233e84; outline-offset: 4px; }.window-light.amber { background: #ffbc2e; }.window-light.green { background: #28c840; }
#window-title { position: absolute; left: 95px; right: 65px; text-align: center; font-size: 12px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }.window-title-mark { margin-left: auto; color: #93959b; font-size: 16px; }
.window-content { overflow: auto; overscroll-behavior: contain; padding: 32px; }
.window-content .micro-label { font-size: 9px; color: #79808b; }.window-content h1,.window-content h2 { font-size: clamp(32px,4vw,47px); letter-spacing: -.06em; line-height: 1.05; margin: 0 0 20px; }.window-content h1 span { background: none; padding: 0; box-shadow: none; transform: none; }.window-content h1 br { display: none; }.window-content h1 span + span { margin-left: .2em; }.window-content .hero-copy { width: 100%; max-width: none; }.window-content .hero-copy h1 { text-transform: none; }.window-content .hero-summary { font-size: 21px; max-width: 570px; margin: 22px 0; line-height: 1.4; letter-spacing: -.03em; font-weight: 500; }.window-content .social-stickers { margin-bottom: 32px; }.window-content .social-sticker { font-size: 10px; }.window-content .social-sticker:nth-child(2) { background: #fff; }
.window-content .about-main { border-top: 1px solid #dbdde1; padding-top: 28px; margin-top: 24px; }.window-content .about-main h2 { font-size: 30px; }.window-content .about-main>p:last-of-type { font-size: 14px; }.window-content .about-points { margin-top: 22px; }.window-content .about-points span { font-size: 10px; }
.window-content .project-card,.window-content .project-card.reverse { display: flex; flex-direction: column; min-height: 0; border: 0; border-radius: 0; background: transparent; }.window-content .project-visual,.window-content .reverse .project-visual { order: 0; height: 250px; min-height: 250px; border: 1px solid #d3d5dc; border-radius: 10px; background-image: none; }.window-content .project-copy,.window-content .reverse .project-copy { order: 1; padding: 28px 0 2px; background: transparent; }.window-content .project-copy h3,.window-content .open-copy h3 { font-size: 35px; margin: 18px 0 14px; }.window-content .project-copy p,.window-content .open-copy p { font-size: 14px; }.window-content .project-topline { font-size: 9px; letter-spacing: .04em; }.window-content .project-actions a { border-radius: 7px; }.window-content .tape,.window-content .scribble,.window-content .visual-number { display: none; }.window-content .fake-app { height: 88%; max-width: 390px; }.window-content .fake-main { padding: 18px; }.window-content .fake-main strong { font-size: 28px; margin: 8px 0 12px; }.window-content .agent-row { padding: 9px 0; }.window-content .deck-stack { width: 260px; height: 175px; }.window-content .d1 { padding: 27px; }.window-content .d1 strong { font-size: 30px; }.window-content .stream-window { height: 83%; max-width: 430px; grid-template-rows: 1fr 60px; }.window-content .open-card { background: transparent; border: 0; }.window-content .open-thumb { height: 240px; border-radius: 10px; background-image: none; }.window-content .open-copy { padding: 28px 0 0; }.window-content .base-console,.window-content .ballot-card,.window-content .terminal-mini { max-width: 380px; }.window-content .base-console { padding: 20px; }.window-content .base-console>strong { font-size: 32px; margin-bottom: 16px; }.window-content .base-modules { grid-template-columns: repeat(4,1fr); }.window-content .base-modules i { padding: 8px; }.window-content .tic-grid { grid-template-columns: repeat(3,50px); grid-template-rows: repeat(3,50px); }
.window-content .contact-section { color: #23252b; padding: 0; }.window-content .contact-section h2 { font-size: 42px; }.window-content .contact-socials { grid-template-columns: 1fr; gap: 8px; margin-top: 25px; }.window-content .contact-socials a { min-height: 0; display: grid; grid-template-columns: 28px 1fr auto; gap: 16px; align-items: center; border: 1px solid #dcdee3; padding: 17px; }.window-content .contact-socials img { width: 20px; height: 20px; margin: 0; }.window-content .contact-socials span { font-size: 14px; }.window-content .contact-socials small { margin: 0; }.window-content .contact-socials a:hover { transform: translateX(3px); background: #fff; }
.window-lede { color: #6e747e; font-size: 14px; line-height: 1.6; margin: 0 0 25px; }.finder-list { display: grid; gap: 8px; }.finder-item { display: grid; grid-template-columns: 49px 1fr 20px; align-items: center; text-align: left; gap: 15px; padding: 13px; background: #fff; border: 1px solid #dce0e6; border-radius: 10px; cursor: pointer; color: #242a36; }.finder-item:hover { background: #e9eff7; }.finder-item .app-icon { width: 46px; height: 46px; border-radius: 11px; font-size: 25px; }.finder-item .app-about { font-size: 35px; }.finder-name { font-size: 14px; font-weight: 600; }.finder-category { display: block; color: #858b97; font: 400 8px 'DM Mono',monospace; margin-top: 5px; line-height: 1.5; }
.desktop button:focus-visible,.desktop a:focus-visible { outline: 2px solid #7fabed; outline-offset: 4px; }

@media(min-width:1450px) { .theme-dice { right: 30px; }.desktop-intro { top: 22%; }.desktop-icons { inset: 90px 5% 165px; }.app-icon { width: 80px; height: 80px; }.desktop-shortcut { width: 132px; font-size: 13px; }.desktop-footer-note { display: inline; position: fixed; right: 28px; bottom: 27px; text-transform: none; letter-spacing: 0; } }
@media(max-width:800px) { .desktop { min-height: 760px; }.desktop-menu-note { display: none; }.desktop-menubar { padding: 0 15px; gap: 15px; }.desktop-menu-socials { gap: 9px; }.desktop-intro { left: 32px; top: 86px; }.desktop-intro p { font-size: 44px; margin-top: 14px; }.desktop-intro>span { font-size: 8px; }.desktop-icons { top: 260px; bottom: 130px; left: 24px; right: 24px; display: grid; grid-template-columns: repeat(3,1fr); align-content: space-between; gap: 13px; }.desktop-shortcut { position: static; width: 100%; min-height: 108px; transform: none; gap: 8px; font-size: 11px; }.app-icon { width: 62px; height: 62px; border-radius: 16px; }.desktop-footer { left: 15px; bottom: 10px; font-size: 8px; }.desktop-dock { bottom: 37px; }.desktop-window { max-height: calc(100svh - 50px); }.window-content { padding: 24px; } }
@media(max-width:480px) { .theme-dice { right: 8px; top: 58px; transform: scale(.86); transform-origin: right top; }.topbar { padding-right: 90px; }.desktop { min-height: 850px; }.desktop-menubar { gap: 10px; }.desktop-owner { font-size: 11px; gap: 6px; }.desktop-mark { font-size: 19px; }.desktop-menu-socials { gap: 7px; }.desktop-menu-socials img { width: 12px; height: 12px; }.desktop-intro { left: 27px; top: 94px; }.desktop-intro p { font-size: 42px; }.desktop-intro>span { display: block; max-width: 170px; font-size: 7px; line-height: 1.7; }.desktop-icons { top: 282px; left: 15px; right: 15px; bottom: 140px; gap: 9px; }.desktop-shortcut { font-size: 10px; padding-inline: 1px; }.desktop-dock { padding: 8px; gap: 8px; border-radius: 19px; }.dock-icon { width: 50px; height: 50px; border-radius: 12px; }.desktop-window { width: calc(100vw - 20px); }.window-content { padding: 20px; }.window-content .contact-section h2 { font-size: 34px; }.window-content .contact-socials a { gap: 10px; padding: 14px 10px; }.window-content .contact-socials small { font-size: 9px; }.window-content .project-topline { font-size: 8px; gap: 10px; }.window-content .game-caption { font-size: 10px; right: 7px; bottom: 7px; }.window-content .base-modules { grid-template-columns: repeat(2,1fr); }.window-content .project-copy h3,.window-content .open-copy h3 { font-size: 31px; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior: auto; }.theme-dice *,.desktop *, .reveal { animation: none !important; transition: none !important; }.reveal { opacity: 1; transform: none; }.theme-dice:hover .die-one { transform: rotateX(-24deg) rotateY(-33deg) rotateZ(-15deg); }.theme-dice:hover .die-two { transform: rotateX(-28deg) rotateY(34deg) rotateZ(16deg); } }

/* Social dock and the desktop's project folder. */
.shortcut-minor { left: 44%; top: 43%; }
.app-minor { background: linear-gradient(140deg, #e7f8ff, #a9d9ee); }
.app-minor .folder-glyph { width: 43px; height: 33px; }
.desktop-dock .dock-social { display: block; }
.dock-social .dock-icon img { width: 28px; height: 28px; object-fit: contain; }
.dock-social-github { background: linear-gradient(145deg,#fff,#dbe0e8); }
.dock-social-x { background: linear-gradient(145deg,#3b3d43,#0c0d10); }
.dock-social-instagram { background: radial-gradient(circle at 25% 110%,#ffd76b 0%,#f66c42 28%,#d72b85 58%,#6743c5 100%); }
.dock-social-twitch { background: linear-gradient(145deg,#ac78ff,#7435d0); }
.dock-social-youtube { background: linear-gradient(145deg,#ff6054,#e71c28); }
.dock-social-x img,.dock-social-instagram img,.dock-social-twitch img,.dock-social-youtube img { filter: invert(1); }