#desktop-wallpaper { position: fixed; inset: 0 0 var(--taskbar-h); pointer-events: none; background-position: center; background-size: cover; }
#desktop-wallpaper[data-effect="tile"], #wallpaper-preview[data-effect="tile"] { background-size: 120px auto; background-repeat: repeat; }
#desktop-wallpaper[data-effect="flip"], #wallpaper-preview[data-effect="flip"] { transform: rotate(180deg); }
#desktop-wallpaper[data-effect="fried"], #wallpaper-preview[data-effect="fried"] { filter: saturate(6) contrast(2) hue-rotate(55deg); }
.desktop-symbol { display: grid; place-items: center; width: 32px; height: 32px; font-size: 27px; line-height: 1; }
.browser-toolbar { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; padding: 7px; border-bottom: 1px solid #808080; }
.browser-toolbar .btn { min-width: 35px; text-decoration: none; }
.browser-toolbar input { flex: 1; min-width: 150px; width: auto; }
#browser-frame { display: block; width: 100%; height: min(55vh, 500px); border: 2px inset #ddd; background: white; }
.internet-home { min-height: 300px; padding: 36px 24px; background: #fff; color: #000080; font-family: Georgia, serif; }
.internet-home h2 { font-size: 28px; }
.bowser-castle { height: 240px; position: relative; overflow: hidden; border: 2px inset #eee; background: repeating-linear-gradient(0deg, #302d3b 0 29px, #191821 30px 32px); border-bottom: 12px solid #ec6423; }
.bowser-castle img { height: 100%; width: 100%; object-fit: contain; }
.bowser-flame { position: absolute; top: 40%; left: 12%; font-size: 75px; opacity: 0; transform: scale(.3); transition: .2s; }
.breathing .bowser-flame { opacity: 1; transform: scale(1.4) rotate(-35deg); }
#wallpaper-preview { height: 150px; background: #008080 center / cover; display: grid; place-items: center; border: 4px inset #eee; color: white; text-shadow: 1px 1px black; }
#wallpaper-file { max-width: 100%; }
#opposite-results { max-height: 330px; overflow: auto; padding: 3px; background: white; box-shadow: var(--sink); }
.opposite-result { display: flex; flex-direction: column; gap: 3px; width: 100%; border: 0; border-bottom: 1px dotted #ccc; padding: 8px; text-align: left; background: white; font: inherit; cursor: pointer; }
.opposite-result span { font-size: 11px; color: #555; }
.opposite-result:hover, .opposite-result:focus-visible { background: #000080; color: white; }
.opposite-result:hover span, .opposite-result:focus-visible span { color: white; }
@media (max-width: 820px) { .shortcuts { max-height: none; flex-wrap: wrap; } }
@media (prefers-reduced-motion: reduce) { .bowser-flame { transition: none; } }
