:root {
    --ink: #29235f;
    --deep: #181247;
    --line: #544a96;
    --blue: #3f8dff;
    --blue2: #7ee6ff;
    --pink: #ff8fd2;
    --pink2: #ffd7f2;
    --mint: #a5fff2;
    --yellow: #fff06b;
    --win: #fff8fe;
    --glass: rgba(255,248,254,.78);
    --glass2: rgba(225,248,255,.76);
    --shadow: #33245d66;
    --title1: #2f8dff;
    --title2: #65d7ff;
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    overflow-x: hidden;
}

body {
    margin: 0;
    min-height: 100vh;
    color: var(--ink);
    font: 14px/1.38 Tahoma,"MS UI Gothic","MS PGothic",Verdana,sans-serif;
    background: #d8f4ff;
    overflow-x: hidden;
    padding: 18px 14px 58px;
    image-rendering: pixelated;
}

a {
    color: #2132af;
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

button,
input,
textarea {
    font: inherit;
    color: inherit;
    min-width: 0;
}

img {
    max-width: 100%;
    height: auto;
    display: block;
    image-rendering: pixelated;
}

#fx {
    position: fixed;
    inset: 0;
    z-index: 999;
    pointer-events: none;
    image-rendering: pixelated;
}

.bg {
    position: fixed;
    inset: 0;
    z-index: -2;
    background-position: center;
    background-size: cover;
    filter: saturate(1.08) contrast(1.02);
}

body[data-wallpaper="overload"] .bg {
    background-image: url("assets/wallpapers/nso-overload-pixel.png");
}

body[data-wallpaper="pills"] .bg {
    background-image: url("assets/wallpapers/pillcore-desktop.png");
}

body[data-wallpaper="bliss"] .bg {
    background-image: url("assets/wallpapers/bliss-pixel-true.png");
}

body[data-wallpaper="pool"] .bg {
    background-image: url("assets/wallpapers/watercore-pixel-pool.png");
}

body[data-wallpaper="clouds"] .bg {
    background-image: url("assets/wallpapers/aerocore-cloud-memory.png");
}

body[data-wallpaper="room"] .bg {
    background-image: url("assets/wallpapers/liminal-glass-room.png");
}

body[data-wallpaper="candy"] .bg {
    background-image: url("assets/wallpapers/candy-dream-window.png");
}

body[data-wallpaper="popups"] .bg {
    background-image: url("assets/wallpapers/webcore-popups.png");
}

body[data-wallpaper="tile"] .bg {
    background-image: url("assets/wallpapers/tile-pastel-pixels.png");
    background-size: 260px 260px;
    background-repeat: repeat;
}

body:before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    background: radial-gradient(circle at 20% 8%,rgba(255,255,255,.75),transparent 24%),
    radial-gradient(circle at 80% 20%,rgba(255,143,210,.35),transparent 30%),
    linear-gradient(rgba(255,255,255,.17),rgba(255,255,255,.06));
    pointer-events: none;
}

body.scanlines:not(.no-scan):after {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 998;
    pointer-events: none;
    background: repeating-linear-gradient(to bottom,rgba(255,255,255,.13) 0,rgba(255,255,255,.13) 1px,rgba(58,46,120,.06) 2px,transparent 4px);
    mix-blend-mode: soft-light;
}

.site-frame {
    width: min(1180px,100%);
    margin: 0 auto;
    min-width: 0;
}

.window,
.top-browser {
    border: 2px solid var(--line);
    border-radius: 7px;
    box-shadow: 0 8px 0 rgba(45,35,95,.2),0 18px 36px rgba(38,30,92,.28),inset 0 0 0 1px rgba(255,255,255,.84);
    overflow: hidden;
    min-width: 0;
    background: var(--glass);
    backdrop-filter: blur(10px) saturate(1.2);
}

.glass-heavy {
    background: linear-gradient(135deg,rgba(255,255,255,.88),rgba(210,247,255,.76) 45%,rgba(255,216,243,.78));
}

.glass-lite {
    background: linear-gradient(135deg,rgba(255,255,255,.83),rgba(230,248,255,.72),rgba(255,230,249,.70));
}

.bar,
.browser-titlebar {
    min-height: 26px;
    padding: 4px 8px;
    display: flex;
    align-items: center;
    gap: 6px;
    justify-content: space-between;
    color: white;
    text-shadow: 1px 1px #12315f;
    background: linear-gradient(#3fa2ff,#146de1 52%,#0552b7 53%,#55ceff);
    border-bottom: 2px solid #204c9e;
    white-space: nowrap;
    min-width: 0;
}

.bar span,
.browser-titlebar b {
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
}

.bar i {
    font-style: normal;
    letter-spacing: 2px;
    opacity: .95;
    flex: none;
}

.browser-titlebar {
    justify-content: flex-start;
}

.browser-titlebar b {
    font-size: 13px;
}

.browser-titlebar em {
    margin-left: auto;
    font-size: 11px;
    opacity: .9;
    font-style: normal;
    overflow: hidden;
    text-overflow: ellipsis;
}

.win-dot {
    width: 10px;
    height: 10px;
    border: 1px solid #fff;
    box-shadow: 1px 1px #20346e;
    flex: none;
}

.win-dot.red {
    background: #ff5f7a;
}

.win-dot.yellow {
    background: #ffe46e;
}

.win-dot.green {
    background: #69ff9e;
}

.top-browser {
    margin-bottom: 14px;
    background: rgba(255,255,255,.80);
}

.address-row {
    display: grid;
    grid-template-columns: auto auto auto minmax(0,1fr) auto;
    gap: 5px;
    align-items: center;
    padding: 7px;
    background: #e8f3ff;
    border-bottom: 1px solid #84a7d2;
}

.address-row button,
.go {
    height: 26px;
}

.address-row input {
    height: 26px;
    border: 2px inset #fff;
    background: white;
    padding: 2px 8px;
    width: 100%;
    min-width: 0;
    color: #173481;
}

.marquee {
    height: 25px;
    overflow: hidden;
    border-bottom: 1px solid #93afe0;
    background: linear-gradient(90deg,#fff7fd,#dffaff,#fffbd8);
}

.marquee span {
    display: inline-block;
    white-space: nowrap;
    padding: 4px 0 0 100%;
    animation: mar 24s linear infinite;
    color: #5c3488;
    font-weight: bold;
}

@keyframes mar{
    to {
        transform: translateX(-100%);
    }
}

.logo-row {
    display: grid;
    grid-template-columns: auto minmax(0,1fr) auto;
    gap: 12px;
    align-items: center;
    padding: 14px 16px;
    background: linear-gradient(120deg,rgba(255,255,255,.86),rgba(201,244,255,.64),rgba(255,206,239,.72));
}

.logo-copy {
    min-width: 0;
}

.logo-row h1 {
    margin: 0;
    font-size: clamp(34px,8vw,72px);
    line-height: .9;
    letter-spacing: 2px;
    color: #fff;
    text-shadow: 2px 2px 0 #1e53c7,4px 4px 0 #ff8fd2,6px 6px 0 #46378c;
    word-break: break-word;
}

.logo-row p {
    margin: 6px 0 0;
}

.logo-avatar {
    width: 66px;
    height: 66px;
    filter: drop-shadow(4px 4px 0 #6657af);
}

.spark-gif {
    width: 34px;
    height: 34px;
}

.nav-tabs {
    display: flex;
    gap: 5px;
    align-items: center;
    overflow-x: auto;
    padding: 8px;
    background: linear-gradient(#edf7ff,#c9e7ff);
    border-top: 1px solid #fff;
}

.nav-tabs a {
    flex: 0 0 auto;
    color: #122366;
    background: linear-gradient(#fff,#c8eaff);
    border: 2px solid #5367aa;
    border-radius: 4px;
    padding: 7px 10px;
    box-shadow: inset 1px 1px #fff,2px 2px 0 #8fa0d4;
    font-weight: bold;
}

.nav-tabs a.active,
.nav-tabs a:hover {
    background: linear-gradient(#ffd8f2,#ff8fd2);
    text-decoration: none;
}

.desktop-grid {
    display: grid;
    grid-template-columns: 172px minmax(0,1fr) 244px;
    gap: 14px;
    align-items: start;
    min-width: 0;
}

.main-column,
.right-dock {
    display: grid;
    gap: 14px;
    min-width: 0;
}

.left-dock {
    position: sticky;
    top: 8px;
    min-width: 0;
}

.icons {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    padding: 12px;
}

.icons a {
    display: grid;
    place-items: center;
    gap: 5px;
    text-align: center;
    color: var(--deep);
    font-size: 11px;
    min-width: 0;
}

.icons img {
    width: 38px;
    height: 38px;
}

.icons b {
    max-width: 70px;
    overflow-wrap: anywhere;
}

.counter-box {
    margin: 0 10px 10px;
    padding: 8px;
    border: 2px inset #fff;
    background: #060728;
    color: #a9ffba;
    text-align: center;
    box-shadow: inset 0 0 8px #000;
}

.counter-box span,
.counter-box small {
    display: block;
    color: #bfffcf;
    font-size: 10px;
}

.counter-box b {
    font: 22px/1 monospace;
    letter-spacing: 2px;
}

.xp-button,
.section-tools button,
.sticker-actions button,
.clip button,
.pill-tray button,
.start-menu button,
.address-row button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 2px solid #354a9f;
    border-radius: 4px;
    background: linear-gradient(#fff 0%,#e7f5ff 38%,#94d9ff 50%,#67bfff 100%);
    box-shadow: inset 2px 2px 0 rgba(255,255,255,.95),inset -2px -2px 0 rgba(44,75,170,.25),3px 3px 0 rgba(47,41,117,.28);
    min-height: 31px;
    padding: 6px 10px;
    color: #19215d;
    font-weight: bold;
    text-decoration: none;
    cursor: pointer;
    user-select: none;
    touch-action: manipulation;
    transition: transform .04s ease,box-shadow .04s ease,filter .12s ease;
    max-width: 100%;
}

.xp-button:hover,
.section-tools button:hover,
.sticker-actions button:hover,
.clip button:hover,
.pill-tray button:hover,
.address-row button:hover {
    filter: brightness(1.05) saturate(1.12);
    text-decoration: none;
}

.xp-button:active,
.section-tools button:active,
.sticker-actions button:active,
.clip button:active,
.pill-tray button:active,
.start-menu button:active,
.address-row button:active,
.pressing {
    transform: translate(2px,2px);
    box-shadow: inset 3px 3px 0 rgba(44,45,114,.36),inset -1px -1px 0 rgba(255,255,255,.9),1px 1px 0 rgba(47,41,117,.25);
    background: linear-gradient(#76c7ff,#ccefff 55%,#fff);
}

.xp-button.primary {
    background: linear-gradient(#fff,#ffd4f0 42%,#ff8fd2 55%,#ff6ebf);
    border-color: #a33483;
}

.xp-button.wide {
    width: 100%;
    margin-top: 8px;
}

.left-dock>.xp-button {
    width: calc(100% - 20px);
    margin: 0 10px 8px;
}

.hero-content {
    display: grid;
    grid-template-columns: minmax(0,1fr) minmax(260px,38%);
    gap: 16px;
    align-items: center;
    padding: 18px;
}

.hero-text,
.hero-art {
    min-width: 0;
}

.stamp {
    display: inline-block;
    padding: 4px 7px;
    border: 2px solid #6f54ae;
    background: #fff06b;
    box-shadow: 2px 2px 0 #ff8fd2;
    font-weight: bold;
}

.hero-text h2 {
    margin: 13px 0 8px;
    font-size: clamp(23px,4vw,42px);
    line-height: 1.04;
    color: #2e2474;
    text-shadow: 2px 2px 0 #fff,4px 4px 0 #9beeff;
    overflow-wrap: anywhere;
}

.hero-text p {
    font-size: 15px;
    max-width: 64ch;
}

.hero-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.hero-art {
    position: relative;
    display: grid;
    place-items: center;
    min-height: 260px;
    border: 2px dashed rgba(81,64,150,.42);
    border-radius: 12px;
    background: radial-gradient(circle at 50% 30%,rgba(255,255,255,.86),rgba(255,143,210,.22),transparent 70%);
    overflow: hidden;
}

.hero-img {
    width: min(340px,92%);
    filter: drop-shadow(6px 6px 0 rgba(50,35,113,.25));
}

.hero-art .water {
    position: absolute;
    left: 10px;
    bottom: 10px;
    width: 92px;
    opacity: .85;
}

.mini-popup {
    position: absolute;
    width: min(150px,42%);
    padding: 6px;
    background: #fff8fe;
    border: 2px solid #4c4596;
    box-shadow: 4px 4px 0 rgba(62,44,120,.3);
    font-size: 11px;
    overflow: hidden;
}

.mini-popup b {
    display: block;
    background: #ff8fd2;
    margin: -6px -6px 4px;
    padding: 2px 5px;
}

.mini-popup span {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mini-popup.p1 {
    right: 10px;
    top: 16px;
}

.mini-popup.p2 {
    left: 12px;
    top: 72px;
}

.wallpaper-window {
    padding-bottom: 10px;
}

.wallpapers {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 12px;
}

.wallpapers button,
.chips button {
    border: 2px solid #6057a4;
    background: #fff8fe;
    box-shadow: 2px 2px 0 rgba(44,37,110,.22),inset 1px 1px #fff;
    border-radius: 3px;
    padding: 5px 8px;
    cursor: pointer;
    font-weight: bold;
}

.wallpapers button.active,
.chips button.active {
    background: #ffbfe5;
}

.updates-row,
.split-row {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 14px;
}

.updates {
    display: grid;
    gap: 9px;
    padding: 11px;
    max-height: 360px;
    overflow: auto;
}

.update-item {
    display: grid;
    grid-template-columns: 42px minmax(0,1fr);
    gap: 8px;
    border: 1px solid rgba(80,68,153,.45);
    background: rgba(255,255,255,.63);
    padding: 7px;
}

.update-item img {
    width: 42px;
    height: 42px;
}

.update-item b,
.link-card b,
.clip b {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.update-item span,
.clip small,
.link-card small {
    display: block;
    font-size: 11px;
    color: #644c8f;
}

.update-item p {
    margin: 3px 0 0;
    font-size: 12px;
    overflow-wrap: anywhere;
}

.feature-stickers {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 8px;
    padding: 11px;
}

.feature-stickers button {
    border: 2px outset #fff;
    background: rgba(255,255,255,.72);
    min-width: 0;
    padding: 6px;
    cursor: pointer;
    box-shadow: 2px 2px 0 rgba(70,58,140,.18);
}

.feature-stickers img {
    width: 58px;
    height: 58px;
    margin: auto;
}

.feature-stickers b {
    display: block;
    font-size: 11px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.status-card {
    padding-bottom: 10px;
}

.status-card p {
    display: flex;
    justify-content: space-between;
    margin: 8px 10px;
    padding: 5px 7px;
    background: rgba(255,255,255,.65);
    border: 1px solid #8e8bc0;
}

.status-card .xp-button {
    width: calc(100% - 20px);
    margin: 0 10px;
}

.badges {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 7px;
    padding: 10px;
}

.badges img,
.tiny-badges img {
    width: 88px;
    height: 31px;
    object-fit: cover;
}

.tiny-badges {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 7px;
    padding: 0 10px 10px;
    justify-items: center;
}

blockquote {
    margin: 12px;
    padding: 12px;
    background: rgba(255,255,255,.65);
    border-left: 6px solid var(--pink);
    font-weight: bold;
    min-height: 90px;
    overflow-wrap: anywhere;
}

.full-row {
    grid-column: 1/-1;
    min-width: 0;
}

.overload-panel {
    background: linear-gradient(135deg,rgba(255,234,250,.88),rgba(221,249,255,.78),rgba(255,252,198,.72));
}

.overload-grid {
    display: grid;
    grid-template-columns: 1.1fr .9fr .8fr;
    gap: 12px;
    padding: 14px;
    min-width: 0;
}

.angel-console,
.pill-window,
.popup-stack>div {
    border: 2px solid rgba(72,63,145,.65);
    background: rgba(255,255,255,.63);
    box-shadow: 3px 3px 0 rgba(70,55,135,.22),inset 1px 1px rgba(255,255,255,.9);
    padding: 12px;
    min-width: 0;
}

.angel-console h3,
.pill-window h3 {
    margin: 0 0 6px;
    font-size: 18px;
    color: #5e3688;
}

.angel-console p,
.pill-window p {
    margin: 0 0 10px;
    overflow-wrap: anywhere;
}

.micro {
    font-size: 11px;
    color: #6c4c90;
}

.meter {
    display: grid;
    grid-template-columns: 82px minmax(0,1fr) 36px;
    align-items: center;
    gap: 7px;
    margin: 8px 0;
    font-size: 11px;
}

.meter span {
    height: 14px;
    border: 2px inset #fff;
    background: #251d5b;
    overflow: hidden;
}

.meter i {
    display: block;
    height: 100%;
    background: linear-gradient(90deg,#ff8fd2,#fff06b,#7ee6ff);
}

.pill-tray {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 8px;
}

.pill-tray button {
    min-height: 78px;
    display: grid;
    place-items: center;
    padding: 4px;
    background: linear-gradient(#fff,#ffe7f6);
}

.pill-tray img {
    width: 112px;
    max-width: 100%;
    height: auto;
}

.pill-tray span {
    font-size: 11px;
}

.popup-stack {
    display: grid;
    gap: 9px;
    min-width: 0;
}

.popup-stack>div {
    padding: 0;
}

.popup-stack b {
    display: block;
    background: linear-gradient(#ff8fd2,#73e4ff);
    padding: 5px 8px;
    color: #24194f;
}

.popup-stack p {
    margin: 8px;
    font-size: 12px;
    overflow-wrap: anywhere;
}

.preview-wall {
    display: grid;
    grid-template-columns: repeat(6,minmax(0,1fr));
    gap: 10px;
    padding: 12px;
}

.preview-wall img {
    aspect-ratio: 16/10;
    width: 100%;
    object-fit: cover;
    border: 2px solid #57509d;
    box-shadow: 3px 3px 0 rgba(48,37,114,.24);
    background: #fff;
}

.section-tools {
    display: grid;
    grid-template-columns: minmax(200px,290px) minmax(0,1fr);
    gap: 10px;
    align-items: start;
    padding: 12px;
    border-bottom: 1px solid rgba(80,68,153,.35);
}

.section-tools label {
    display: grid;
    gap: 4px;
    font-weight: bold;
}

.section-tools input {
    border: 2px inset #fff;
    background: #fff;
    padding: 7px;
    width: 100%;
    min-width: 0;
}

.chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    min-width: 0;
}

.sticker-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill,minmax(132px,1fr));
    gap: 12px;
    padding: 12px;
    min-width: 0;
}

.sticker-card {
    min-width: 0;
    border: 2px solid #5b549d;
    background: rgba(255,255,255,.72);
    box-shadow: 3px 3px 0 rgba(61,46,128,.24),inset 1px 1px #fff;
    padding: 8px;
    text-align: center;
    overflow: hidden;
}

.sticker-card img {
    width: 88px;
    height: 88px;
    margin: 0 auto 6px;
}

.sticker-card b,
.sticker-card small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sticker-card small {
    font-size: 11px;
    color: #6f5692;
}

.sticker-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 5px;
    margin-top: 7px;
}

.sticker-actions button {
    font-size: 12px;
    min-height: 28px;
    padding: 4px 5px;
}

.clips-list {
    display: grid;
    gap: 9px;
    padding: 12px;
}

.clip {
    display: grid;
    grid-template-columns: 42px minmax(0,1fr) 36px;
    gap: 8px;
    align-items: center;
    background: rgba(255,255,255,.65);
    border: 1px solid rgba(80,68,153,.42);
    padding: 6px;
}

.clip img {
    width: 42px;
    height: 42px;
}

.clip button {
    min-height: 32px;
    padding: 0;
}

.fake-player {
    display: grid;
    grid-template-columns: 48px minmax(0,1fr);
    gap: 10px;
    margin: 0 12px 12px;
    padding: 10px;
    border: 2px inset #fff;
    background: #241a5d;
    color: white;
}

.fake-player img {
    width: 48px;
    height: 48px;
}

.fake-player span {
    display: block;
    height: 12px;
    background: #090729;
    border: 1px solid #b2b0ff;
    margin: 5px 0;
    overflow: hidden;
}

.fake-player span i {
    display: block;
    height: 100%;
    background: linear-gradient(90deg,#ff8fd2,#7ee6ff);
}

.archive-list {
    margin: 12px;
    padding-left: 26px;
}

.archive-list li {
    margin: 6px 0;
}

textarea {
    width: calc(100% - 24px);
    margin: 0 12px 12px;
    min-height: 116px;
    border: 2px inset #fff;
    background: #fff8fe;
    padding: 8px;
    resize: vertical;
}

.tiny-note {
    margin: 12px 12px 0;
    font-size: 12px;
    background: rgba(255,255,255,.6);
    border: 1px dashed #736ab0;
    padding: 8px;
}

.links-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill,minmax(210px,1fr));
    gap: 10px;
    padding: 12px;
}

.link-card {
    display: grid;
    grid-template-columns: 42px minmax(0,1fr);
    gap: 8px;
    align-items: center;
    border: 2px solid #5d56a2;
    background: rgba(255,255,255,.68);
    box-shadow: 3px 3px 0 rgba(48,37,114,.2);
    padding: 8px;
    color: #2c286d;
    min-width: 0;
}

.link-card img {
    width: 42px;
    height: 42px;
}

.link-card:hover {
    background: #fff;
    text-decoration: none;
}

.guest-layout {
    display: grid;
    grid-template-columns: 320px minmax(0,1fr);
    gap: 12px;
    padding: 12px;
}

#guestForm {
    display: grid;
    gap: 8px;
    min-width: 0;
}

#guestForm input,
#guestForm textarea {
    width: 100%;
    margin: 0;
    border: 2px inset #fff;
    background: #fff8fe;
    padding: 8px;
}

.guest-list {
    display: grid;
    gap: 8px;
    max-height: 330px;
    overflow: auto;
    min-width: 0;
}

.guest {
    background: rgba(255,255,255,.66);
    border: 1px solid #7c72b4;
    padding: 8px;
    min-width: 0;
}

.guest b {
    color: #af2c83;
}

.guest time {
    float: right;
    font-size: 11px;
    color: #65568b;
}

.guest p {
    margin: 5px 0 0;
    overflow-wrap: anywhere;
}

.start-menu {
    position: fixed;
    left: 10px;
    bottom: 46px;
    z-index: 1000;
    width: 220px;
    border: 2px solid #3f4c98;
    background: linear-gradient(#eff8ff,#ffccec);
    box-shadow: 7px 7px 0 rgba(40,30,92,.3);
    padding: 8px;
    display: none;
}

.start-menu.open {
    display: grid;
    gap: 6px;
}

.start-menu b {
    background: linear-gradient(#2f8dff,#ff8fd2);
    color: white;
    padding: 8px;
    text-shadow: 1px 1px #333;
}

.start-menu a,
.start-menu button {
    border: 1px solid #6b61a8;
    background: white;
    padding: 6px;
    color: #201d61;
    text-align: left;
}

.taskbar {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 997;
    display: flex;
    gap: 8px;
    align-items: center;
    height: 38px;
    background: linear-gradient(#52b2ff,#176cd5 52%,#0f50af);
    border-top: 2px solid #9fe7ff;
    color: white;
    text-shadow: 1px 1px #1a2d70;
    padding: 5px 8px;
}

.taskbar button {
    border: 2px solid #fff;
    background: linear-gradient(#90ffae,#208830);
    color: white;
    text-shadow: 1px 1px #064812;
    border-radius: 4px;
    padding: 4px 13px;
    font-weight: bold;
}

.taskbar .task-item {
    background: rgba(255,255,255,.22);
    border: 1px solid rgba(255,255,255,.65);
    padding: 4px 12px;
    max-width: 40vw;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.taskbar em {
    margin-left: auto;
    font-style: normal;
}

#toast {
    position: fixed;
    right: 12px;
    bottom: 50px;
    z-index: 1001;
    background: #fff8fe;
    border: 2px solid #504897;
    box-shadow: 4px 4px 0 rgba(40,30,92,.3);
    padding: 8px 12px;
    opacity: 0;
    transform: translateY(10px);
    pointer-events: none;
    transition: .18s;
}

#toast.show {
    opacity: 1;
    transform: translateY(0);
}

dialog {
    border: 2px solid #504897;
    background: #fff8fe;
    box-shadow: 9px 9px 0 rgba(40,30,92,.34);
    max-width: min(460px,92vw);
    color: #2c2466;
}

dialog::backdrop {
    background: rgba(28,18,80,.48);
    backdrop-filter: blur(2px);
}

dialog img {
    width: 220px;
    height: 220px;
    margin: 18px auto 6px;
}

.close {
    position: absolute;
    right: 8px;
    top: 8px;
    border: 2px solid #504897;
    background: #ff8fd2;
    color: white;
    font-weight: bold;
    cursor: pointer;
}

.pixel-rain {
    position: fixed;
    width: 6px;
    height: 6px;
    z-index: 1002;
    pointer-events: none;
    animation: fall 2s linear forwards;
    box-shadow: 2px 2px 0 rgba(51,40,115,.3);
}

@keyframes fall{
    to {
        transform: translateY(110vh) rotate(180deg);
        opacity: 0;
    }
}

@media (max-width:1040px){
    .desktop-grid {
        grid-template-columns: 150px minmax(0,1fr);
    }

    .right-dock {
        grid-column: 1/-1;
        grid-template-columns: repeat(3,minmax(0,1fr));
    }

    .overload-grid {
        grid-template-columns: 1fr 1fr;
    }

    .popup-stack {
        grid-column: 1/-1;
        grid-template-columns: repeat(3,minmax(0,1fr));
    }

    .preview-wall {
        grid-template-columns: repeat(3,minmax(0,1fr));
    }
}

@media (max-width:760px){
    body {
        padding: 8px 8px 56px;
    }

    .desktop-grid {
        grid-template-columns: 1fr;
    }

    .left-dock {
        position: static;
    }

    .icons {
        grid-template-columns: repeat(4,minmax(0,1fr));
    }

    .right-dock,
    .updates-row,
    .split-row,
    .overload-grid,
    .popup-stack,
    .guest-layout {
        grid-template-columns: 1fr;
    }

    .hero-content {
        grid-template-columns: 1fr;
    }

    .hero-art {
        min-height: 230px;
    }

    .section-tools {
        grid-template-columns: 1fr;
    }

    .preview-wall {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }

    .logo-row {
        grid-template-columns: 1fr;
        justify-items: center;
        text-align: center;
    }

    .logo-avatar {
        order: -1;
    }

    .spark-gif {
        display: none;
    }

    .browser-titlebar em {
        display: none;
    }

    .badges,
    .tiny-badges {
        grid-template-columns: repeat(4,minmax(0,1fr));
    }

    .badges img,
    .tiny-badges img {
        width: 100%;
        height: auto;
    }

    .pill-tray {
        grid-template-columns: repeat(4,minmax(0,1fr));
    }

    .pill-tray button {
        min-height: 64px;
    }

    .pill-tray img {
        width: 78px;
    }

    .sticker-grid {
        grid-template-columns: repeat(auto-fill,minmax(118px,1fr));
    }
}

@media (max-width:450px){
    .address-row {
        grid-template-columns: auto auto auto minmax(0,1fr);
    }

    .address-row .go {
        display: none;
    }

    .nav-tabs a {
        padding: 6px 8px;
    }

    .icons {
        grid-template-columns: repeat(3,minmax(0,1fr));
    }

    .feature-stickers {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }

    .pill-tray {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }

    .preview-wall {
        grid-template-columns: 1fr;
    }

    .taskbar .task-item {
        display: none;
    }

    .taskbar span:nth-of-type(1) {
        max-width: 46vw;
        overflow: hidden;
        text-overflow: ellipsis;
    }
}

/* === v9 cleanup patch: less crooked, cleaner pixel-overload === */
:root {
    --panelGap: 16px;
    --pressDeep: #2e2769;
    --hotPink: #ff6fbd;
    --softPanel: rgba(255,255,255,.76);
}

.site-frame {
    width: min(1240px,100%);
}

.window,
.top-browser {
    border-radius: 4px;
    box-shadow: 0 5px 0 rgba(45,35,95,.17),0 14px 26px rgba(38,30,92,.22),inset 0 0 0 1px rgba(255,255,255,.9);
}

.desktop-grid {
    grid-template-columns: 168px minmax(0,1fr) 232px;
    gap: var(--panelGap);
    grid-auto-flow: row;
    align-items: start;
}

.left-dock {
    position: relative;
    top: auto;
}

.main-column,
.right-dock {
    gap: var(--panelGap);
}

.bar,
.browser-titlebar {
    min-height: 25px;
    padding: 3px 8px;
}

.logo-row {
    padding: 12px 15px;
}

.logo-row h1 {
    font-size: clamp(32px,6vw,64px);
}

.hero-content {
    grid-template-columns: minmax(0,1.12fr) minmax(240px,.88fr);
    gap: 14px;
    padding: 16px;
}

.hero-art {
    min-height: 238px;
}

.hero-img {
    width: min(300px,90%);
}

.wallpapers {
    gap: 7px;
    padding: 10px;
}

.wallpapers button,
.chips button {
    min-height: 28px;
    box-shadow: inset 1px 1px #fff,2px 2px 0 rgba(44,37,110,.2);
}

.updates-row {
    grid-template-columns: minmax(0,1.1fr) minmax(250px,.9fr);
    align-items: start;
}

.updates {
    max-height: 300px;
}

.update-item {
    grid-template-columns: 40px minmax(0,1fr);
    padding: 7px;
}

.update-item img {
    width: 40px;
    height: 40px;
}

.feature-stickers {
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 7px;
}

.feature-stickers button {
    height: 86px;
    display: grid;
    align-content: center;
    justify-items: center;
    border: 2px solid #7770b4;
    border-right-color: #fff;
    border-bottom-color: #fff;
    background: linear-gradient(135deg,rgba(255,255,255,.86),rgba(227,251,255,.72));
    box-shadow: inset 1px 1px #fff,2px 2px 0 rgba(55,42,120,.18);
}

.feature-stickers img {
    width: 54px;
    height: 54px;
}

.feature-stickers b {
    max-width: 100%;
    font-size: 10px;
}

.right-dock {
    grid-template-rows: auto auto auto;
}

.right-dock .window {
    width: 100%;
}

.badges,
.tiny-badges {
    gap: 6px;
    justify-items: center;
}

.badges img,
.tiny-badges img {
    width: 88px;
    height: 31px;
}

blockquote {
    min-height: 76px;
    line-height: 1.32;
    background: rgba(255,255,255,.76);
}

.full-row {
    grid-column: 1/-1;
    clear: both;
}

.overload-panel {
    background: linear-gradient(135deg,rgba(255,238,251,.91),rgba(225,250,255,.84) 52%,rgba(255,253,206,.78));
}

.overload-grid {
    grid-template-columns: minmax(280px,1.05fr) minmax(300px,.95fr);
    gap: 14px;
    padding: 14px;
    align-items: stretch;
}

.angel-console,
.pill-window,
.popup-stack>div {
    border: 2px solid #6558a7;
    background: linear-gradient(135deg,rgba(255,255,255,.78),rgba(235,252,255,.62));
    box-shadow: inset 1px 1px 0 #fff,3px 3px 0 rgba(70,55,135,.18);
    padding: 12px;
}

.angel-console {
    min-height: 224px;
}

.angel-console h3,
.pill-window h3 {
    font-size: 17px;
    margin-bottom: 8px;
}

.meter {
    grid-template-columns: 92px minmax(0,1fr) 38px;
    margin: 9px 0;
}

.meter span {
    height: 13px;
    border-color: #f9fbff;
    background: #21194f;
}

.meter i {
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.45);
}

.clean-capsules {
    overflow: hidden;
}

.pill-tray {
    grid-template-columns: 1fr 1fr;
    gap: 9px;
}

.pill-tray button {
    position: relative;
    display: grid;
    grid-template-columns: 78px minmax(0,1fr);
    align-items: center;
    justify-items: start;
    min-height: 64px;
    padding: 8px;
    border: 2px solid #6157a2;
    border-right-color: #fff;
    border-bottom-color: #fff;
    border-radius: 3px;
    background: linear-gradient(135deg,#fff 0%,#fff4fb 45%,#dffbff 100%);
    box-shadow: inset 2px 2px 0 rgba(255,255,255,.95),inset -2px -2px 0 rgba(67,55,150,.16),3px 3px 0 rgba(64,47,132,.22);
    text-align: left;
    overflow: hidden;
}

.pill-tray button:before {
    content: "";
    position: absolute;
    inset: 3px;
    border: 1px dotted rgba(97,87,162,.35);
    pointer-events: none;
}

.pill-tray button:hover {
    background: linear-gradient(135deg,#fff,#ffe1f5 50%,#ccfaff);
}

.pill-tray button:active,
.pill-tray button.pressing {
    transform: translate(2px,2px);
    box-shadow: inset 3px 3px 0 rgba(42,35,105,.32),inset -1px -1px 0 #fff,1px 1px 0 rgba(64,47,132,.18);
}

.pill-tray img {
    width: 72px;
    height: auto;
    image-rendering: pixelated;
    filter: drop-shadow(2px 2px 0 rgba(34,24,87,.24));
}

.pill-tray span {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.pill-tray span b {
    font-size: 12px;
    color: #2c236a;
    letter-spacing: .4px;
}

.pill-tray span small {
    font-size: 10px;
    color: #6a4c91;
    line-height: 1.15;
    white-space: normal;
    overflow-wrap: anywhere;
}

.clean-popups {
    grid-column: 1/-1;
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 10px;
}

.popup-stack>div {
    padding: 0;
    min-height: 78px;
    background: linear-gradient(#fff,#f5fff0);
    overflow: hidden;
}

.popup-stack b {
    background: linear-gradient(90deg,#ff8fd2 0,#f9ffc8 48%,#73e4ff 100%);
    border-bottom: 2px solid rgba(101,88,167,.65);
    padding: 6px 8px;
    color: #2c236a;
    text-shadow: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.popup-stack p {
    margin: 9px 9px 10px;
    font-size: 12px;
    line-height: 1.26;
}

/* real raised / pressed feeling for all old-school buttons */
.xp-button,
.section-tools button,
.sticker-actions button,
.clip button,
.start-menu button,
.address-row button,
.wallpapers button,
.chips button,
.nav-tabs a,
.link-card {
    transition: transform .045s ease,box-shadow .045s ease,filter .12s ease;
}

.xp-button:active,
.section-tools button:active,
.sticker-actions button:active,
.clip button:active,
.start-menu button:active,
.address-row button:active,
.wallpapers button:active,
.chips button:active,
.nav-tabs a:active,
.link-card:active,
.pressing {
    transform: translate(2px,2px);
    box-shadow: inset 3px 3px 0 rgba(44,45,114,.36),inset -1px -1px 0 rgba(255,255,255,.9),1px 1px 0 rgba(47,41,117,.18)!important;
}

.nav-tabs a {
    border-right-color: #fff;
    border-bottom-color: #fff;
}

.nav-tabs a.active {
    box-shadow: inset 2px 2px 0 rgba(255,255,255,.8),2px 2px 0 rgba(80,67,150,.25);
}

.preview-wall {
    grid-template-columns: repeat(auto-fit,minmax(145px,1fr));
    gap: 12px;
}

.sticker-grid {
    grid-template-columns: repeat(auto-fill,minmax(142px,1fr));
}

.guest-layout {
    grid-template-columns: minmax(250px,320px) minmax(0,1fr);
}

@media (max-width:1120px){
    .desktop-grid {
        grid-template-columns: 160px minmax(0,1fr);
    }

    .right-dock {
        grid-column: 1/-1;
        grid-template-columns: repeat(3,minmax(0,1fr));
        grid-template-rows: none;
    }

    .overload-grid {
        grid-template-columns: 1fr 1fr;
    }

    .clean-popups {
        grid-template-columns: repeat(3,minmax(0,1fr));
    }
}

@media (max-width:760px){
    .site-frame {
        width: 100%;
    }

    .desktop-grid,
    .right-dock,
    .updates-row,
    .split-row,
    .overload-grid,
    .clean-popups,
    .guest-layout {
        grid-template-columns: 1fr;
    }

    .hero-content {
        grid-template-columns: 1fr;
    }

    .hero-art {
        min-height: 220px;
    }

    .pill-tray {
        grid-template-columns: 1fr 1fr;
    }

    .pill-tray button {
        grid-template-columns: 66px minmax(0,1fr);
        min-height: 58px;
    }

    .pill-tray img {
        width: 62px;
    }

    .badges,
    .tiny-badges {
        grid-template-columns: repeat(4,minmax(0,1fr));
    }

    .badges img,
    .tiny-badges img {
        width: 100%;
        height: auto;
    }

    .updates {
        max-height: none;
    }
}

@media (max-width:450px){
    .pill-tray {
        grid-template-columns: 1fr;
    }

    .feature-stickers {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }

    .icons {
        grid-template-columns: repeat(3,minmax(0,1fr));
    }
}

/* === v10: real downloaded web images + cleaner XP pixel layout === */
:root {
    --v10-blue: #1379d6;
    --v10-blue2: #6ed8ff;
    --v10-pink: #ff91cf;
    --v10-lilac: #b497ff;
    --v10-ink: #211956;
    --v10-border: #4d3f98;
}

body[data-wallpaper="webpool"] .bg {
    background-image: url("assets/internet_pixel/pool_underwater_pixel.png") !important;
}

body[data-wallpaper="freshpool"] .bg {
    background-image: url("assets/internet_pixel/freshwater_pool_pixel.png") !important;
}

body[data-wallpaper="webclouds"] .bg {
    background-image: url("assets/internet_pixel/clouds_pixel.png") !important;
}

body[data-wallpaper="green"] .bg {
    background-image: url("assets/internet_pixel/green_mountain_pixel.png") !important;
}

body[data-wallpaper="glassballs"] .bg {
    background-image: url("assets/internet_pixel/glass_balls_pixel.png") !important;
}

body[data-wallpaper="prism"] .bg {
    background-image: url("assets/internet_pixel/glass_prism_pixel.png") !important;
}

body[data-wallpaper="drops"] .bg {
    background-image: url("assets/internet_pixel/glass_drops_pixel.png") !important;
}

body[data-wallpaper="opaque"] .bg {
    background-image: url("assets/internet_pixel/opaque_glass_pixel.png") !important;
}

html {
    overflow-x: hidden;
}

body {
    padding: 16px 14px 56px !important;
    color: var(--v10-ink);
    background: #b8e9ff;
    image-rendering: pixelated;
}

.bg {
    filter: saturate(1.18) contrast(1.04) brightness(1.04);
}

body:before {
    background: linear-gradient(rgba(255,255,255,.20),rgba(255,255,255,.10)),
    repeating-linear-gradient(90deg,rgba(255,255,255,.15) 0 2px,transparent 2px 24px),
    repeating-linear-gradient(0deg,rgba(255,255,255,.11) 0 2px,transparent 2px 24px) !important;
}

.site-frame {
    width: min(1120px,100%) !important;
    margin-inline: auto;
}

.top-browser,
.window {
    border-radius: 3px !important;
    border: 2px solid var(--v10-border) !important;
    background: rgba(255,255,255,.72) !important;
    box-shadow: 0 4px 0 rgba(31,22,91,.26),0 12px 28px rgba(21,25,91,.20),inset 0 0 0 1px rgba(255,255,255,.88) !important;
    overflow: hidden !important;
    backdrop-filter: blur(6px) saturate(1.22);
}

.glass-heavy,
.glass-lite {
    background: linear-gradient(135deg,rgba(255,255,255,.83),rgba(225,249,255,.73) 45%,rgba(255,230,248,.76)) !important;
}

.bar,
.browser-titlebar {
    min-height: 24px !important;
    background: linear-gradient(#70d9ff 0,#1688e7 45%,#0961bf 46%,#4fc4ff 100%) !important;
    border-bottom: 2px solid #25428c !important;
    font-size: 12px;
}

.address-row {
    grid-template-columns: 30px 30px 30px minmax(0,1fr) 42px !important;
}

.address-row input {
    font-size: 12px;
}

.logo-row {
    grid-template-columns: 42px minmax(0,1fr) 74px !important;
    padding: 14px 16px !important;
}

.logo-row h1 {
    font-size: clamp(38px,7vw,76px) !important;
    text-shadow: 2px 2px 0 #0d6ed3,4px 4px 0 var(--v10-pink),6px 6px 0 #3d328f !important;
    grid-area: 1 / 2 / 2 / 3;
}

.logo-row p {
    font-size: 13px;
    max-width: 780px;
}

.logo-avatar.real-akane {
    width: 70px;
    height: 70px;
    border-radius: 9px;
    border: 2px solid #fff;
    object-fit: cover;
    box-shadow: 0 0 0 2px #594ba2,4px 4px 0 rgba(48,38,111,.28);
    image-rendering: auto;
    grid-area: 1 / 3 / 2 / 4;
}

.nav-tabs {
    gap: 6px;
    padding: 8px;
    scrollbar-width: thin;
}

.nav-tabs a {
    font-size: 12px;
    min-height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 10px;
}

.desktop-grid {
    display: grid !important;
    grid-template-columns: 160px minmax(0,1fr) 220px !important;
    grid-auto-flow: row !important;
    gap: 14px !important;
    align-items: start !important;
}

.left-dock,
.right-dock,
.main-column {
    min-width: 0 !important;
    width: 100%;
}

.left-dock {
    position: relative !important;
    top: auto !important;
}

.right-dock {
    display: grid !important;
    gap: 14px !important;
}

.full-row {
    grid-column: 1 / -1 !important;
    min-width: 0;
}

.updates-row {
    display: grid !important;
    grid-template-columns: minmax(0,1.05fr) minmax(260px,.95fr) !important;
    gap: 14px !important;
    align-items: start;
}

.split-row {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 14px !important;
    align-items: start;
}

.icons {
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    padding: 10px !important;
}

.icons a {
    grid-template-columns: 34px minmax(0,1fr);
    display: grid;
    place-items: center start;
    text-align: left;
    gap: 8px;
    border: 1px solid rgba(77,63,152,.45);
    background: rgba(255,255,255,.48);
    padding: 5px;
    border-radius: 3px;
}

.icons img {
    width: 30px;
    height: 30px;
}

.icons b {
    max-width: 100%;
    font-size: 11px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.counter-box {
    font-size: 11px;
}

.hero-content {
    display: grid !important;
    grid-template-columns: minmax(0,1fr) 270px !important;
    gap: 16px !important;
    align-items: center;
    padding: 16px !important;
}

.hero-text h2 {
    font-size: clamp(24px,4vw,42px) !important;
    line-height: 1.02;
    margin: 8px 0 10px;
}

.hero-text p {
    max-width: 620px;
    font-size: 14px;
}

.hero-buttons {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.hero-art {
    min-height: 260px !important;
    border: 2px solid rgba(77,63,152,.55);
    background: linear-gradient(135deg,rgba(255,255,255,.40),rgba(170,232,255,.28)),url("assets/internet_pixel/glass_drops_pixel.png") center/cover;
    display: grid;
    place-items: center;
    position: relative;
    overflow: hidden;
}

.real-hero-card {
    width: 210px;
    background: rgba(255,255,255,.78);
    border: 2px solid #5c4aa0;
    box-shadow: inset 1px 1px #fff,5px 5px 0 rgba(47,36,112,.24);
    padding: 8px;
    text-align: center;
    transform: rotate(-1deg);
}

.real-akane-hero {
    width: 190px !important;
    height: 190px !important;
    object-fit: cover;
    margin: auto;
    border: 2px inset #fff;
}

.real-hero-card span {
    display: block;
    margin-top: 6px;
    font-weight: bold;
    color: #523d91;
    font-size: 12px;
}

.hero-art .water {
    position: absolute;
    right: 8px;
    bottom: 8px;
    width: 84px;
    opacity: .72;
}

.mini-popup {
    position: absolute;
    max-width: 150px;
    font-size: 11px;
    background: #fff8fe;
    border: 2px solid #4d3f98;
    box-shadow: 3px 3px 0 rgba(40,30,92,.24);
    padding: 5px;
}

.mini-popup.p1 {
    left: 10px;
    top: 12px;
}

.mini-popup.p2 {
    right: 10px;
    top: 38px;
}

.mini-popup b {
    display: block;
    color: #1c57b8;
}

.mini-popup span {
    display: block;
}

.wallpapers {
    display: grid !important;
    grid-template-columns: repeat(auto-fill,minmax(110px,1fr)) !important;
    gap: 7px !important;
    padding: 10px !important;
}

.wallpapers button {
    min-height: 30px !important;
    border: 2px solid #51479b;
    border-right-color: #fff;
    border-bottom-color: #fff;
    background: linear-gradient(#fff,#e5fbff 46%,#8bdfff 47%,#5fc5ff);
    font-size: 12px;
}

.wallpapers button.active {
    background: linear-gradient(#fff,#ffd8ef 46%,#ff9ed8 47%,#ff70c7);
}

.update-item {
    display: grid !important;
    grid-template-columns: 42px minmax(0,1fr) !important;
    gap: 8px;
    padding: 8px !important;
    margin: 0 0 8px;
    border: 1px solid rgba(77,63,152,.42);
    background: rgba(255,255,255,.52);
}

.update-item p {
    margin: .2em 0 0;
}

.feature-stickers {
    grid-template-columns: repeat(3,minmax(0,1fr)) !important;
    gap: 8px !important;
    padding: 10px !important;
}

.feature-stickers button {
    height: 84px !important;
    padding: 5px !important;
}

.feature-stickers img {
    width: 52px !important;
    height: 52px !important;
}

.status-card p {
    display: flex;
    justify-content: space-between;
    margin: 7px 0;
    padding: 4px 6px;
    background: rgba(255,255,255,.45);
    border: 1px solid rgba(77,63,152,.28);
}

.badges,
.tiny-badges {
    grid-template-columns: 1fr 1fr !important;
    gap: 5px !important;
}

.badges img,
.tiny-badges img {
    width: 88px !important;
    height: 31px !important;
}

blockquote {
    font-size: 14px;
    min-height: 80px;
    margin: 10px;
    padding: 12px;
    border-left: 5px solid var(--v10-pink);
    background: rgba(255,255,255,.68);
    overflow-wrap: anywhere;
}

.internet-assets .tiny-note {
    margin: 12px 14px 0;
}

.internet-grid {
    display: grid;
    grid-template-columns: repeat(6,minmax(0,1fr));
    gap: 10px;
    padding: 14px;
}

.internet-grid figure {
    margin: 0;
    border: 2px solid #5b4ca0;
    border-right-color: #fff;
    border-bottom-color: #fff;
    background: rgba(255,255,255,.64);
    padding: 5px;
    box-shadow: 3px 3px 0 rgba(51,39,117,.16);
    min-width: 0;
}

.internet-grid img {
    width: 100%;
    aspect-ratio: 1/1;
    object-fit: cover;
    border: 1px solid rgba(77,63,152,.45);
}

.internet-grid figcaption {
    font-size: 11px;
    font-weight: bold;
    text-align: center;
    margin-top: 5px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.overload-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 12px !important;
    padding: 14px !important;
    align-items: start !important;
}

.angel-console,
.pill-window,
.popup-stack>div {
    padding: 10px !important;
    background: rgba(255,255,255,.63) !important;
    border: 2px solid #5b4ca0 !important;
    box-shadow: inset 1px 1px #fff,3px 3px 0 rgba(51,39,117,.16) !important;
    grid-area: 1 / 1 / 2 / 3;
}

.angel-console h3,
.pill-window h3 {
    margin: 0 0 6px !important;
    font-size: 17px !important;
}

.angel-console p,
.pill-window p {
    font-size: 12px;
    margin: 0 0 8px;
}

.meter {
    display: grid !important;
    grid-template-columns: 96px minmax(0,1fr) 38px !important;
    gap: 7px !important;
    align-items: center;
    margin: 8px 0 !important;
    font-size: 12px;
}

.meter span {
    height: 12px;
    background: #21194f;
    border: 1px solid #5b4ca0;
    overflow: hidden;
}

.meter i {
    display: block;
    height: 100%;
    background: linear-gradient(90deg,#ff91cf,#fff275,#76edff);
}

.pill-tray {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
}

.pill-tray button {
    grid-template-columns: 52px minmax(0,1fr) !important;
    min-height: 52px !important;
    padding: 6px !important;
    overflow: hidden !important;
    background: rgba(255,255,255,.72) !important;
}

.pill-tray img {
    width: 48px !important;
    max-height: 32px;
    object-fit: contain;
}

.pill-tray span b {
    font-size: 11px !important;
}

.pill-tray span small {
    display: none !important;
}

.clean-popups {
    grid-column: 1 / -1 !important;
    display: grid !important;
    grid-template-columns: repeat(3,minmax(0,1fr)) !important;
    gap: 8px !important;
}

.popup-stack>div {
    min-height: 64px !important;
    padding: 0 !important;
}

.popup-stack b {
    display: block;
    font-size: 12px;
    background: linear-gradient(90deg,#ff91cf,#fff5a8,#76edff) !important;
    color: #2c236a !important;
    text-shadow: none !important;
    padding: 5px 7px !important;
}

.popup-stack p {
    font-size: 12px;
    margin: 7px !important;
}

.preview-wall {
    display: grid !important;
    grid-template-columns: repeat(3,minmax(0,1fr)) !important;
    gap: 10px !important;
    padding: 12px !important;
}

.preview-wall img {
    width: 100%;
    height: 150px;
    object-fit: cover;
    border: 2px solid #5b4ca0;
    border-right-color: #fff;
    border-bottom-color: #fff;
    background: white;
}

.sticker-grid {
    grid-template-columns: repeat(auto-fill,minmax(130px,1fr)) !important;
    gap: 10px !important;
}

.sticker-card {
    min-width: 0;
    overflow: hidden;
}

.sticker-card small,
.link-card small,
.clip small {
    overflow-wrap: anywhere;
}

.links-grid {
    grid-template-columns: repeat(auto-fit,minmax(190px,1fr)) !important;
}

.guest-layout {
    display: grid !important;
    grid-template-columns: 300px minmax(0,1fr) !important;
    gap: 14px !important;
}

textarea,
input {
    max-width: 100%;
}

.xp-button,
.section-tools button,
.sticker-actions button,
.clip button,
.start-menu button,
.address-row button,
.wallpapers button,
.chips button,
.nav-tabs a,
.link-card,
.pill-tray button {
    border: 2px solid #3f3a8c !important;
    border-right-color: #fff !important;
    border-bottom-color: #fff !important;
    box-shadow: inset 1px 1px 0 #fff,2px 2px 0 rgba(39,31,104,.22) !important;
}

.xp-button:active,
.section-tools button:active,
.sticker-actions button:active,
.clip button:active,
.start-menu button:active,
.address-row button:active,
.wallpapers button:active,
.chips button:active,
.nav-tabs a:active,
.link-card:active,
.pill-tray button:active,
.pressing {
    transform: translate(2px,2px) !important;
    border-color: #fff !important;
    border-right-color: #3f3a8c !important;
    border-bottom-color: #3f3a8c !important;
    box-shadow: inset 2px 2px 0 rgba(38,29,102,.28),1px 1px 0 rgba(39,31,104,.12) !important;
}

.taskbar .task-item {
    max-width: 52vw;
}

@media (max-width:980px){
    .desktop-grid {
        grid-template-columns: 1fr !important;
    }

    .left-dock .icons {
        grid-template-columns: repeat(4,minmax(0,1fr)) !important;
    }

    .icons a {
        display: grid;
        grid-template-columns: 1fr;
        place-items: center;
        text-align: center;
    }

    .right-dock {
        grid-template-columns: repeat(3,minmax(0,1fr)) !important;
    }

    .internet-grid {
        grid-template-columns: repeat(3,minmax(0,1fr));
    }

    .clean-popups {
        grid-template-columns: 1fr !important;
    }

    .guest-layout {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width:680px){
    body {
        padding: 8px 8px 56px !important;
    }

    .logo-row {
        grid-template-columns: 1fr !important;
        text-align: center;
        justify-items: center;
    }

    .spark-gif {
        display: none;
    }

    .hero-content,
    .updates-row,
    .split-row,
    .overload-grid,
    .right-dock {
        grid-template-columns: 1fr !important;
    }

    .hero-art {
        min-height: 230px !important;
    }

    .internet-grid,
    .preview-wall {
        grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    }

    .left-dock .icons {
        grid-template-columns: repeat(3,minmax(0,1fr)) !important;
    }

    .feature-stickers {
        grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    }

    .pill-tray {
        grid-template-columns: 1fr 1fr !important;
    }
}

@media (max-width:430px){
    .internet-grid,
    .preview-wall,
    .pill-tray {
        grid-template-columns: 1fr !important;
    }

    .left-dock .icons {
        grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    }

    .address-row {
        grid-template-columns: 28px 28px 28px minmax(0,1fr) !important;
    }

    .address-row .go {
        display: none;
    }
}