/* The desktop stays still; only Surfr's document viewport scrolls. */
html{height:100%;overflow:hidden;scroll-behavior:auto;overscroll-behavior:none}
body{height:100vh;height:100dvh;min-height:0;overflow:hidden;overscroll-behavior:none;padding-bottom:55px}
.desktop-shell{height:100%;min-height:0;width:100%;display:flex;flex-direction:column;overflow:hidden}
.browser-title,.browser-menu,.browser-address,.surfr-statusbar{flex-shrink:0}
.browser-viewport{flex:1 1 0;min-height:0;min-width:0;overflow-x:hidden;overflow-y:scroll;overscroll-behavior:contain;scrollbar-gutter:stable;scroll-padding-top:12px;background:#25282d;-webkit-overflow-scrolling:touch;scrollbar-color:#647080 #242a32;scrollbar-width:auto}
.browser-viewport:focus-visible{outline:1px dotted #bac8dc;outline-offset:-3px}
.browser-viewport::-webkit-scrollbar{width:18px;height:18px}
.browser-viewport::-webkit-scrollbar-track{background:repeating-conic-gradient(#3b424b 0% 25%,#303640 0% 50%) 0 0/4px 4px;border-left:1px solid #151a21}
.browser-viewport::-webkit-scrollbar-thumb{background:linear-gradient(90deg,#798594,#556171);border:2px solid;border-color:#abb5c2 #1a2029 #1a2029 #abb5c2;min-height:35px;border-radius:0}
.browser-viewport::-webkit-scrollbar-thumb:hover{background:#7e8d9f}
.browser-viewport::-webkit-scrollbar-button:single-button{display:block;height:18px;background-color:#657181;border:2px outset #a2acb9;background-repeat:no-repeat;background-position:center;background-size:8px 5px}
.browser-viewport::-webkit-scrollbar-button:single-button:vertical:decrement{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5'%3E%3Cpath d='M0 5L4 0L8 5Z' fill='%23141d29'/%3E%3C/svg%3E")}
.browser-viewport::-webkit-scrollbar-button:single-button:vertical:increment{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5'%3E%3Cpath d='M0 0L4 5L8 0Z' fill='%23141d29'/%3E%3C/svg%3E")}
.surfr-statusbar{display:flex;align-items:center;gap:3px;padding:3px;background:#383f48;border-top:1px solid #798391;font:12px/1.5 var(--period-ui);color:#c0c8d4;min-height:27px}
.surfr-statusbar>span{padding:1px 8px;border:1px solid;border-color:#202630 #6b7685 #6b7685 #202630}
.surfr-statusbar>span:first-child{flex:1}.surfr-statusbar>span:last-child{border:0;padding:0 2px;color:#8d9cac}
.browser-title>span:first-child{min-width:0}.browser-title{gap:8px}.window-buttons{flex-shrink:0}
@media(max-width:700px){body{padding:7px 5px 45px}.desktop-shell{height:100%;border-radius:5px 5px 0 0}.browser-title{min-height:34px}.browser-title>span:first-child{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.browser-title img{flex-shrink:0}.browser-viewport::-webkit-scrollbar{width:15px}.browser-viewport::-webkit-scrollbar-button:single-button{height:16px}.surfr-statusbar{font-size:12px;min-height:25px}.surfr-statusbar>span{padding:1px 5px}.surfr-statusbar>span:nth-child(2){display:none}}
@media(max-height:500px){body{padding-top:5px;padding-bottom:43px}.browser-title{min-height:26px;height:26px}.browser-menu{height:23px}.browser-address{padding-block:3px}.surfr-statusbar{min-height:23px;font-size:12px}}
