/*! 98.css v0.1.21 - https://github.com/jdan/98.css */@font-face{font-family:"Pixelated MS Sans Serif";font-style:normal;font-weight:400;src:url(/assets/ms_sans_serif-C3pax6mQ.woff) format("woff");src:url(/assets/ms_sans_serif-Du8rjN1q.woff2) format("woff2")}@font-face{font-family:"Pixelated MS Sans Serif";font-style:normal;font-weight:700;src:url(/assets/ms_sans_serif_bold-B8yxhAcs.woff) format("woff");src:url(/assets/ms_sans_serif_bold-D5dpRRHG.woff2) format("woff2")}body{color:#222;font-family:Arial;font-size:12px}.title-bar,.window,button,input,label,legend,li[role=tab],option,select,table,textarea,ul.tree-view{-webkit-font-smoothing:none;font-family:"Pixelated MS Sans Serif",Arial;font-size:11px}h1{font-size:5rem}h2{font-size:2.5rem}h3{font-size:2rem}h4{font-size:1.5rem}u{border-bottom:.5px solid #222;text-decoration:none}button,input[type=reset],input[type=submit]{background:silver;border:none;border-radius:0;box-shadow:inset -1px -1px #0a0a0a,inset 1px 1px #fff,inset -2px -2px grey,inset 2px 2px #dfdfdf;box-sizing:border-box;color:transparent;min-height:23px;min-width:75px;padding:0 12px;text-shadow:0 0 #222}button.default,input[type=reset].default,input[type=submit].default{box-shadow:inset -2px -2px #0a0a0a,inset 1px 1px #0a0a0a,inset 2px 2px #fff,inset -3px -3px grey,inset 3px 3px #dfdfdf}.vertical-bar{background:silver;box-shadow:inset -1px -1px #0a0a0a,inset 1px 1px #fff,inset -2px -2px grey,inset 2px 2px #dfdfdf;height:20px;width:4px}button:not(:disabled):active,input[type=reset]:not(:disabled):active,input[type=submit]:not(:disabled):active{box-shadow:inset -1px -1px #fff,inset 1px 1px #0a0a0a,inset -2px -2px #dfdfdf,inset 2px 2px grey;text-shadow:1px 1px #222}button.default:not(:disabled):active,input[type=reset].default:not(:disabled):active,input[type=submit].default:not(:disabled):active{box-shadow:inset 2px 2px #0a0a0a,inset -1px -1px #0a0a0a,inset -2px -2px #fff,inset 3px 3px grey,inset -3px -3px #dfdfdf}@media (not(hover)){button:not(:disabled):hover,input[type=reset]:not(:disabled):hover,input[type=submit]:not(:disabled):hover{box-shadow:inset -1px -1px #fff,inset 1px 1px #0a0a0a,inset -2px -2px #dfdfdf,inset 2px 2px grey}}button:focus,input[type=reset]:focus,input[type=submit]:focus{outline:1px dotted #000;outline-offset:-4px}button::-moz-focus-inner,input[type=reset]::-moz-focus-inner,input[type=submit]::-moz-focus-inner{border:0}:disabled,:disabled+label,input[readonly],input[readonly]+label{color:grey}:disabled+label,button:disabled,input[type=reset]:disabled,input[type=submit]:disabled{text-shadow:1px 1px 0 #fff}.window{background:silver;box-shadow:inset -1px -1px #0a0a0a,inset 1px 1px #dfdfdf,inset -2px -2px grey,inset 2px 2px #fff;padding:3px}.title-bar{align-items:center;background:linear-gradient(90deg,navy,#1084d0);display:flex;justify-content:space-between;padding:3px 2px 3px 3px}.title-bar.inactive{background:linear-gradient(90deg,grey,#b5b5b5)}.title-bar-text{color:#fff;font-weight:700;letter-spacing:0;margin-right:24px}.title-bar-controls{display:flex}.title-bar-controls button{display:block;min-height:14px;min-width:16px;padding:0}.title-bar-controls button:active{padding:0}.title-bar-controls button:focus{outline:none}.title-bar-controls button[aria-label=Minimize],.title-bar-controls button[aria-label].minimize{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='6' height='2' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23000' d='M0 0h6v2H0z'/%3E%3C/svg%3E");background-position:bottom 3px left 4px;background-repeat:no-repeat}.title-bar-controls button[aria-label=Maximize],.title-bar-controls button[aria-label].maximize{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='9' height='9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9 0H0v9h9V0zM8 2H1v6h7V2z' fill='%23000'/%3E%3C/svg%3E");background-position:top 2px left 3px;background-repeat:no-repeat}.title-bar-controls button[aria-label=Maximize]:disabled,.title-bar-controls button[aria-label].maximize:disabled{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='10' height='10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10 1H1v9h9V1zM9 3H2v6h7V3z' fill='%23fff'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9 0H0v9h9V0zM8 2H1v6h7V2z' fill='gray'/%3E%3C/svg%3E");background-position:top 2px left 3px;background-repeat:no-repeat}.title-bar-controls button[aria-label=Restore],.title-bar-controls button[aria-label].restore{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='8' height='9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23000' d='M2 0h6v2H2zM7 2h1v4H7zM2 2h1v1H2zM6 5h1v1H6zM0 3h6v2H0zM5 5h1v4H5zM0 5h1v4H0zM1 8h4v1H1z'/%3E%3C/svg%3E");background-position:top 2px left 3px;background-repeat:no-repeat}.title-bar-controls button[aria-label=Help],.title-bar-controls button[aria-label].help{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='6' height='9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23000' d='M0 1h2v2H0zM1 0h4v1H1zM4 1h2v2H4zM3 3h2v1H3zM2 4h2v2H2zM2 7h2v2H2z'/%3E%3C/svg%3E");background-position:top 2px left 5px;background-repeat:no-repeat}.title-bar-controls button[aria-label=Close],.title-bar-controls button[aria-label].close{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='8' height='7' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 0h2v1h1v1h2V1h1V0h2v1H7v1H6v1H5v1h1v1h1v1h1v1H6V6H5V5H3v1H2v1H0V6h1V5h1V4h1V3H2V2H1V1H0V0z' fill='%23000'/%3E%3C/svg%3E");background-position:top 3px left 4px;background-repeat:no-repeat;margin-left:2px}.status-bar{gap:1px;display:flex;margin:0 1px}.status-bar-field{box-shadow:inset -1px -1px #dfdfdf,inset 1px 1px grey;flex-grow:1;margin:0;padding:2px 3px}.window-body{margin:8px}fieldset{border-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='5' height='5' fill='gray' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 0h5v5H0V2h2v1h1V2H0' fill='%23fff'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 0h4v4H0V1h1v2h2V1H0'/%3E%3C/svg%3E") 2;margin:0;padding:10px;padding-block-start:8px}legend{background:silver}.field-row{align-items:center;display:flex}[class^=field-row]+[class^=field-row]{margin-top:6px}.field-row>*+*{margin-left:6px}.field-row-stacked{display:flex;flex-direction:column}.field-row-stacked *+*{margin-top:6px}label{align-items:center;display:inline-flex;user-select:none}input[type=checkbox],input[type=radio]{appearance:none;-webkit-appearance:none;-moz-appearance:none;background:0;border:none;margin:0;opacity:0;position:fixed}input[type=checkbox]+label,input[type=radio]+label{line-height:13px}input[type=radio]+label{margin-left:18px;position:relative}input[type=radio]+label:before{background:url("data:image/svg+xml;charset=utf-8,%3Csvg width='12' height='12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8 0H4v1H2v1H1v2H0v4h1v2h1V8H1V4h1V2h2V1h4v1h2V1H8V0z' fill='gray'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8 1H4v1H2v2H1v4h1v1h1V8H2V4h1V3h1V2h4v1h2V2H8V1z' fill='%23000'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9 3h1v1H9V3zm1 5V4h1v4h-1zm-2 2V9h1V8h1v2H8zm-4 0v1h4v-1H4zm0 0V9H2v1h2z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M11 2h-1v2h1v4h-1v2H8v1H4v-1H2v1h2v1h4v-1h2v-1h1V8h1V4h-1V2z' fill='%23fff'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4 2h4v1h1v1h1v4H9v1H8v1H4V9H3V8H2V4h1V3h1V2z' fill='%23fff'/%3E%3C/svg%3E");content:"";display:inline-block;height:12px;left:-18px;margin-right:6px;position:absolute;top:0;width:12px}input[type=radio]:active+label:before{background:url("data:image/svg+xml;charset=utf-8,%3Csvg width='12' height='12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8 0H4v1H2v1H1v2H0v4h1v2h1V8H1V4h1V2h2V1h4v1h2V1H8V0z' fill='gray'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8 1H4v1H2v2H1v4h1v1h1V8H2V4h1V3h1V2h4v1h2V2H8V1z' fill='%23000'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9 3h1v1H9V3zm1 5V4h1v4h-1zm-2 2V9h1V8h1v2H8zm-4 0v1h4v-1H4zm0 0V9H2v1h2z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M11 2h-1v2h1v4h-1v2H8v1H4v-1H2v1h2v1h4v-1h2v-1h1V8h1V4h-1V2z' fill='%23fff'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4 2h4v1h1v1h1v4H9v1H8v1H4V9H3V8H2V4h1V3h1V2z' fill='silver'/%3E%3C/svg%3E")}input[type=radio]:checked+label:after{background:url("data:image/svg+xml;charset=utf-8,%3Csvg width='4' height='4' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M3 0H1v1H0v2h1v1h2V3h1V1H3V0z' fill='%23000'/%3E%3C/svg%3E");content:"";display:block;height:4px;left:-14px;position:absolute;top:4px;width:4px}input[type=checkbox]:focus+label,input[type=radio]:focus+label{outline:1px dotted #000}input[type=radio][disabled]+label:before{background:url("data:image/svg+xml;charset=utf-8,%3Csvg width='12' height='12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8 0H4v1H2v1H1v2H0v4h1v2h1V8H1V4h1V2h2V1h4v1h2V1H8V0z' fill='gray'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8 1H4v1H2v2H1v4h1v1h1V8H2V4h1V3h1V2h4v1h2V2H8V1z' fill='%23000'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9 3h1v1H9V3zm1 5V4h1v4h-1zm-2 2V9h1V8h1v2H8zm-4 0v1h4v-1H4zm0 0V9H2v1h2z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M11 2h-1v2h1v4h-1v2H8v1H4v-1H2v1h2v1h4v-1h2v-1h1V8h1V4h-1V2z' fill='%23fff'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4 2h4v1h1v1h1v4H9v1H8v1H4V9H3V8H2V4h1V3h1V2z' fill='silver'/%3E%3C/svg%3E")}input[type=radio][disabled]:checked+label:after{background:url("data:image/svg+xml;charset=utf-8,%3Csvg width='4' height='4' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M3 0H1v1H0v2h1v1h2V3h1V1H3V0z' fill='gray'/%3E%3C/svg%3E")}input[type=checkbox]+label{margin-left:19px;position:relative}input[type=checkbox]+label:before{background:#fff;box-shadow:inset -1px -1px #fff,inset 1px 1px grey,inset -2px -2px #dfdfdf,inset 2px 2px #0a0a0a;content:"";display:inline-block;height:13px;left:-19px;margin-right:6px;position:absolute;width:13px}input[type=checkbox]:active+label:before{background:silver}input[type=checkbox]:checked+label:after{background:url("data:image/svg+xml;charset=utf-8,%3Csvg width='7' height='7' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M7 0H6v1H5v1H4v1H3v1H2V3H1V2H0v3h1v1h1v1h1V6h1V5h1V4h1V3h1V0z' fill='%23000'/%3E%3C/svg%3E");content:"";display:block;height:7px;left:-16px;position:absolute;width:7px}input[type=checkbox][disabled]+label:before{background:silver}input[type=checkbox][disabled]:checked+label:after{background:url("data:image/svg+xml;charset=utf-8,%3Csvg width='7' height='7' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M7 0H6v1H5v1H4v1H3v1H2V3H1V2H0v3h1v1h1v1h1V6h1V5h1V4h1V3h1V0z' fill='gray'/%3E%3C/svg%3E")}input[type=email],input[type=number],input[type=password],input[type=search],input[type=tel],input[type=text],input[type=url]{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;border-radius:0}input[type=email],input[type=number],input[type=password],input[type=search],input[type=tel],input[type=text],input[type=url],select{background-color:#fff;box-shadow:inset -1px -1px #fff,inset 1px 1px grey,inset -2px -2px #dfdfdf,inset 2px 2px #0a0a0a;box-sizing:border-box;padding:3px 4px}select,textarea{border:none}textarea{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:#fff;border-radius:0;box-shadow:inset -1px -1px #fff,inset 1px 1px grey,inset -2px -2px #dfdfdf,inset 2px 2px #0a0a0a;box-sizing:border-box;padding:3px 4px}input[type=email],input[type=password],input[type=search],input[type=tel],input[type=text],input[type=url],select{height:21px}input[type=number]{height:22px}input[type=search]::-ms-clear,input[type=search]::-ms-reveal{display:none;height:0;width:0}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration,input[type=search]::-webkit-search-results-button,input[type=search]::-webkit-search-results-decoration{display:none}input[type=email],input[type=number],input[type=password],input[type=search],input[type=tel],input[type=text],input[type=url]{line-height:2}input[type=email]:disabled,input[type=email]:read-only,input[type=number]:disabled,input[type=number]:read-only,input[type=password]:disabled,input[type=password]:read-only,input[type=search]:disabled,input[type=search]:read-only,input[type=tel]:disabled,input[type=tel]:read-only,input[type=text]:disabled,input[type=text]:read-only,input[type=url]:disabled,input[type=url]:read-only,textarea:disabled{background-color:silver}select{appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15 0H0v16h1V1h14V0z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M2 1H1v14h1V2h12V1H2z' fill='%23fff'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M16 17H0v-1h15V0h1v17z' fill='%23000'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15 1h-1v14H1v1h14V1z' fill='gray'/%3E%3Cpath fill='silver' d='M2 2h12v13H2z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M11 6H4v1h1v1h1v1h1v1h1V9h1V8h1V7h1V6z' fill='%23000'/%3E%3C/svg%3E");background-position:top 2px right 2px;background-repeat:no-repeat;border-radius:0;padding-right:32px;position:relative}input[type=email]:focus,input[type=number]:focus,input[type=password]:focus,input[type=search]:focus,input[type=tel]:focus,input[type=text]:focus,input[type=url]:focus,select:focus,textarea:focus{outline:none}input[type=range]{-webkit-appearance:none;background:transparent;width:100%}input[type=range]:focus{outline:none}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:url("data:image/svg+xml;charset=utf-8,%3Csvg width='11' height='21' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 0v16h2v2h2v2h1v-1H3v-2H1V1h9V0z' fill='%23fff'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M1 1v15h1v1h1v1h1v1h2v-1h1v-1h1v-1h1V1z' fill='%23C0C7C8'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9 1h1v15H8v2H6v2H5v-1h2v-2h2z' fill='%2387888F'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10 0h1v16H9v2H7v2H5v1h1v-2h2v-2h2z' fill='%23000'/%3E%3C/svg%3E");border:none;box-shadow:none;height:21px;transform:translateY(-8px);width:11px}input[type=range].has-box-indicator::-webkit-slider-thumb{background:url("data:image/svg+xml;charset=utf-8,%3Csvg width='11' height='21' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 0v20h1V1h9V0z' fill='%23fff'/%3E%3Cpath fill='%23C0C7C8' d='M1 1h8v18H1z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9 1h1v19H1v-1h8z' fill='%2387888F'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10 0h1v21H0v-1h10z' fill='%23000'/%3E%3C/svg%3E");transform:translateY(-10px)}input[type=range]::-moz-range-thumb{background:url("data:image/svg+xml;charset=utf-8,%3Csvg width='11' height='21' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 0v16h2v2h2v2h1v-1H3v-2H1V1h9V0z' fill='%23fff'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M1 1v15h1v1h1v1h1v1h2v-1h1v-1h1v-1h1V1z' fill='%23C0C7C8'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9 1h1v15H8v2H6v2H5v-1h2v-2h2z' fill='%2387888F'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10 0h1v16H9v2H7v2H5v1h1v-2h2v-2h2z' fill='%23000'/%3E%3C/svg%3E");border:0;border-radius:0;height:21px;transform:translateY(2px);width:11px}input[type=range].has-box-indicator::-moz-range-thumb{background:url("data:image/svg+xml;charset=utf-8,%3Csvg width='11' height='21' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 0v20h1V1h9V0z' fill='%23fff'/%3E%3Cpath fill='%23C0C7C8' d='M1 1h8v18H1z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9 1h1v19H1v-1h8z' fill='%2387888F'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10 0h1v21H0v-1h10z' fill='%23000'/%3E%3C/svg%3E");transform:translateY(0)}input[type=range]::-webkit-slider-runnable-track{background:#000;border-bottom:1px solid grey;border-right:1px solid grey;box-shadow:1px 0 0 #fff,1px 1px 0 #fff,0 1px 0 #fff,-1px 0 0 #a9a9a9,-1px -1px 0 #a9a9a9,0 -1px 0 #a9a9a9,-1px 1px 0 #fff,1px -1px #a9a9a9;box-sizing:border-box;height:2px;width:100%}input[type=range]::-moz-range-track{background:#000;border-bottom:1px solid grey;border-right:1px solid grey;box-shadow:1px 0 0 #fff,1px 1px 0 #fff,0 1px 0 #fff,-1px 0 0 #a9a9a9,-1px -1px 0 #a9a9a9,0 -1px 0 #a9a9a9,-1px 1px 0 #fff,1px -1px #a9a9a9;box-sizing:border-box;height:2px;width:100%}.is-vertical{display:inline-block;height:150px;transform:translateY(50%);width:4px}.is-vertical>input[type=range]{height:4px;margin:0 16px 0 10px;transform:rotate(270deg) translateX(calc(-50% + 8px));transform-origin:left;width:150px}.is-vertical>input[type=range]::-webkit-slider-runnable-track{border-bottom:1px solid grey;border-left:1px solid grey;border-right:0;box-shadow:-1px 0 0 #fff,-1px 1px 0 #fff,0 1px 0 #fff,1px 0 0 #a9a9a9,1px -1px 0 #a9a9a9,0 -1px 0 #a9a9a9,1px 1px 0 #fff,-1px -1px #a9a9a9}.is-vertical>input[type=range]::-moz-range-track{border-bottom:1px solid grey;border-left:1px solid grey;border-right:0;box-shadow:-1px 0 0 #fff,-1px 1px 0 #fff,0 1px 0 #fff,1px 0 0 #a9a9a9,1px -1px 0 #a9a9a9,0 -1px 0 #a9a9a9,1px 1px 0 #fff,-1px -1px #a9a9a9}.is-vertical>input[type=range]::-webkit-slider-thumb{transform:translateY(-8px) scaleX(-1)}.is-vertical>input[type=range].has-box-indicator::-webkit-slider-thumb{transform:translateY(-10px) scaleX(-1)}.is-vertical>input[type=range]::-moz-range-thumb{transform:translateY(2px) scaleX(-1)}.is-vertical>input[type=range].has-box-indicator::-moz-range-thumb{transform:translateY(0) scaleX(-1)}select:focus{background-color:navy;color:#fff}select:focus option{background-color:#fff;color:#000}select:active{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 0h16v17H0V0zm1 16h14V1H1v15z' fill='gray'/%3E%3Cpath fill='silver' d='M1 1h14v15H1z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M12 7H5v1h1v1h1v1h1v1h1v-1h1V9h1V8h1V7z' fill='%23000'/%3E%3C/svg%3E")}a{color:#00f}a:focus{outline:1px dotted #00f}ul.tree-view{background:#fff;box-shadow:inset -1px -1px #fff,inset 1px 1px grey,inset -2px -2px #dfdfdf,inset 2px 2px #0a0a0a;display:block;margin:0;padding:6px}ul.tree-view li{list-style-type:none}ul.tree-view a{color:#000;text-decoration:none}ul.tree-view a:focus{background-color:navy;color:#fff}ul.tree-view li,ul.tree-view ul{margin-top:3px}ul.tree-view ul{border-left:1px dotted grey;margin-left:16px;padding-left:16px}ul.tree-view ul>li{position:relative}ul.tree-view ul>li:before{border-bottom:1px dotted grey;content:"";display:block;left:-16px;position:absolute;top:6px;width:12px}ul.tree-view ul>li:last-child:after{background:#fff;bottom:0;content:"";display:block;left:-20px;position:absolute;top:7px;width:8px}ul.tree-view details{margin-top:0}ul.tree-view details[open] summary{margin-bottom:0}ul.tree-view ul details>summary:before{margin-left:-22px;position:relative;z-index:1}ul.tree-view details>summary:before{background-color:#fff;border:1px solid grey;content:"+";display:block;float:left;height:9px;line-height:8px;margin-right:5px;padding-left:1px;text-align:center;width:8px}ul.tree-view details[open]>summary:before{content:"-"}ul.tree-view details>summary::-webkit-details-marker,ul.tree-view details>summary::marker{content:""}pre{background:#fff;box-shadow:inset -1px -1px #fff,inset 1px 1px grey,inset -2px -2px #dfdfdf,inset 2px 2px #0a0a0a;display:block;margin:0;padding:12px 8px}code,code *{font-family:monospace}summary:focus{outline:1px dotted #000}::-webkit-scrollbar{width:16px}::-webkit-scrollbar:horizontal{height:17px}::-webkit-scrollbar-corner{background:#dfdfdf}::-webkit-scrollbar-track{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='2' height='2' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M1 0H0v1h1v1h1V1H1V0z' fill='silver'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M2 0H1v1H0v1h1V1h1V0z' fill='%23fff'/%3E%3C/svg%3E")}::-webkit-scrollbar-thumb{background-color:#dfdfdf;box-shadow:inset -1px -1px #0a0a0a,inset 1px 1px #fff,inset -2px -2px grey,inset 2px 2px #dfdfdf}::-webkit-scrollbar-button:horizontal:end:increment,::-webkit-scrollbar-button:horizontal:start:decrement,::-webkit-scrollbar-button:vertical:end:increment,::-webkit-scrollbar-button:vertical:start:decrement{display:block}::-webkit-scrollbar-button:vertical:start{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15 0H0v16h1V1h14V0z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M2 1H1v14h1V2h12V1H2z' fill='%23fff'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M16 17H0v-1h15V0h1v17z' fill='%23000'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15 1h-1v14H1v1h14V1z' fill='gray'/%3E%3Cpath fill='silver' d='M2 2h12v13H2z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8 6H7v1H6v1H5v1H4v1h7V9h-1V8H9V7H8V6z' fill='%23000'/%3E%3C/svg%3E");height:17px}::-webkit-scrollbar-button:vertical:end{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15 0H0v16h1V1h14V0z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M2 1H1v14h1V2h12V1H2z' fill='%23fff'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M16 17H0v-1h15V0h1v17z' fill='%23000'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15 1h-1v14H1v1h14V1z' fill='gray'/%3E%3Cpath fill='silver' d='M2 2h12v13H2z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M11 6H4v1h1v1h1v1h1v1h1V9h1V8h1V7h1V6z' fill='%23000'/%3E%3C/svg%3E");height:17px}::-webkit-scrollbar-button:horizontal:start{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15 0H0v16h1V1h14V0z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M2 1H1v14h1V2h12V1H2z' fill='%23fff'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M16 17H0v-1h15V0h1v17z' fill='%23000'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15 1h-1v14H1v1h14V1z' fill='gray'/%3E%3Cpath fill='silver' d='M2 2h12v13H2z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9 4H8v1H7v1H6v1H5v1h1v1h1v1h1v1h1V4z' fill='%23000'/%3E%3C/svg%3E");width:16px}::-webkit-scrollbar-button:horizontal:end{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15 0H0v16h1V1h14V0z' fill='%23DFDFDF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M2 1H1v14h1V2h12V1H2z' fill='%23fff'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M16 17H0v-1h15V0h1v17z' fill='%23000'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15 1h-1v14H1v1h14V1z' fill='gray'/%3E%3Cpath fill='silver' d='M2 2h12v13H2z'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M7 4H6v7h1v-1h1V9h1V8h1V7H9V6H8V5H7V4z' fill='%23000'/%3E%3C/svg%3E");width:16px}.window[role=tabpanel]{position:relative;z-index:2}menu[role=tablist]{display:flex;list-style-type:none;margin:0 0 -2px;padding-left:3px;position:relative;text-indent:0}menu[role=tablist]>li{border-top-left-radius:3px;border-top-right-radius:3px;box-shadow:inset -1px 0 #0a0a0a,inset 1px 1px #dfdfdf,inset -2px 0 grey,inset 2px 2px #fff;z-index:1}menu[role=tablist]>li[aria-selected=true]{background-color:silver;margin-left:-3px;margin-top:-2px;padding-bottom:2px;position:relative;z-index:8}menu[role=tablist]>li>a{color:#222;display:block;margin:6px;text-decoration:none}menu[role=tablist]>li[aria-selected=true]>a:focus{outline:none}menu[role=tablist]>li>a:focus{outline:1px dotted #222}menu[role=tablist].multirows>li{flex-grow:1;text-align:center}.sunken-panel{border:2px groove transparent;border-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='5' height='5' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='gray' d='M0 0h4v1H0z'/%3E%3Cpath fill='gray' d='M0 0h1v4H0z'/%3E%3Cpath fill='%230a0a0a' d='M1 1h2v1H1z'/%3E%3Cpath fill='%230a0a0a' d='M1 1h1v2H1z'/%3E%3Cpath fill='%23fff' d='M0 4h5v1H0z'/%3E%3Cpath fill='%23fff' d='M4 0h1v5H4z'/%3E%3Cpath fill='%23dfdfdf' d='M3 1h1v3H3z'/%3E%3Cpath fill='%23dfdfdf' d='M1 3h3v1H1z'/%3E%3C/svg%3E") 2;box-sizing:border-box;overflow:auto}.sunken-panel,table{background-color:#fff}table{border-collapse:collapse;position:relative;text-align:left;white-space:nowrap}table>thead>tr>*{background:silver;box-shadow:inset -1px -1px #0a0a0a,inset 1px 1px #fff,inset -2px -2px grey,inset 2px 2px #dfdfdf;box-sizing:border-box;font-weight:400;height:17px;padding:0 6px;position:sticky;top:0}table.interactive>tbody>tr{cursor:pointer}table>tbody>tr.highlighted{background-color:navy;color:#fff}table>tbody>tr>*{height:14px;padding:0 6px}.progress-indicator{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;border-radius:0;box-shadow:inset -2px -2px #dfdfdf,inset 2px 2px grey;box-sizing:border-box;height:32px;padding:4px;position:relative}.progress-indicator>.progress-indicator-bar{background-color:navy;display:block;height:100%}.progress-indicator.segmented>.progress-indicator-bar{background-color:transparent;background-image:linear-gradient(90deg,navy 16px,transparent 0 2px);background-repeat:repeat;background-size:18px 100%;width:100%}.field-border{background:#fff}.field-border,.field-border-disabled{box-shadow:inset -1px -1px #fff,inset 1px 1px grey,inset -2px -2px #dfdfdf,inset 2px 2px #0a0a0a;padding:2px}.field-border-disabled{background:silver}.status-field-border{background:silver;box-shadow:inset -1px -1px #dfdfdf,inset 1px 1px grey;padding:1px}

:root {
  color-scheme: only light;

    --surface: #c0c0c0;
  --surface-light: #dfdfdf;
  --surface-hilight: #ffffff;
  --surface-shadow: #808080;
  --surface-dark: #000000;

    --ink-dim: #333333;

    --taskbar-h: 34px;

    --safe-l: env(safe-area-inset-left, 0px);
  --safe-r: env(safe-area-inset-right, 0px);
  --safe-b: env(safe-area-inset-bottom, 0px);
  --taskbar-total: calc(var(--taskbar-h) + var(--safe-b));

    --titlebar-active: linear-gradient(90deg, #000080, #1084d0);
}

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

html[data-home-screen='1'],
html[data-home-screen='1'] body {
  overscroll-behavior: none;
}

html[data-home-screen='1'],
html[data-home-screen='1'] body {
  overflow: hidden;
}

html[data-home-screen='1'] .window-body {
  overscroll-behavior: contain;
}

html,
body,
#root {
  height: 100%;
    height: 100dvh;
  margin: 0;
  padding: 0;
}

body {
  background: #008080;
  color: #000000;
  font-family: 'Pixelated MS Sans Serif', 'MS Sans Serif', Tahoma, Geneva, sans-serif;
  font-size: 11px;
}

.window,
.window-body,
button,
input,
select,
textarea,
label,
.status-bar {
  font-family: 'Pixelated MS Sans Serif', 'MS Sans Serif', Tahoma, Geneva, sans-serif;
  font-size: 11px;
}

input,
select,
textarea,
option {
  color: #000000;
}

.window,
.window-body,
label,
.status-bar,
.status-bar-field {
  color: #000000;
}

canvas {
  background-color: #c0c0c0;
}

.starfield {
  background-color: #000000;
}

.desktop.launching, .desktop.launching * { cursor: wait; }

.desktop {
  position: relative;
  min-height: 100%;
  height: 100%;
  height: 100dvh;
  background: #008080;
  box-sizing: border-box;
  overflow: hidden;
}


.center-stack {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: var(--taskbar-total);
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 8vh;
  pointer-events: none;
  z-index: 20;
}

.center-stack > * {
  pointer-events: auto;
}

.dialog-connect {
  width: 320px;
}

.cd-name-note {
  margin: 3px 0 0;
  font-size: 11px;
}

.dialog-progress {
    width: 340px;
  box-sizing: border-box;
}

.dialog-connected {
  width: 360px;
  max-width: calc(100vw - 32px);
}

.dialog-connected .connect-row {
  align-items: flex-start;
  gap: 10px;
}

.dun-lines {
  flex: 1 1 auto;
  min-width: 0;
}

.dun-lines p,
.dun-details p {
  margin: 2px 0 6px;
}

.dun-buttons {
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 0 0 auto;
}

.dun-details {
  border-top: 1px solid #808080;
  box-shadow: 0 1px 0 #ffffff inset;
  margin-top: 6px;
  padding-top: 6px;
}

.mail-compose {
  width: 440px;
  max-width: calc(100vw - 32px);
}

.compose-field {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 4px;
}

.compose-field label {
  width: 56px;
  flex: 0 0 auto;
}

.compose-field input {
  flex: 1 1 auto;
  min-width: 0;
  font-size: 16px;
}

.compose-body {
  width: 100%;
  box-sizing: border-box;
  height: 180px;
  font-family: 'Courier New', monospace;
  font-size: 16px;
  resize: none;
}

.dialog-alert,
.dialog-error {
  width: 340px;
}

.service-name {
  margin: 0 0 8px 0;
  font-size: 13px;
}

.cd-rooms-now {
  margin: -4px 0 8px 0;
  font-size: 13px;
}

.dialog-buttons {
  margin-top: 10px;
  display: flex;
  gap: 6px;
  justify-content: flex-end;
}

.dialog-buttons button {
  min-width: 74px;
}

.alert-body {
  margin: 4px 0;
  line-height: 1.45;
}

.error-row {
  display: flex;
  gap: 10px;
  align-items: flex-start;
}

.icon-error {
  flex: 0 0 auto;
}

.modal-layer {
  position: fixed;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 40;
}

.speaker-warning {
  margin-top: 14px;
  color: #ffff00;
  font-size: 13px;
  font-weight: bold;
  text-align: center;
}

.blink {
  animation: blink 1s steps(2, jump-none) infinite;
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}


.connect-row {
  display: flex;
  align-items: center;
  gap: 12px;
}

.two-computers {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
}

.box-left,
.box-right {
  display: block;
  width: 12px;
  height: 12px;
  background: #c0c0c0;
  border: 1px solid #000000;
}

.wire {
  position: relative;
  display: block;
  width: 40px;
  height: 12px;
}

.wire::before {
  content: '';
  position: absolute;
  top: 6px;
  left: 0;
  width: 40px;
  height: 1px;
  background: #000000;
}

.wire-dot {
  position: absolute;
  top: 4px;
  left: 0;
  width: 4px;
  height: 4px;
  background: #000080;
  animation: wire-travel 1.2s steps(8) infinite;
}

@keyframes wire-travel {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(36px);
  }
}

.connect-text {
  margin: 0;
  font-size: 11px;
}


.toast {
  position: fixed;
  right: 12px;
  bottom: 92px;
  background: #ffffcc;
  border: 1px solid #000000;
  padding: 4px 8px;
  font-size: 11px;
  z-index: 60;
}

.tell-wrap {
  position: relative;
  display: inline-block;
}

.tooltip {
  position: absolute;
  right: 0;
  bottom: 22px;
  white-space: nowrap;
  background: #ffffcc;
  border: 1px solid #000000;
  padding: 2px 5px;
  font-size: 11px;
}


.browser {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.browser-body {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
  margin: 0;
  padding: 2px;
}

.menu-bar {
  position: relative;
  display: flex;
  gap: 2px;
  padding: 1px 0 3px 0;
}

.menu-item {
  background: transparent;
  border: none;
  box-shadow: none;
  padding: 2px 7px;
  min-width: 0;
}

@media (hover: hover) {
  .menu-item:hover {
    background: #000080;
    color: #ffffff;
  }
}

.menu-drop {
  position: absolute;
  top: 22px;
  right: 0;
  background: #c0c0c0;
  border: 1px solid #000000;
  box-shadow: 1px 1px 0 #000000;
  display: flex;
  flex-direction: column;
  z-index: 30;
}

.menu-drop button {
  background: transparent;
  border: none;
  box-shadow: none;
  text-align: left;
  padding: 3px 14px 3px 10px;
  min-width: 130px;
}

@media (hover: hover) {
  .menu-drop button:hover {
    background: #000080;
    color: #ffffff;
  }
}

.toolbar {
  display: flex;
  align-items: center;
  gap: 3px;
  padding: 2px 0;
  border-bottom: 1px solid #808080;
}

.toolbar button {
  display: flex;
  align-items: center;
  gap: 3px;
  padding: 2px 5px;
  min-width: 0;
  flex: 0 0 auto;
}

.glyph {
  display: block;
}

.throbber {
  margin-left: auto;
  width: 26px;
  height: 26px;
  background: #000080;
  border: 1px solid #000000;
  position: relative;
  flex: 0 0 auto;
}

.throbber-orbit {
  position: absolute;
  inset: 0;
}

.throbber.spinning .throbber-orbit {
  animation: orbit 0.72s steps(8) infinite;
}

.throbber-dot {
  position: absolute;
  top: 2px;
  left: 11px;
  width: 4px;
  height: 4px;
  background: #ffff00;
}

.throbber::after {
  content: '';
  position: absolute;
  top: 11px;
  left: 11px;
  width: 4px;
  height: 4px;
  background: #ffffff;
}

@keyframes orbit {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

@media (max-width: 480px), (pointer: coarse) {
  .toolbar-label {
    display: none;
  }

    .toolbar button {
    min-width: 32px;
    justify-content: center;
  }

    .throbber {
    margin-left: 0;
  }
}

.url-bar {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 3px 0;
}

.url-bar input {
  flex: 1;
  min-width: 0;
}

.viewport {
  flex: 1;
  min-height: 0;
  overflow: auto;
  background: #ffffff;
  border: 1px solid #808080;
  border-right-color: #ffffff;
  border-bottom-color: #ffffff;
}

.status-bar {
  margin-top: 2px;
}

.status-text {
  flex: 1;
  white-space: nowrap;
  overflow: hidden;
}

.status-right {
  display: flex;
  align-items: center;
  gap: 5px;
  flex: 0 0 auto;
  min-height: 23px;
}

.status-tell button {
  padding: 0 5px;
  font-size: 11px;
}

.segments {
  display: flex;
  gap: 1px;
}

.segment {
  display: block;
  width: 7px;
  height: 10px;
  background: #c0c0c0;
  border: 1px solid #808080;
}

.segment.on {
  background: #000080;
  border-color: #000080;
}

.light {
  display: block;
  width: 6px;
  height: 6px;
  background: #006600;
  border: 1px solid #333333;
}

.light.on {
  background: #00ff00;
}


.page-view {
  font-family: 'Times New Roman', Times, serif;
  font-size: 16px;
  line-height: 1.5;
  color: #000000;
    background: #c0c0c0;
  padding: 14px 16px 40px 16px;
}

.page-view h1 {
  font-size: 28px;
  margin: 12px 0 8px 0;
}

.page-view h2 {
  font-size: 21px;
  margin: 16px 0 6px 0;
}

.page-view a {
  color: #0000cc;
}

.page-view a:visited {
  color: #660000;
}

.page-view a.ghost,
.page-view a.ghost:visited {
    color: #c0c0c0;
  text-decoration: none;
}

.page-view hr {
  border: none;
  border-top: 1px solid #808080;
  margin: 14px 0;
}

.page-view .wr-page a {
  color: var(--wr-link);
}
.page-view .wr-page a:visited {
  color: var(--wr-vlink);
}

.page-view ul,
.page-view ol {
  margin: 8px 0 8px 26px;
}

.page-view .small {
  font-size: 13px;
}

.page-view input,
.page-view button,
.page-view textarea {
  font-family: 'Times New Roman', Times, serif;
  font-size: 14px;
}

.logo {
  margin: 0 0 4px 0;
  line-height: 0;
}

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

.tagline {
  font-style: italic;
  margin: 4px 0 0 0;
}

.result {
  color: #cc0000;
  font-weight: bold;
}

.chan-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 5px;
  margin: 8px 0;
    max-width: 620px;
}

.chan {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 10px 6px;
  text-align: center;
  text-decoration: none;
  border: 1px solid #000000;
    box-shadow: 1px 1px 0 #808080;
  background: #cccccc;
  color: #000080;
  font-size: 17px;
  line-height: 1.1;
}

.chan-art {
  flex: none;
  display: block;
}

.chan:active {
  box-shadow: none;
  transform: translate(1px, 1px);
}

.chan-news { background: #ccccff; color: #000080; font-weight: bold; letter-spacing: 2px; }
.chan-weather { background: #ccffff; color: #003366; font-style: italic; }
.chan-sports { background: #ccffcc; color: #003300; font-weight: bold; letter-spacing: 1px; }
.chan-chat { background: #ffffcc; color: #660000; font-style: italic; font-size: 19px; }
.chan-mail { background: #ffcccc; color: #660000; font-weight: bold; }
.chan-stars { background: #ccccff; color: #333366; font-style: italic; }
.chan-tv { background: #cccccc; color: #000000; font-weight: bold; letter-spacing: 1px; font-size: 15px; }
.chan-ring { background: #ffcc99; color: #663300; font-weight: bold; }
.chan-find { background: #ccffcc; color: #006666; }
.chan-members { background: #ffffcc; color: #666600; font-size: 15px; }
.chan-book { background: #99ffcc; color: #006633; font-style: italic; }
.chan-net { background: #99ccff; color: #000080; font-weight: bold; font-size: 15px; }
.chan-files { background: #ffffcc; color: #663300; font-weight: bold; }

@media (max-width: 700px) {
  .chan-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

.channel-box {
  border: 1px solid #808080;
  background: #ffffcc;
  padding: 8px;
  margin: 8px 0;
}

.box-score {
  border-collapse: collapse;
  margin: 6px 12px 0 0;
  display: inline-table;
}

.box-score td {
  border: 1px solid #808080;
  padding: 2px 8px;
}

.marquee-frame {
  overflow: hidden;
  border: 1px solid #000000;
  background: #000080;
  color: #ffff00;
  padding: 3px 0;
  font-family: 'Times New Roman', Times, serif;
  font-size: 16px;
}

.marquee-text {
  white-space: nowrap;
  display: inline-block;
  padding-left: 100%;
    animation: marquee 14s steps(168) infinite;
}

@keyframes marquee {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-200%);
  }
}

.construction {
  position: relative;
  height: 34px;
  margin: 12px 0;
  background: #ffcc00;
  border: 1px solid #000000;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}

.construction .stripes {
  position: absolute;
  top: -12px;
  left: -20px;
  right: -20px;
  bottom: -12px;
  display: flex;
}

.construction .stripes i {
  display: block;
  width: 14px;
  margin-right: 14px;
  background: #000000;
  transform: skewX(-28deg);
  flex: 0 0 auto;
}

.construction span {
  position: relative;
  background: #ffffff;
  border: 1px solid #000000;
  padding: 1px 8px;
  font-family: 'Pixelated MS Sans Serif', 'MS Sans Serif', Tahoma, Geneva, sans-serif;
  font-size: 12px;
  font-weight: bold;
  letter-spacing: 1px;
}

.counter {
  margin: 6px 0;
}

.odo {
  display: inline-block;
  background: #000000;
  color: #ffffff;
  font-family: 'Courier New', monospace;
  font-size: 20px;
  padding: 1px 4px;
  margin-right: 2px;
  border: 1px solid #808080;
}

.image-slot {
  margin: 10px 0;
}

.page-image {
  display: block;
  max-width: 100%;
  image-rendering: pixelated;
}

.gb-entry {
  border-top: 1px solid #c0c0c0;
  padding: 8px 0;
}

.gb-head {
  font-size: 14px;
  color: #006600;
}

.gb-body {
  margin-top: 2px;
}

.webring {
  border: 1px solid #000000;
  background: #ccffcc;
  padding: 10px;
  text-align: center;
}

.webring-title {
  font-weight: bold;
  margin-bottom: 6px;
}

.webring button {
  margin: 0 3px;
}

.warning {
  color: #cc0000;
  font-weight: bold;
}

.dateline {
  font-style: italic;
}

.caption {
  font-size: 13px;
  font-style: italic;
}


.gaveup {
  position: relative;
  z-index: 20;
  margin: 12vh auto 0 auto;
  max-width: 460px;
  text-align: center;
  color: #ffffff;
  font-size: 13px;
  line-height: 1.6;
}

.gaveup-line {
  margin-bottom: 18px;
}

.gaveup-actions {
  margin: 8px 0;
}

.link-button {
  background: transparent;
  border: none;
  box-shadow: none;
  color: #ffff00;
  font-size: 13px;
  text-decoration: underline;
  cursor: pointer;
  padding: 0;
}


@media (max-width: 700px) {
  .desktop {
    padding: 0;
  }

  .window-slot,
  .window-slot.maximized {
    left: 0;
    top: 0;
    width: 100%;
    height: calc(100% - var(--taskbar-total));
  }

  .dialog-connect,
  .dialog-alert,
  .dialog-error {
    width: auto;
    max-width: 92vw;
  }

    .dialog-progress {
    width: min(340px, 92vw);
  }

  .center-stack {
    margin-top: 4vh;
  }

  .logo-art {
    width: 100%;
  }
}

@media (pointer: coarse) {
  body,
  .window,
  .window-body,
  button,
  input,
  select,
  textarea,
  label,
  .status-bar {
    font-size: 13px;
  }

  .toolbar button {
    padding: 6px 8px;
  }

  .menu-item {
    padding: 6px 10px;
  }

  .page-view {
    font-size: 18px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .blink,
  .marquee-text,
  .wire-dot,
  .throbber.spinning .throbber-orbit {
    animation: none;
  }

    .screensaver {
    display: none;
  }

  .blink {
    opacity: 1;
  }
}


.desktop-layer {
  position: absolute;
  left: var(--safe-l);
  right: var(--safe-r);
  top: 0;
  bottom: var(--taskbar-total);
}

.icon-column {
  position: absolute;
  top: 10px;
  left: 8px;
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  align-content: flex-start;
    height: calc(100% - 18px);
  gap: 8px;
}

.icon-break {
  flex-basis: 100%;
  height: 100%;
  width: 0;
    margin: 0 -8px 0 0;
  padding: 0;
}

.icon-column.placed {
  display: block;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  max-height: none;
}

.icon-column.placed .desk-icon {
  position: absolute;
}

.desk-icon {
  width: 78px;
  background: transparent;
  border: none;
  box-shadow: none;
  padding: 3px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  cursor: default;
}

.desk-icon-label {
  color: #ffffff;
  font-size: 11px;
  line-height: 1.25;
  text-align: center;
  padding: 1px 2px;
}

.desktop[data-pale='1'] .desk-icon:not(.selected):not(.nudged) .desk-icon-label {
  background: var(--desk-color, #008080);
}

.desk-icon.selected {
  outline: 1px dotted #ffffff;
  outline-offset: -1px;
}

.desk-icon.selected .desk-icon-label {
  background: #000080;
}

.desk-icon.nudged .desk-icon-label {
  background: #000080;
}
.desk-icon.nudged {
  outline: 1px dotted #ffffff;
  outline-offset: -1px;
    animation: nudge-breathe 1.6s steps(1, end) infinite alternate;
}
@keyframes nudge-breathe {
  from { opacity: 1; }
  to { opacity: 0.55; }
}
@media (prefers-reduced-motion: reduce) {
  .desk-icon.nudged {
    animation: none;
    opacity: 1;
  }
}

.speakers-note {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 10px;
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.speakers-close {
  min-width: 0;
  padding: 0 6px;
  font-size: 11px;
  line-height: 16px;
}

.window-slot {
  position: absolute;
    left: calc(4% + var(--safe-l));
  top: 2%;
  width: calc(92% - var(--safe-l) - var(--safe-r));
  height: calc((100% - var(--taskbar-total)) * 0.94);
  z-index: 5;
}

.window-slot.focused {
  z-index: 10;
}

.window-slot.maximized {
  left: var(--safe-l);
  top: 0;
  width: calc(100% - var(--safe-l) - var(--safe-r));
  height: calc(100% - var(--taskbar-total));
}

.shell-slot.maximized > .window {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
}

.shell-slot.maximized > .window > .shell-body {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
}

.shell-slot.maximized .notepad-body,
.shell-slot.maximized .pat-board,
.shell-slot.maximized .painter-main,
.shell-slot.maximized .find-results,
.shell-slot.maximized .source-body,
.shell-slot.maximized .shell-icons,
.shell-slot.maximized .bin-rows,
.shell-slot.maximized .dos-screen,
.shell-slot.maximized .printers-queue,
.shell-slot.maximized .chat-pane,
.shell-slot.maximized .mail-list,
.shell-slot.maximized .calc-grid,
.shell-slot.maximized .defrag-grid,
.shell-slot.maximized .fancy-main,
.shell-slot.maximized .help-main,
.shell-slot.maximized .lon-log,
.shell-slot.maximized .mine-grid,
.shell-slot.maximized .mon-graph,
.shell-slot.maximized .pinball-table,
.shell-slot.maximized .ref-main,
.shell-slot.maximized .scandisk-grid,
.window-slot.maximized .chat-pane,
.window-slot.maximized .mail-list {
  flex: 1 1 auto;
  min-height: 0;
  height: auto;
  max-height: none;
}

.chat-slot.maximized > .window,
.mail-slot.maximized > .window {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
}
.chat-slot.maximized .chat-body,
.mail-slot.maximized .mail-body {
  flex: 1 1 auto;
  min-height: 0;
  height: auto;
  max-height: none;
}

.shell-slot.note-fit {
  top: var(--note-top) !important;
  height: var(--note-height) !important;
}

.shell-slot.note-fit > .window {
  height: 100%;
  box-sizing: border-box;
}

.shell-slot.note-fit > .window > .shell-body {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
}

.shell-slot.note-fit .notepad-body {
  flex: 1 1 auto;
  min-height: 0;
  height: auto;
  max-height: none;
}

@media (min-width: 701px) {
  .shell-slot.maximized .pat-board {
    zoom: 1.6;
  }
}

.shell-slot.maximized .find-results,
.shell-slot.maximized .source-body,
.shell-slot.maximized .shell-icons,
.shell-slot.maximized .bin-rows {
  overflow: auto;
}

.shell-slot.maximized .shell-icons {
  align-content: flex-start;
}

.shell-slot.maximized .painter-pane {
  align-items: flex-start;
}

.tray-details {
  margin: 4px 0 2px 0;
  padding-top: 4px;
  border-top: 1px solid #808080;
  box-shadow: 0 -1px 0 #ffffff;
}

.tray-details p {
  margin: 0;
}


.taskbar {
    position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  height: var(--taskbar-total);
  background: #c0c0c0;
  border-top: 1px solid #ffffff;
  box-shadow: inset 0 1px 0 #808080;
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 0 calc(4px + var(--safe-r)) var(--safe-b) calc(4px + var(--safe-l));
  box-sizing: border-box;
  z-index: 30;
}

.start-button {
  display: flex;
  align-items: center;
  gap: 4px;
  height: 26px;
  padding: 2px 8px;
  flex: 0 0 auto;
}

.start-button.pressed,
.task-button.pressed {
  box-shadow: var(--bevel-pressed);
}

.task-buttons {
  flex: 1;
  display: flex;
  gap: 3px;
  overflow-x: auto;
  overflow-y: hidden;
  min-width: 0;
  scrollbar-width: none;
}

.task-buttons::-webkit-scrollbar {
  display: none;
}

.task-button {
  display: flex;
  align-items: center;
  gap: 4px;
  height: 26px;
  padding: 2px 7px;
  max-width: 170px;
  min-width: 60px;
  overflow: hidden;
}

.task-label {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.tray {
  display: flex;
  align-items: center;
  gap: 6px;
  height: 24px;
  padding: 0 6px;
  border: 1px solid #808080;
  border-right-color: #ffffff;
  border-bottom-color: #ffffff;
  flex: 0 0 auto;
}

.tray-icon {
  background: transparent;
  border: none;
  box-shadow: none;
  padding: 0;
  min-width: 0;
  min-height: 0;
  display: flex;
  align-items: center;
  flex: 0 0 auto;
}

.tray-clock {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  padding: 1px 5px;
  background: transparent;
  border: none;
  box-shadow: var(--bevel-thin-sunken);
}

.tray-clock-text {
  line-height: 14px;
}

.tray-speaker,
.tray-share {
  background: transparent;
  border: none;
  box-shadow: none;
  padding: 1px 2px;
  min-width: 0;
  min-height: 0;
  display: flex;
  align-items: center;
  flex: 0 0 auto;
}

@media (pointer: coarse) {
  .tray-speaker,
  .tray-share {
    padding: 5px 4px;
  }
}

.tray-tip {
  position: absolute;
  right: 4px;
  bottom: var(--taskbar-total);
  margin-bottom: 4px;
  white-space: nowrap;
  background: #ffffcc;
  border: 1px solid #000000;
  padding: 2px 5px;
  font-size: 11px;
}

.tray-panel {
  position: absolute;
  right: 4px;
  bottom: var(--taskbar-total);
  width: 196px;
  background: #c0c0c0;
  border: 1px solid #000000;
  box-shadow: 1px 1px 0 #000000;
  padding: 8px;
  z-index: 50;
}

.tray-panel p {
  margin: 0 0 6px 0;
}

@media (pointer: coarse) {
  .tray-panel .dialog-buttons {
    flex-wrap: wrap;
    row-gap: 6px;
  }
}


.start-menu {
  position: absolute;
  left: var(--safe-l);
  bottom: var(--taskbar-total);
    max-height: calc(100vh - var(--taskbar-total) - 2px);
  max-height: calc(100dvh - var(--taskbar-total) - 2px);
  width: 216px;
  background: #c0c0c0;
  border: 1px solid #000000;
  box-shadow: 1px 1px 0 #000000;
  display: flex;
  z-index: 50;
}

.start-band {
  width: 24px;
  background: #000080;
  color: #c0c0c0;
  font-weight: bold;
  font-size: 12px;
  letter-spacing: 2px;
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  text-align: left;
  padding: 8px 4px;
  flex: 0 0 auto;
}

.start-items {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 2px;
  min-width: 0;
  overflow-y: auto;
}

.start-item {
  display: flex;
  align-items: center;
  gap: 7px;
  background: transparent;
  border: none;
  box-shadow: none;
  text-align: left;
  padding: 5px 6px;
  min-width: 0;
}

@media (hover: hover) {
  .start-item:hover {
    background: #000080;
    color: #ffffff;
  }
}

.start-item.dead {
  color: #808080;
  text-shadow: 1px 1px 0 #ffffff;
  pointer-events: none;
}

.dialog-openwith {
  width: min(340px, calc(100vw - 20px));
}
.openwith-list {
  list-style: none;
  margin: 2px 0 6px;
  padding: 2px;
  background: var(--surface-hilight);
  box-shadow: var(--bevel-sunken);
}
.openwith-list button {
  display: block;
  width: 100%;
  min-height: 0;
  padding: 1px 4px;
  text-align: left;
  background: transparent;
  box-shadow: none;
}
.openwith-list button.selected {
  background: #000080;
  color: var(--surface-hilight);
}
.dialog-run {
    width: min(320px, calc(100vw - 20px));
}

.run-row {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  margin-bottom: 8px;
}

.run-row p {
  margin: 0;
}

.w-calc:focus {
  outline: none;
}

.start-arrow {
  margin-left: auto;
}

.start-flyout,
.ctx-sub {
  position: absolute;
  display: flex;
  flex-direction: column;
  width: max-content;
  max-width: 100vw;
  overflow-y: auto;
  background: #c0c0c0;
  border: 1px solid #000000;
  box-shadow: 1px 1px 0 #000000;
  padding: 2px;
}

.start-separator {
  height: 1px;
  background: #808080;
  border-bottom: 1px solid #ffffff;
  margin: 3px 2px;
}


.crash-layer {
  position: fixed;
  inset: 0;
  background: #000080;
  color: #c0c0c0;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 200;
  cursor: default;
  overflow: hidden;
}

.crash-out {
    margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  color: inherit;
  font-family: 'Courier New', monospace;
    font-size: min(15px, calc((100vw - 40px) / 34));
  line-height: 1.45;
  white-space: pre-wrap;
  word-break: break-word;
}

.crash-title {
  background: #c0c0c0;
  color: #000080;
  padding: 0 6px;
}

.shutdown-ask {
  width: 320px;
}

.shutdown-note {
  margin: 8px 0 0 0;
  font-size: 11px;
}

.shutdown-layer {
  position: fixed;
  inset: 0;
  background: #000000;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 100;
}

.shutdown-box {
  width: 300px;
}


.mail-slot {
  left: 10%;
  top: 8%;
  width: 76%;
  height: calc((100% - var(--taskbar-total)) * 0.8);
}

.mail-window {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.mail-body {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
  margin: 0;
  padding: 3px;
}

.mail-toolbar {
  border-bottom: 1px solid #808080;
  gap: 4px;
}

.mail-list {
  flex: 0 0 40%;
  overflow: auto;
  background: #ffffff;
  border: 1px solid #808080;
  border-right-color: #ffffff;
  border-bottom-color: #ffffff;
}

.mail-row {
  display: flex;
  width: 100%;
  gap: 6px;
  background: transparent;
  border: none;
  box-shadow: none;
  text-align: left;
  padding: 3px 5px;
  font-size: 11px;
}

.mail-head {
  background: #c0c0c0;
  border-bottom: 1px solid #808080;
  font-weight: bold;
  cursor: default;
}

.mail-row.unread {
  font-weight: bold;
}

.mail-row.selected {
  background: #000080;
  color: #ffffff;
}

.mail-row.deleted {
  text-decoration: line-through;
  color: #808080;
}

.mail-row.deleted.selected {
  color: #c0c0c0;
}

.col-from {
  flex: 0 0 30%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.col-subject {
  flex: 1;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.col-date {
  flex: 0 0 66px;
  padding-right: 4px;
  text-align: right;
}

.mail-deleted-note {
  margin: 3px 2px;
  font-size: 11px;
  color: var(--ink-dim);
}

.mail-reading {
  flex: 1;
  min-height: 0;
  overflow: auto;
  background: #ffffff;
  border: 1px solid #808080;
  border-right-color: #ffffff;
  border-bottom-color: #ffffff;
  padding: 8px 10px;
  font-family: 'Times New Roman', Times, serif;
  font-size: 16px;
}

.mail-headers {
  font-family: 'Pixelated MS Sans Serif', 'MS Sans Serif', Tahoma, Geneva, sans-serif;
  font-size: 11px;
  border-bottom: 1px solid #c0c0c0;
  padding-bottom: 5px;
  margin-bottom: 6px;
}

.mail-hint {
  color: #808080;
}

.mail-text .footnote {
  font-size: 13px;
}

.mail-text .mono {
  font-family: 'Courier New', monospace;
  font-size: 14px;
}

.mail-text a {
  color: #0000cc;
}

.toast-button {
  min-width: 0;
}


@media (min-width: 701px) {
  .chat-slot {
    left: 14%;
    top: 12%;
    width: 70%;
    height: calc((100% - var(--taskbar-total)) * 0.72);
  }
}

.chat-window {
    box-sizing: border-box;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.chat-body {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
  margin: 0;
  padding: 3px;
}

.chat-main {
  flex: 1;
  display: flex;
  gap: 3px;
  min-height: 0;
}

.chat-pane {
  flex: 1;
  min-width: 0;
  overflow: auto;
  background: #ffffff;
  border: 1px solid #808080;
  border-right-color: #ffffff;
  border-bottom-color: #ffffff;
  padding: 5px 7px;
}

.chat-line {
  margin: 0 0 3px 0;
  font-size: 12px;
  line-height: 1.4;
  word-wrap: break-word;
}

.chat-user {
  color: #000080;
}

.chat-system {
  color: #666666;
}

.chat-age {
  color: #808080;
  font-size: 0.85em;
  font-style: italic;
}

.chat-stars {
  font-family: 'Courier New', Courier, monospace;
  color: #666666;
}

.title-bar-lead {
  display: flex;
  align-items: center;
  gap: 4px;
  min-width: 0;
}

.chat-title-icon {
  flex: 0 0 16px;
  width: 16px;
  height: 16px;
}

.chat-person {
  width: 12px;
  height: 12px;
  vertical-align: -1px;
  margin-right: 3px;
}

.chat-window .chat-status {
  margin: 4px 0 0;
  font-size: 12px;
}

.chat-status .status-bar-field {
  flex: 0 0 auto;
  white-space: nowrap;
  padding: 2px 5px;
  min-width: 0;
}

.chat-status .chat-status-conn {
  flex: 1 1 auto;
  overflow: hidden;
  text-overflow: ellipsis;
}

@media (max-width: 700px) {
  .chat-window .chat-status {
    font-size: 11px;
  }
}

.chat-hint {
  color: #666666;
  margin: 0 0 6px 0;
  font-size: 12px;
}

.chat-members {
  flex: 0 0 132px;
  overflow: auto;
  background: #ffffff;
  border: 1px solid #808080;
  border-right-color: #ffffff;
  border-bottom-color: #ffffff;
  padding: 5px 6px;
  font-size: 11px;
}

.chat-members-title {
  display: block;
  width: 100%;
  font: inherit;
  font-weight: bold;
  text-align: left;
  color: inherit;
  background: transparent;
  border: 0;
  border-bottom: 1px solid #c0c0c0;
  margin-bottom: 4px;
  padding: 0 0 3px;
  cursor: default;
}

.chat-members ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.chat-members li {
  padding: 1px 0;
}

.chat-you {
  color: #000080;
  font-weight: bold;
}

.chat-members li {
  position: relative;
}
.chat-members .chat-member-button {
  min-width: 0;
  min-height: 0;
  background: none;
  border: 0;
  box-shadow: none;
  padding: 0;
  font: inherit;
  text-align: left;
}
.chat-ignored .chat-member-name {
  color: #808080;
}
.chat-ignored .chat-person {
  opacity: 0.4;
}
.chat-name-menu {
  position: absolute;
  left: 16px;
  top: 100%;
  z-index: 5;
  background: var(--surface);
  box-shadow: var(--bevel-raised);
  padding: 3px;
}
.chat-name-menu button {
  display: block;
  min-height: 22px;
  padding: 2px 16px;
  background: none;
  border: 0;
  box-shadow: none;
  font: inherit;
  color: #000000;
  text-align: left;
  white-space: nowrap;
}
.chat-name-menu button:focus-visible {
  background: #000080;
  color: #ffffff;
}
@media (hover: hover) {
  .chat-name-menu button:hover {
    background: #000080;
    color: #ffffff;
  }
}

.chat-input button:disabled {
  pointer-events: auto;
}

.chat-input {
  display: flex;
  align-items: center;
  gap: 5px;
  padding-top: 4px;
}

.chat-input input {
  flex: 1;
  min-width: 0;
}

@media (max-width: 700px) {
  .chat-main {
    flex-direction: column;
  }

  .chat-members {
    flex: none;
    order: -1;
    overflow: visible;
    padding: 3px 6px;
  }

  .chat-members-title {
    cursor: pointer;
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: 0;
  }

    .chat-members ul {
    display: flex;
    flex-wrap: wrap;
    gap: 0 10px;
    line-height: 15px;
    max-height: 34px;
    overflow: hidden;
    margin-top: 4px;
    border-top: 1px solid #c0c0c0;
    padding-top: 3px;
  }

  .chat-members[data-open='1'] ul {
    display: block;
    max-height: 30vh;
    overflow: auto;
  }

    .toast {
    top: 4px;
    bottom: auto;
    right: auto;
    left: 50%;
    transform: translateX(-50%);
    max-width: calc(100vw - 24px);
  }
}

@media (pointer: coarse) {
  .chat-line {
    font-size: 14px;
  }
}

@media (max-width: 700px) {
  .window-slot.mail-slot {
    left: 0;
    top: 0;
    width: 100%;
    height: calc(100% - var(--taskbar-total));
  }
    .window-slot.mail-slot .mail-window {
    box-sizing: border-box;
  }
}


.forecast {
  border-collapse: collapse;
  margin: 8px 0;
}

.forecast th,
.forecast td {
  border: 1px solid #808080;
  padding: 3px 12px 3px 6px;
  text-align: left;
}

.forecast th {
  background: #c0c0c0;
}

.box-score.wide {
  display: table;
  margin: 8px 0;
}

.box-score th {
  border: 1px solid #808080;
  background: #c0c0c0;
  padding: 2px 8px;
}

.search-hit {
  margin: 10px 0;
}

.search-desc {
  font-size: 15px;
}

.search-url {
  font-size: 13px;
  color: #006600;
}


.screensaver {
  position: fixed;
  inset: 0;
  background: #000000;
  z-index: 90;
  cursor: none;
}

.starfield {
  display: block;
  width: 100%;
  height: 100%;
}

.screensaver-caption {
  position: absolute;
  right: 10px;
  bottom: 8px;
  color: #808080;
  font-family: 'Courier New', monospace;
  font-size: 12px;
}

.page-view .quip {
  color: #006600;
  font-style: italic;
}


.dialog-datetime {
  width: 300px;
}

.tray-clock {
  background: transparent;
  border: none;
  box-shadow: none;
  padding: 0 2px;
  font-size: 11px;
  cursor: default;
}

.dt-tabs {
  display: flex;
  margin: 0 0 -2px 3px;
  position: relative;
  z-index: 2;
}

.dt-tab {
  box-shadow: var(--bevel-tab);
  background: var(--surface);
  border: none;
  min-width: 0;
  min-height: 0;
  padding: 5px 9px;
  color: #000000;
}

.dt-tab.active {
  margin-top: -2px;
  padding-bottom: 3px;
  z-index: 8;
  font-weight: bold;
}

.dt-panel {
  position: relative;
  z-index: 1;
  box-shadow: var(--bevel-raised);
  background: var(--surface);
  padding: 10px;
  margin-bottom: 8px;
}

.dt-monthline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
}

.dt-month-select {
  font-weight: bold;
  min-width: 110px;
}

.dt-month {
  font-weight: bold;
}

.dt-spinner {
  display: inline-flex;
  align-items: stretch;
}

.dt-spinner input {
  width: 52px;
  text-align: right;
}

.dt-spin-buttons {
  display: inline-flex;
  flex-direction: column;
}

.dt-spin-buttons button {
  min-width: 0;
  padding: 0 4px;
  font-size: 8px;
  line-height: 1;
  height: 50%;
}

.dt-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  background: #ffffff;
  border: 1px solid #808080;
  border-right-color: #ffffff;
  border-bottom-color: #ffffff;
  padding: 2px;
}

.dt-cell {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 20px;
  font-size: 11px;
  background: transparent;
  border: none;
  box-shadow: none;
  padding: 0;
  min-width: 0;
}

.dt-head {
  font-weight: bold;
  border-bottom: 1px solid #808080;
}

.dt-day.selected {
  background: #000080;
  color: #ffffff;
}

.dt-timezone-note {
  margin: 8px 0 4px 0;
  font-size: 11px;
  color: var(--ink-dim);
}

.dt-time {
  font-family: 'Courier New', monospace;
  font-size: 14px;
  width: 90px;
  text-align: center;
}


.ctx-menu {
  position: fixed;
  min-width: 150px;
  background: #c0c0c0;
  border: 1px solid #000000;
  box-shadow: 1px 1px 0 #000000;
  padding: 2px;
  z-index: 55;
}

.ctx-item {
  display: flex;
  align-items: center;
  gap: 4px;
  width: 100%;
  background: transparent;
  border: none;
  box-shadow: none;
  text-align: left;
  padding: 3px 8px 3px 4px;
  min-width: 0;
}

@media (hover: hover) {
  .ctx-item:hover {
    background: #000080;
    color: #ffffff;
  }
}

.ctx-check {
  width: 12px;
  text-align: center;
  flex: 0 0 auto;
}

.ctx-arrow {
  margin-left: auto;
}


.ctx-separator {
  height: 1px;
  background: #808080;
  border-bottom: 1px solid #ffffff;
  margin: 3px 2px;
}


.dialog-display {
  width: 260px;
}

.display-preview {
  display: flex;
  justify-content: center;
  margin-bottom: 6px;
}

.crt-screen {
  width: 100%;
  height: 100%;
  background: #008080;
  image-rendering: pixelated;
}

.desktop-layer {
  image-rendering: pixelated;
}


.bookmarks-drop {
  left: 0;
  right: auto;
  max-width: 260px;
}

.menu-check {
  display: inline-block;
  width: 12px;
  flex: 0 0 auto;
}

.menu-drop button {
  display: flex;
  align-items: center;
  gap: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.menu-separator {
  height: 1px;
  background: #808080;
  border-bottom: 1px solid #ffffff;
  margin: 3px 2px;
}

.bookmarks-drop > div > button {
  width: 100%;
}

.bm-folder {
  position: relative;
}

.bm-folder-label {
  flex: 1 1 auto;
  overflow: hidden;
  text-overflow: ellipsis;
}

.bm-arrow {
  width: 0;
  height: 0;
  margin-left: 12px;
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  border-left: 4px solid #000000;
  flex: 0 0 auto;
}

.bm-folder-row.open .bm-arrow {
  border-left-color: #ffffff;
}

.bm-folder-row.open {
  background: #000080;
  color: #ffffff;
}

.bookmarks-sub {
  top: -3px;
  left: 100%;
  right: auto;
  max-width: 280px;
}

@media (max-width: 600px) {
  .bookmarks-sub {
    position: static;
    margin-left: 16px;
    box-shadow: none;
    border-width: 0 0 0 1px;
  }
}


.shell-slot {
  width: auto;
  height: auto;
}

.slot-computer { left: 16%; top: 12%; }
.slot-cdrive { left: 24%; top: 20%; }
.slot-notepad { left: 32%; top: 16%; }
.slot-folder { left: 30%; top: 30%; }
.slot-recycle { left: 22%; top: 18%; }
.slot-dos { left: 20%; top: 26%; }

.shell-window {
  width: 340px;
  display: flex;
  flex-direction: column;
}

.w-notepad { width: 420px; }
.w-recycle { width: 400px; }
.w-scandisk { width: 430px; }


.scandisk-body {
  padding: 8px;
}

.scandisk-lead {
  margin: 0 0 6px 0;
}

.scandisk-drives {
  background: #ffffff;
  box-shadow: var(--bevel-sunken);
  padding: 2px;
  margin-bottom: 8px;
  height: 42px;
  overflow-y: auto;
}

.scandisk-drive {
  display: block;
  width: 100%;
  text-align: left;
  background: transparent;
  border: none;
  box-shadow: none;
  min-width: 0;
  min-height: 0;
  padding: 1px 4px;
}

.scandisk-drive.picked {
  background: #000080;
  color: #ffffff;
}

.scandisk-type {
  margin-bottom: 8px;
}

.scandisk-hint {
  color: var(--ink-dim);
}

.scandisk-grid {
  display: grid;
  gap: 1px;
  background: #808080;
  box-shadow: var(--bevel-sunken);
  padding: 3px;
  margin-bottom: 6px;
}

.sd-cell {
  height: 8px;
  background: #c0c0c0;
}

.sd-cell.ok {
  background: #000080;
}

.sd-cell.bad {
  background: #cc0000;
}

.scandisk-status {
  margin: 0 0 6px 0;
  min-height: 26px;
}

.scandisk-results {
  background: #ffffff;
  box-shadow: var(--bevel-sunken);
  padding: 4px 6px;
  margin-bottom: 8px;
}

.scandisk-table {
  border-collapse: collapse;
  width: 100%;
  background: transparent;
}

.scandisk-table td {
  padding: 0 4px 0 0;
  height: auto;
}

.sd-num {
  text-align: right;
  white-space: nowrap;
}

.scandisk-buttons {
  margin-top: 0;
}

@media (pointer: coarse) {
  .w-scandisk {
    width: 96vw;
    max-width: 430px;
  }

  .scandisk-drive {
    min-height: 30px;
  }

    .scandisk-buttons button {
    min-height: 32px;
  }
}

.shell-body {
  margin: 0;
  padding: 4px;
}

.shell-icons {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  background: #ffffff;
  border: 1px solid #808080;
  border-right-color: #ffffff;
  border-bottom-color: #ffffff;
  padding: 8px;
  min-height: 90px;
}

.shell-icon {
  width: 88px;
  background: transparent;
  border: none;
  box-shadow: none;
  padding: 3px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  cursor: default;
}

.shell-icon.selected {
  outline: 1px dotted #000000;
  outline-offset: -1px;
}

.shell-icon.selected .shell-icon-label {
  background: #000080;
  color: #ffffff;
}

.shell-icon-label {
  font-size: 11px;
  text-align: center;
  word-break: break-word;
}

.shell-statusline {
  margin: 3px 2px 0 2px;
  font-size: 11px;
  border: 1px solid #808080;
  border-right-color: #ffffff;
  border-bottom-color: #ffffff;
  padding: 2px 5px;
}

.shell-empty {
  margin: 8px;
  font-size: 11px;
  color: var(--ink-dim);
}

.notepad-menu {
  position: relative;
  display: flex;
  gap: 14px;
  padding: 2px 6px 4px 6px;
  border-bottom: 1px solid #808080;
}

.notepad-menu-item {
  background: transparent;
  border: none;
  box-shadow: none;
  padding: 0;
  min-width: 0;
  min-height: 0;
  font-size: 11px;
  color: #000000;
}

.notepad-menu-item.inert {
  color: #000000;
}

.notepad-drop {
  position: absolute;
  left: 4px;
  top: 18px;
  background: #c0c0c0;
  border: 1px solid #000000;
  box-shadow: 1px 1px 0 #000000;
  display: flex;
  flex-direction: column;
  z-index: 15;
}

.notepad-drop button {
  background: transparent;
  border: none;
  box-shadow: none;
  text-align: left;
  padding: 3px 20px 3px 10px;
  min-width: 120px;
  color: #000000;
}

@media (hover: hover) {
  .notepad-drop button:hover {
    background: #000080;
    color: #ffffff;
  }
}

.notepad-body {
  display: block;
  width: 100%;
  box-sizing: border-box;
  font-family: 'Courier New', monospace;
  font-size: 13px;
  line-height: 1.4;
  color: #000000;
  background: #ffffff;
  border: 1px solid #808080;
  border-right-color: #ffffff;
  border-bottom-color: #ffffff;
  border-radius: 0;
  box-shadow: none;
  resize: none;
  height: 320px;
  margin: 0;
  padding: 8px 10px;
  overflow: auto;
  white-space: pre-wrap;
}

.recycle-list {
  background: #ffffff;
  border: 1px solid #808080;
  border-right-color: #ffffff;
  border-bottom-color: #ffffff;
  min-height: 70px;
  padding: 4px;
  margin-bottom: 6px;
}

.recycle-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 3px 4px;
  font-size: 11px;
}

.recycle-from {
  flex: 0 0 30%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.recycle-subject {
  flex: 1;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

@media (max-width: 700px) {
  .shell-slot {
    left: 2% !important;
    top: 8% !important;
  }

    .shell-slot.maximized {
    left: 0 !important;
    top: 0 !important;
    width: 100%;
    height: calc(100% - var(--taskbar-total));
  }

    .shell-window,
  .w-notepad,
  .w-recycle {
    width: 96vw;
    max-width: min(440px, calc(100vw - 16px));
  }
}


.og-frame {
  position: relative;
  width: 1200px;
  height: 630px;
  background: #008080;
  overflow: hidden;
  pointer-events: none;
}

.og-frame * {
  pointer-events: none;
}

.og-dialog {
  position: absolute;
  left: 40px;
  right: 40px;
  top: 24px;
  bottom: 112px;
  width: auto;
  display: flex;
  flex-direction: column;
}

.og-dialog .title-bar {
  height: 48px;
  padding: 0 5px 0 12px;
}

.og-dialog .title-bar-text {
  font-size: 26px;
}

.og-dialog .title-bar-controls {
  display: flex;
  gap: 3px;
  align-items: center;
}

.og-dialog .title-bar-controls button {
  width: 34px;
  height: 30px;
  min-width: 34px;
  min-height: 30px;
}

.og-dialog .title-bar-controls button[aria-label='Minimize'] {
  background-size: 12px 4px;
  background-position: bottom 6px left 11px;
}

.og-dialog .title-bar-controls button[aria-label='Maximize'] {
  background-size: 18px 18px;
  background-position: top 6px left 8px;
}

.og-dialog .title-bar-controls button[aria-label='Close'] {
  background-size: 16px 14px;
  background-position: top 8px left 9px;
}

.og-dialog .window-body {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 24px 44px 26px 44px;
}

.og-wordmark {
  font-family: 'Courier New', Courier, monospace;
  font-weight: bold;
  font-size: 150px;
  line-height: 1;
  letter-spacing: 2px;
  color: #000080;
  text-align: center;
}

.og-rule {
  height: 0;
  margin: 30px 70px;
  border-top: 2px solid #808080;
  border-bottom: 2px solid #ffffff;
}

.og-tag {
  font-family: 'Courier New', Courier, monospace;
  font-size: 34px;
  line-height: 1.2;
  letter-spacing: 6px;
  color: #000000;
  text-align: center;
}

.og-sub {
  margin: 30px 0 0 0;
  font-size: 27px;
  line-height: 1.2;
  color: #000000;
  text-align: center;
}

.print-bar.og-bar {
  margin: 40px 70px 0 70px;
  padding: 4px;
  gap: 4px;
}

.print-bar.og-bar span {
  height: 26px;
}

.og-warning {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 48px;
  margin: 0;
  text-align: center;
  font-size: 30px;
    line-height: 1.2;
    animation: none;
  opacity: 1;
}

.og-taskbar {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
}

.og-taskbar .start-button {
  display: flex;
  align-items: center;
  gap: 4px;
  height: 26px;
  padding: 2px 8px;
  background: var(--surface);
  box-shadow: var(--bevel-thin-sunken);
}

.og-taskbar .task-buttons {
  flex: 1;
}


.slot-source {
  left: 20%;
  top: 10%;
}

.w-source {
  width: 480px;
}

.source-body {
  font-family: 'Courier New', monospace;
  font-size: 12px;
  line-height: 1.4;
  background: #ffffff;
  border: 1px solid #808080;
  border-right-color: #ffffff;
  border-bottom-color: #ffffff;
  margin: 0;
  padding: 8px 10px;
  max-height: 340px;
  overflow: auto;
  white-space: pre-wrap;
  word-break: break-word;
}

.text-large .page-view {
  font-size: 20px;
}

.text-large .page-view h1 {
  font-size: 34px;
}

.text-large .page-view h2 {
  font-size: 26px;
}

.menu-item.open {
  background: #000080;
  color: #ffffff;
}

.drop-file,
.drop-edit,
.drop-view,
.drop-go,
.drop-help {
  left: 0;
  right: auto;
  max-width: 280px;
}


.slot-calc {
  left: 34%;
  top: 22%;
}

.w-calc {
  width: 260px;
}

.calc-display {
  background: #ffffff;
  border: 1px solid #808080;
  border-right-color: #ffffff;
  border-bottom-color: #ffffff;
  font-family: 'Courier New', monospace;
  font-size: 16px;
  text-align: right;
  padding: 4px 6px;
  margin-bottom: 5px;
  overflow: hidden;
  white-space: nowrap;
}

.calc-grid {
  display: flex;
  gap: 5px;
}

.calc-memory {
  flex: 0 0 34px;
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.calc-mark {
  height: 18px;
  background: #c0c0c0;
  border: 1px solid #808080;
  border-right-color: #ffffff;
  border-bottom-color: #ffffff;
  text-align: center;
  font-weight: bold;
  color: #cc0000;
}

.calc-mem-key {
  min-width: 0;
  padding: 4px 0;
  font-size: 11px;
  color: #cc0000;
}

.calc-keys {
  flex: 1;
  min-width: 0;
}

.calc-row {
  display: flex;
  gap: 3px;
  margin-bottom: 3px;
}

.calc-row button {
  flex: 1;
  min-width: 0;
  padding: 4px 0;
  font-family: 'Courier New', monospace;
  font-size: 13px;
}

.calc-row button.calc-wide {
  flex: 2;
}


.ring-buttons {
  display: flex;
  gap: 6px;
  justify-content: center;
  margin: 8px 0;
  flex-wrap: wrap;
}

.ring-button {
  display: inline-block;
  background: var(--surface);
  border: none;
  box-shadow: var(--bevel-raised);
  padding: 4px 12px;
  font-family: 'Pixelated MS Sans Serif', 'MS Sans Serif', Tahoma, Geneva, sans-serif;
  font-size: 12px;
  color: #000000;
  text-decoration: none;
}

.ring-button:active {
  box-shadow: var(--bevel-pressed);
}

.ring-button.ring-random {
  font-weight: bold;
}

.ring-member {
  margin-top: 6px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #000080;
}

.ring-hub {
  background: #ffffcc;
}

.ring-list {
  border-collapse: collapse;
  margin: 8px 0;
}

.ring-list td {
  padding: 2px 10px 2px 0;
  vertical-align: top;
}


.slot-mines {
  left: 26%;
  top: 12%;
}

.w-mines {
  width: 216px;
}

.w-mines.level-intermediate {
  width: 340px;
}

.mine-menu {
  position: relative;
  display: flex;
  gap: 14px;
  padding: 2px 4px 4px 4px;
  border-bottom: 1px solid #808080;
  margin-bottom: 5px;
}

.mine-menu-item {
  background: transparent;
  border: none;
  box-shadow: none;
  padding: 0;
  min-width: 0;
  min-height: 0;
  font-size: 11px;
  color: #000000;
}

.mine-drop {
  position: absolute;
  left: 2px;
  top: 18px;
  background: #c0c0c0;
  border: 1px solid #000000;
  box-shadow: 1px 1px 0 #000000;
  display: flex;
  flex-direction: column;
  z-index: 15;
}

.mine-drop button {
  background: transparent;
  border: none;
  box-shadow: none;
  text-align: left;
  padding: 3px 16px 3px 8px;
  min-width: 118px;
  color: #000000;
  white-space: pre;
}

@media (hover: hover) {
  .mine-drop button:hover {
    background: #000080;
    color: #ffffff;
  }
}

.mine-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 4px;
  margin-bottom: 5px;
  background: #c0c0c0;
    box-shadow: var(--bevel-thin-sunken);
}

.mine-odo {
  display: block;
  background: #000000;
  color: #ff0000;
  font-family: 'Courier New', monospace;
  font-size: 17px;
  font-weight: bold;
  letter-spacing: 1px;
  line-height: 1;
  padding: 2px 3px;
  border: 1px solid #808080;
  border-right-color: #ffffff;
  border-bottom-color: #ffffff;
}

.mine-reset {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  min-width: 26px;
  height: 26px;
  padding: 0;
}

.mine-grid {
  display: grid;
  gap: 0;
  background: #808080;
  box-shadow: var(--bevel-thin-sunken);
  padding: 3px;
}

.mine-cell {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  aspect-ratio: 1;
  min-width: 0;
  min-height: 0;
  padding: 0;
  font-family: 'Pixelated MS Sans Serif', 'MS Sans Serif', Tahoma, Geneva, sans-serif;
  font-size: 12px;
  font-weight: bold;
  line-height: 1;
  background: #c0c0c0;
  border: none;
  border-radius: 0;
    box-shadow: inset -2px -2px #808080, inset 2px 2px #ffffff;
}

.mine-cell:active {
  box-shadow: inset 1px 1px #808080;
}

.mine-cell.open {
  box-shadow: none;
  border-top: 1px solid #808080;
  border-left: 1px solid #808080;
  background: #c0c0c0;
}

.mine-cell.open:active {
  box-shadow: none;
}

.mine-cell.hit {
  background: #ff0000;
}

.mine-wrong {
  position: relative;
  display: block;
  line-height: 0;
}

.mine-wrong::after {
  content: 'X';
  position: absolute;
  left: 0;
  top: -3px;
  width: 13px;
  text-align: center;
  color: #ff0000;
  font-size: 13px;
}

.mine-q {
  color: #000000;
}

.mine-cell.n1 { color: #0000ff; }
.mine-cell.n2 { color: #006600; }
.mine-cell.n3 { color: #ff0000; }
.mine-cell.n4 { color: #000080; }
.mine-cell.n5 { color: #990000; }
.mine-cell.n6 { color: #008080; }
.mine-cell.n7 { color: #000000; }
.mine-cell.n8 { color: #666666; }

.mine-hint {
  margin: 6px 0 0 0;
  font-size: 11px;
  color: #000000;
}


.slot-patience {
  left: 14%;
  top: 8%;
}

.w-patience {
  width: 372px;
}

.pat-menu {
  position: relative;
  display: flex;
  gap: 14px;
  padding: 2px 4px 4px 4px;
  border-bottom: 1px solid #808080;
  margin-bottom: 5px;
}

.pat-menu-item {
  background: transparent;
  border: none;
  box-shadow: none;
  padding: 0;
  min-width: 0;
  min-height: 0;
  font-size: 11px;
  color: #000000;
}

.pat-drop {
  position: absolute;
  left: 2px;
  top: 18px;
  background: #c0c0c0;
  border: 1px solid #000000;
  box-shadow: 1px 1px 0 #000000;
  display: flex;
  flex-direction: column;
  z-index: 15;
}

.pat-drop button {
  background: transparent;
  border: none;
  box-shadow: none;
  text-align: left;
  padding: 3px 16px 3px 8px;
  min-width: 132px;
  color: #000000;
}

@media (hover: hover) {
  .pat-drop button:hover {
    background: #000080;
    color: #ffffff;
  }
}

.pat-board {
  position: relative;
  background: #008000;
  box-shadow: var(--bevel-sunken);
  border: none;
  border-radius: 0;
  padding: 6px;
  min-height: 300px;
  overflow: hidden;
}

.pat-top {
  display: flex;
  gap: 3px;
  margin-bottom: 8px;
}

.pat-gap {
  flex: 1;
  min-width: 4px;
}

.pat-slot,
.pat-card {
  background: transparent;
  border: none;
  box-shadow: none;
  padding: 0;
  min-width: 0;
  min-height: 0;
  line-height: 0;
}

.pat-columns {
  display: flex;
  gap: 3px;
}

.pat-column {
  position: relative;
  flex: 1;
  min-width: 0;
  min-height: 180px;
}

.pat-column .pat-card,
.pat-column .pat-slot {
  position: absolute;
  left: 0;
}

.pat-card.picked .card,
.pat-slot.picked .card {
  outline: 2px solid #ffff00;
  outline-offset: -2px;
}

.pat-flyer {
  position: absolute;
  line-height: 0;
  pointer-events: none;
}

.pat-win {
  position: absolute;
  left: 50%;
  top: 40%;
  transform: translate(-50%, -50%);
  width: 250px;
  z-index: 12;
}

.pat-hint {
  margin: 6px 0 0 0;
  font-size: 11px;
  color: #000000;
}


.card {
  position: relative;
  display: block;
  width: 44px;
  height: 62px;
  box-sizing: border-box;
  border: 1px solid #000000;
  border-radius: 2px;
  background: #ffffff;
  overflow: hidden;
}

.card-slot {
  background: transparent;
  border: 1px dotted #808080;
  color: #808080;
  font-size: 15px;
  line-height: 58px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}

.card-back {
  background: var(--back-ground, #000080);
}

.card-weave {
  position: absolute;
  inset: 2px;
  background-image: linear-gradient(45deg, var(--back-ink, #3366cc) 25%, var(--back-ground, #000080) 25%);
  background-size: var(--back-step, 6px) var(--back-step, 6px);
  border: 1px solid var(--back-ink, #3366cc);
}

.pat-drop-head {
  margin: 2px 0 1px 0;
  padding: 0 8px;
  color: #808080;
}

.back-weave {
  --back-ground: #000080;
  --back-ink: #3366cc;
}

.back-bars .card-weave {
  --back-ground: #990000;
    --back-ink: #cc9999;
  background-image: repeating-linear-gradient(
    45deg,
    var(--back-ink) 0,
    var(--back-ink) 3px,
    var(--back-ground) 3px,
    var(--back-ground) 8px
  );
    background-size: auto;
}

.back-bars {
  --back-ground: #990000;
  --back-ink: #cc9999;
}

.back-plaid .card-weave {
  --back-ground: #003300;
  --back-ink: #669966;
  background-image: linear-gradient(90deg, var(--back-ink) 2px, transparent 2px),
    linear-gradient(0deg, var(--back-ink) 2px, transparent 2px);
  background-size: 8px 8px;
}

.back-plaid {
  --back-ground: #003300;
  --back-ink: #669966;
}

.back-checks .card-weave {
  --back-ground: #333366;
  --back-ink: #ccccff;
  background-image: linear-gradient(45deg, var(--back-ink) 25%, transparent 25%, transparent 75%, var(--back-ink) 75%),
    linear-gradient(45deg, var(--back-ink) 25%, transparent 25%, transparent 75%, var(--back-ink) 75%);
  background-size: 8px 8px;
  background-position: 0 0, 4px 4px;
}

.back-checks {
  --back-ground: #333366;
  --back-ink: #ccccff;
}

.back-stripes .card-weave {
  --back-ground: #006666;
  --back-ink: #99cccc;
  background-image: linear-gradient(90deg, var(--back-ink) 3px, transparent 3px);
  background-size: 7px 7px;
}

.back-stripes {
  --back-ground: #006666;
  --back-ink: #99cccc;
}

.back-walleye .card-weave,
.back-sundown .card-weave,
.back-cabin .card-weave,
.back-hand .card-weave,
.back-comet .card-weave {
  background-image: none;
  border-color: #000000;
}

.back-walleye { --back-ground: #99cccc; }
.back-sundown { --back-ground: #336699; }
.back-cabin { --back-ground: #000033; }
.back-comet { --back-ground: #000033; }
.back-hand { --back-ground: #cc3333; }

.card-scene {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.card-corner {
  position: absolute;
  left: 2px;
  top: 1px;
  display: flex;
  flex-direction: column;
  align-items: center;
  line-height: 1;
}

.card-rank {
  font-family: 'Times New Roman', Times, serif;
  font-size: 14px;
  font-weight: bold;
}

.card-face.red .card-rank {
  color: #cc0000;
}

.card-face.black .card-rank {
  color: #000000;
}

.card-pip {
  position: absolute;
  right: 4px;
  bottom: 4px;
  line-height: 0;
}



:root {
  --bevel-raised: inset 1px 1px 0 var(--surface-light), inset -1px -1px 0 var(--surface-dark),
    inset 2px 2px 0 var(--surface-hilight), inset -2px -2px 0 var(--surface-shadow);
  --bevel-sunken: inset 1px 1px 0 var(--surface-shadow), inset -1px -1px 0 var(--surface-hilight),
    inset 2px 2px 0 var(--surface-dark), inset -2px -2px 0 var(--surface-light);
  --bevel-pressed: inset 1px 1px 0 var(--surface-dark), inset -1px -1px 0 var(--surface-light),
    inset 2px 2px 0 var(--surface-shadow), inset -2px -2px 0 var(--surface-hilight);
    --bevel-thin-sunken: inset 1px 1px 0 var(--surface-shadow), inset -1px -1px 0 var(--surface-hilight);
    --bevel-tab: inset 1px 1px 0 var(--surface-light), inset -1px 0 0 var(--surface-dark),
    inset 2px 2px 0 var(--surface-hilight), inset -2px 0 0 var(--surface-shadow);
}

button,
input[type='reset'],
input[type='submit'],
.window,
.ring-button,
.chat-room-other,
.mine-cell,
.mine-reset,
.calc-mem-key,
.start-button,
.task-button,
.title-bar-controls button {
  background: var(--surface);
  border: none;
  border-radius: 0;
  box-shadow: var(--bevel-raised);
}

button:not(:disabled):not(.desk-icon):active,
input[type='reset']:not(:disabled):active,
input[type='submit']:not(:disabled):active,
.ring-button:active,
.chat-room-other:active,
.start-button.pressed,
.task-button.pressed,
.mine-cell:active,
.title-bar-controls button:active {
  box-shadow: var(--bevel-pressed);
}

button:not(:disabled):not(.desk-icon):active > *,
.title-bar-controls button:active > * {
  transform: translate(1px, 1px);
}

button:not(:disabled):not(.desk-icon):active,
.ring-button:active {
  text-indent: 1px;
  padding-top: 1px;
  padding-bottom: 0;
}

input[type='text'],
input[type='password'],
input[type='search'],
input[type='number'],
input[type='email'],
input[type='tel'],
input[type='url'],
select,
textarea,
.viewport,
.notepad-body,
.calc-display,
.mine-grid,
.shell-icons,
.recycle-list,
.chat-log,
.mail-list,
.source-body {
  background-color: #ffffff;
  border: none;
  border-radius: 0;
  box-shadow: var(--bevel-sunken);
}

.status-bar-field,
.tray,
.mine-head,
.mine-mark,
.mine-odo,
.field-border,
.status-field-border {
  box-shadow: var(--bevel-thin-sunken);
}

.taskbar {
  border-top: 1px solid var(--surface-hilight);
  box-shadow: inset 0 1px 0 var(--surface-light);
}

::-webkit-scrollbar-thumb {
  background-color: var(--surface);
  box-shadow: var(--bevel-raised);
}

::-webkit-scrollbar-track {
  background-color: var(--surface-light);
  background-image: none;
}

::-webkit-scrollbar-corner {
  background: var(--surface-light);
}


.title-bar {
  background: var(--titlebar-active);
  padding: 2px 2px 2px 3px;
  align-items: center;
}

.title-bar-text {
  color: #ffffff;
  font-weight: bold;
  font-size: 11px;
  line-height: 13px;
  letter-spacing: 0;
}

.window-slot:not(.focused) > .window > .title-bar,
.window-slot:not(.focused) .browser > .title-bar,
:root:has(.modal-layer) .window-slot > .window > .title-bar,
:root:has(.modal-layer) .window-slot .browser > .title-bar {
  background: linear-gradient(90deg, #808080, #b5b5b5);
}

.window-slot:not(.focused) > .window > .title-bar .title-bar-text,
.window-slot:not(.focused) .browser > .title-bar .title-bar-text,
:root:has(.modal-layer) .window-slot .title-bar .title-bar-text {
  color: var(--surface-light);
}

.title-bar-controls {
  display: flex;
  gap: 2px;
}

.title-bar-controls button {
  width: 16px;
  min-width: 16px;
  height: 14px;
  min-height: 14px;
  padding: 0;
  background-repeat: no-repeat;
}

.title-bar-controls button[aria-label='Minimize'] {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='2'%3E%3Crect width='6' height='2' fill='%23000'/%3E%3C/svg%3E");
  background-position: bottom 3px left 4px;
}

.title-bar-controls button[aria-label='Maximize'] {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='9'%3E%3Crect width='9' height='9' fill='%23000'/%3E%3Crect x='1' y='2' width='7' height='6' fill='%23c0c0c0'/%3E%3C/svg%3E");
  background-position: top 2px left 3px;
}

.title-bar-controls button[aria-label='Close'] {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='7' fill='%23000'%3E%3Crect x='0' y='0' width='2' height='1'/%3E%3Crect x='6' y='0' width='2' height='1'/%3E%3Crect x='1' y='1' width='2' height='1'/%3E%3Crect x='5' y='1' width='2' height='1'/%3E%3Crect x='2' y='2' width='2' height='1'/%3E%3Crect x='4' y='2' width='2' height='1'/%3E%3Crect x='3' y='3' width='2' height='1'/%3E%3Crect x='2' y='4' width='2' height='1'/%3E%3Crect x='4' y='4' width='2' height='1'/%3E%3Crect x='1' y='5' width='2' height='1'/%3E%3Crect x='5' y='5' width='2' height='1'/%3E%3Crect x='0' y='6' width='2' height='1'/%3E%3Crect x='6' y='6' width='2' height='1'/%3E%3C/svg%3E");
  background-position: top 3px left 4px;
}

.title-bar-controls button[aria-label='Restore'] {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='9'%3E%3Crect x='2' y='0' width='7' height='6' fill='%23000'/%3E%3Crect x='3' y='2' width='5' height='3' fill='%23c0c0c0'/%3E%3Crect x='0' y='3' width='7' height='6' fill='%23000'/%3E%3Crect x='1' y='5' width='5' height='3' fill='%23c0c0c0'/%3E%3C/svg%3E");
  background-position: top 2px left 3px;
}


body,
.window,
.window-body,
.title-bar,
button,
input,
select,
textarea,
label,
option,
.status-bar,
.menu-item,
.menu-drop button,
.start-item,
.ctx-item,
.task-label,
.tray-clock {
  font-family: 'Pixelated MS Sans Serif', 'MS Sans Serif', Tahoma, Geneva, sans-serif;
  font-size: 11px;
  line-height: 13px;
  -webkit-font-smoothing: none;
  font-smooth: never;
}


@media (pointer: coarse) {
    :root {
    --taskbar-h: 52px;
  }

  .start-button,
  .task-button {
    height: 44px;
  }

  .tray {
    height: 44px;
  }

  .tray-icon,
  .tray-share,
  .tray-clock {
    min-height: 44px;
    display: flex;
    align-items: center;
  }

  .start-item {
    min-height: 44px;
  }

  .desk-icon {
    min-height: 44px;
    min-width: 44px;
  }

    .w-mines {
    width: min(374px, calc(100vw - 16px));
  }

    .w-patience {
    width: 358px;
  }

  .w-mines.level-intermediate {
    width: 356px;
  }

    .title-bar-controls button {
    min-width: 30px;
    min-height: 26px;
  }

    .title-bar-controls button[aria-label='Minimize'] {
        background-position: bottom 6px left 12px;
  }

  .title-bar-controls button[aria-label='Close'] {
    background-position: top 9px left 11px;
  }

  .title-bar {
    padding: 4px 3px;
  }
}


.display-tabs {
    display: flex;
  flex-wrap: wrap;
  list-style-type: none;
  margin: 0 0 -2px 0;
  padding-left: 3px;
  position: relative;
  text-indent: 0;
  z-index: 2;
}

.display-tabs > li {
  box-shadow: var(--bevel-tab);
  background: var(--surface);
}

.display-tabs > li[aria-selected='true'] {
  margin-left: -3px;
  margin-top: -2px;
  padding-bottom: 2px;
  position: relative;
  z-index: 8;
}

.display-tabs > li button {
  background: transparent;
  border: none;
  box-shadow: none;
  min-width: 0;
  min-height: 0;
  padding: 5px 9px;
  color: #000000;
}

.display-panel {
  position: relative;
  z-index: 1;
  padding: 8px;
  margin-bottom: 8px;
}

.crt-saver {
  display: block;
  width: 136px;
  height: 92px;
  image-rendering: pixelated;
}

.display-wait {
  margin-top: 8px;
  gap: 6px;
    flex-wrap: wrap;
}

.display-wait select {
  width: 58px;
}

.display-preview-button {
  margin-left: 4px;
}

.display-settings-button {
  margin-left: auto;
}

@media (max-width: 700px) {
  .display-settings-button {
    margin-left: 0;
  }
}

.dialog-marquee {
  width: 320px;
  max-width: 92vw;
}

.dialog-marquee input[type='text'] {
  width: 100%;
}

.saver-range {
  gap: 8px;
  align-items: center;
}

.saver-range input[type='range'] {
  flex: 1;
}

.saver-range output {
  min-width: 30px;
  text-align: right;
}

.display-note {
  margin: 6px 0 0 0;
  font-size: 11px;
  color: #000000;
}

.display-panel select[size] {
  height: auto;
  min-height: 74px;
  padding: 2px;
  padding-right: 2px;
  background-image: none;
  overflow-y: auto;
}

.display-panel select[size] option {
  padding: 1px 3px;
}

.display-panel select[size] option:checked {
  background: #000080;
  color: #ffffff;
}

.plain-box {
  border: 2px solid #000080;
  background: #ffffcc;
  padding: 10px 12px;
  margin: 14px 0;
}

.plain-box h2 {
  margin-top: 0;
}




.menu-item u,
.menu-drop u,
.start-item u,
.notepad-menu-item u,
.mine-menu-item u {
  border-bottom: 1px solid #000000;
  text-decoration: none;
}

@media (hover: hover) {
    .menu-item:hover u,
  .menu-drop button:hover u,
  .start-item:hover u {
    border-bottom-color: #ffffff;
  }
}

.desktop,
.desktop-layer,
.window,
.taskbar,
.ctx-menu,
.start-menu,
.tray-panel,
.screensaver,
button,
select,
label {
  cursor: default;
}

.page-view a,
.page-view [data-nav],
.page-view [data-app],
.page-view [data-alert],
.page-view [data-search],
.page-view [data-reveal],
.link-button,
.mail-list-row {
  cursor: pointer;
}

input[type='text'],
input[type='password'],
input[type='search'],
textarea {
  cursor: text;
}


.ring-footer {
  margin: 18px 0 4px 0;
  background: #ffffcc;
  box-shadow: var(--bevel-thin-sunken);
  padding: 5px 8px;
  text-align: center;
}

.ring-footer-title {
  font-family: 'Pixelated MS Sans Serif', 'MS Sans Serif', Tahoma, Geneva, sans-serif;
  font-size: 11px;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: #000080;
}

.ring-footer-links {
  margin-top: 3px;
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  gap: 10px;
  font-family: 'Courier New', monospace;
  font-size: 13px;
}

.ring-footer-links a {
  color: #000080;
  text-decoration: none;
  white-space: nowrap;
}

@media (hover: hover) {
  .ring-footer-links a:hover {
    text-decoration: underline;
  }
}

.modem-log {
  min-width: 0;
  margin: 10px 0 2px 0;
  padding: 4px 6px;
  height: 96px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  background: #000000;
  box-shadow: var(--bevel-thin-sunken);
  font-family: 'Courier New', Courier, monospace;
  font-size: 12px;
  line-height: 15px;
  color: #00cc00;
}

.modem-log-line {
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: clip;
}

@media (pointer: coarse) {
  .modem-log {
    height: 105px;
    font-size: 13px;
    line-height: 17px;
  }
}

@media (pointer: coarse) {
  .page-view a {
    padding: 11px 3px;
  }

  .page-view li {
    margin-bottom: 10px;
  }

    .ring-footer-links {
    flex-wrap: wrap;
    gap: 4px 12px;
  }

  .ring-footer-links a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    min-width: 44px;
    padding: 0 4px;
  }

    .page-view button,
  .page-view input[type='text'],
  .page-view input[type='submit'],
  .page-view textarea {
    min-height: 44px;
  }

  .page-view button {
    padding-left: 14px;
    padding-right: 14px;
  }
}

.ring-member-line {
  margin: 0 0 6px 0;
  font-size: 10px;
  color: #666666;
  text-align: center;
}

.ring-members li {
  padding: 1px 0;
}

.ring-exit {
  margin-top: 4px;
}


@media (pointer: coarse) {
  body,
  .window,
  .window-body,
  .title-bar,
  button,
  input,
  select,
  textarea,
  label,
  option,
  .status-bar,
  .menu-item,
  .menu-drop button,
  .start-item,
  .ctx-item,
  .task-label,
  .tray-clock {
    font-size: 13px;
    line-height: 15px;
  }
}


button:disabled,
[aria-disabled='true'],
.menu-drop button:disabled,
.notepad-drop button:disabled,
.ctx-item:disabled {
  color: var(--surface-shadow);
  text-shadow: 1px 1px 0 var(--surface-hilight);
  cursor: default;
  pointer-events: none;
}

.menu-drop button:disabled:hover,
.notepad-drop button:disabled:hover,
.start-item:disabled:hover,
.ctx-item:disabled:hover {
  background: transparent;
  color: var(--surface-shadow);
}

.notepad-menu-item.inert,
.mine-menu-item.inert {
  color: var(--surface-shadow);
  text-shadow: 1px 1px 0 var(--surface-hilight);
}

.shell-icon.dead .shell-icon-label {
  color: var(--surface-shadow);
  text-shadow: 1px 1px 0 var(--surface-hilight);
}

.shell-icon.dead {
  cursor: default;
    pointer-events: auto;
}


.slot-find {
  left: 18%;
  top: 14%;
}

.w-find {
  width: 460px;
}

.find-tabs {
  display: flex;
  margin: 0 0 -2px 3px;
  position: relative;
  z-index: 2;
}

.find-tab {
  box-shadow: var(--bevel-tab);
  background: var(--surface);
  min-width: 0;
  min-height: 0;
  padding: 5px 9px;
  color: #000000;
}

.find-tab.active {
  margin-top: -2px;
  padding-bottom: 3px;
  z-index: 8;
}

.find-panel {
  position: relative;
  z-index: 1;
  display: flex;
  gap: 8px;
  padding: 9px 8px;
  box-shadow: var(--bevel-raised);
  background: var(--surface);
}

.find-fields {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}

.find-row {
  display: flex;
  align-items: center;
  gap: 6px;
}

.find-row > span {
  width: 88px;
  text-align: right;
  flex: none;
}

.find-row input,
.find-row select {
  flex: 1;
  min-width: 0;
}

.find-buttons {
  display: flex;
  flex-direction: column;
  gap: 5px;
  flex: none;
}

.find-buttons button {
  width: 88px;
}

.find-results {
  margin-top: 8px;
  box-shadow: var(--bevel-sunken);
  background: #ffffff;
}

.find-head,
.find-row-item {
  display: flex;
  align-items: center;
  width: 100%;
  text-align: left;
}

.find-head {
  background: var(--surface);
}

.find-head > span {
  box-shadow: var(--bevel-raised);
  background: var(--surface);
  padding: 2px 5px;
  overflow: hidden;
  white-space: nowrap;
}

.find-row-item {
  background: transparent;
  box-shadow: none;
  min-height: 0;
  padding: 1px 0;
  color: #000000;
}

.find-row-item.selected {
  background: #000080;
  color: #ffffff;
}

.find-row-item > span {
  padding: 0 5px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.find-row-item .col-name {
  display: flex;
  align-items: center;
  gap: 4px;
}

.find-name-text {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.col-name {
  flex: 1.5 1 0;
  min-width: 0;
}

.col-folder {
  flex: 2 1 0;
  min-width: 0;
}

.col-size {
  flex: 0 0 52px;
  text-align: right;
}

.col-type {
  flex: 1.4 1 0;
  min-width: 0;
}

.find-rows {
  height: 132px;
  overflow-y: auto;
  overflow-x: hidden;
}

.find-status {
  min-height: 17px;
}

@media (pointer: coarse) {
  .w-find {
    width: 96vw;
    max-width: 440px;
  }

  .find-panel {
    flex-direction: column;
  }

  .find-buttons {
    flex-direction: row;
  }

  .find-buttons button {
    flex: 1;
    width: auto;
    min-height: 32px;
  }

  .find-row > span {
    width: 74px;
  }

    .find-row-item {
    min-height: 32px;
  }

  .find-rows {
    height: 160px;
  }

    .find-head .col-folder,
  .find-head .col-type,
  .find-row-item .col-folder,
  .find-row-item .col-type {
    display: none;
  }
}


.slot-painter {
  left: 14%;
  top: 8%;
}

.w-painter {
  width: 412px;
}

.painter-main {
  display: flex;
  gap: 4px;
  margin-top: 3px;
}

.painter-tools {
  display: grid;
  grid-template-columns: repeat(2, auto);
  gap: 2px;
  align-content: start;
    align-self: flex-start;
  box-shadow: var(--bevel-thin-sunken);
  padding: 3px;
  flex: none;
}

.painter-tool {
  width: 28px;
  height: 28px;
  min-width: 0;
  min-height: 0;
  padding: 2px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.painter-tool.pressed {
  box-shadow: var(--bevel-pressed);
}

.painter-pane {
  flex: 1;
  min-width: 0;
  box-shadow: var(--bevel-sunken);
  background: #808080;
  padding: 2px;
  display: flex;
}

.painter-canvas {
    max-width: 100%;
  height: auto;
  display: block;
  image-rendering: pixelated;
  background: #ffffff;
  cursor: crosshair;
    touch-action: none;
}

.painter-sheet {
  position: relative;
    display: block;
  width: fit-content;
  max-width: 100%;
}

.sheet-handle {
  position: absolute;
  width: 7px;
  height: 7px;
  background: #000080;
  border: 1px solid #ffffff;
}

.handle-e { right: -5px; top: 50%; margin-top: -4px; cursor: ew-resize; }
.handle-s { bottom: -5px; left: 50%; margin-left: -4px; cursor: ns-resize; }
.handle-se { right: -5px; bottom: -5px; cursor: nwse-resize; }

.sheet-outline {
  position: absolute;
  left: 0;
  top: 0;
  border: 1px dashed #000000;
  pointer-events: none;
}

.painter-textrow {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 4px;
}

.painter-textrow input {
  flex: 1;
  min-width: 0;
}

.painter-bottom {
  display: flex;
  align-items: center;
  gap: 5px;
  margin-top: 4px;
}

.painter-current {
  box-shadow: var(--bevel-thin-sunken);
  padding: 3px;
  flex: none;
}

.painter-current span {
  display: block;
  width: 26px;
  height: 26px;
  box-shadow: inset 0 0 0 1px #000000;
}

.painter-swatches {
  display: grid;
  grid-template-columns: repeat(14, 1fr);
  gap: 1px;
  flex: 1;
  min-width: 0;
    max-width: 380px;
  box-shadow: var(--bevel-thin-sunken);
  padding: 2px;
}

.painter-swatch {
  height: 15px;
  min-width: 0;
  min-height: 0;
  padding: 0;
  box-shadow: inset 0 0 0 1px #808080;
}

.painter-swatch.picked {
  box-shadow: inset 0 0 0 2px #000000;
}

.painter-actions {
  display: flex;
  align-items: center;
  gap: 5px;
  margin-top: 5px;
}

.painter-count {
  margin-left: auto;
  color: var(--ink-dim);
}

@media (pointer: coarse) {
  .w-painter {
    width: 96vw;
    max-width: 440px;
  }

  .painter-tool {
    width: 34px;
    height: 34px;
  }

  .painter-swatch {
    height: 22px;
  }

  .painter-actions button {
    min-height: 32px;
  }
}


.painter-art {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 3px;
  margin-top: 5px;
  padding: 4px;
  box-shadow: var(--bevel-thin-sunken);
}

.painter-stamp {
  min-width: 0;
  min-height: 0;
  padding: 2px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #ffffff;
}

.painter-stamp.pressed {
  box-shadow: var(--bevel-pressed);
}

.slot-fancy {
  left: 47%;
  top: 44%;
}

.w-fancy {
  width: 396px;
}

.fancy-row {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 3px;
}

.fancy-row input {
  flex: 1;
  min-width: 0;
}

.fancy-main {
  display: flex;
  gap: 6px;
  margin-top: 6px;
}

.fancy-styles {
  list-style: none;
  margin: 0;
  padding: 2px;
  width: 108px;
  flex: none;
  background: #ffffff;
  box-shadow: var(--bevel-sunken);
}

.fancy-styles button {
  display: block;
  width: 100%;
  text-align: left;
  background: transparent;
  box-shadow: none;
  min-width: 0;
  min-height: 0;
  padding: 2px 4px;
  color: #000000;
}

.fancy-styles button.picked {
  background: #000080;
  color: #ffffff;
}

.fancy-preview {
  flex: 1;
  min-width: 0;
  box-shadow: var(--bevel-sunken);
  background: #808080;
  padding: 2px;
  display: flex;
}

.fancy-preview canvas {
  width: 100%;
  height: auto;
  display: block;
  background: #ffffff;
}

.fancy-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 6px;
}

.fancy-hint {
  color: var(--ink-dim);
  overflow: hidden;
}

@media (pointer: coarse) {
  .w-fancy {
    width: 96vw;
    max-width: 440px;
  }

  .fancy-main {
    flex-direction: column;
  }

  .fancy-styles {
    width: auto;
  }

  .fancy-styles button {
    min-height: 30px;
  }

  .painter-stamp {
    min-height: 40px;
  }

  .fancy-actions button {
    min-height: 32px;
  }
}


.slot-printers {
  left: 30%;
  top: 24%;
}

.w-printers {
  width: 380px;
}

.printers-head {
  display: flex;
  margin-top: 3px;
  background: #c0c0c0;
}

.printers-head span {
  box-shadow: var(--bevel-raised);
  background: var(--surface);
  padding: 2px 5px;
  overflow: hidden;
  white-space: nowrap;
  flex: 1;
}

.printers-queue {
  height: 96px;
  background: #ffffff;
  box-shadow: var(--bevel-sunken);
}

.dialog-print {
  width: 360px;
}

.print-group {
  margin-bottom: 8px;
}

.print-line {
  display: flex;
  gap: 6px;
  margin: 2px 0;
}

.print-line > span:first-child {
  width: 54px;
  flex: none;
}

.print-props {
  display: flex;
  justify-content: flex-end;
  margin-top: 4px;
}

.print-radio {
  display: flex;
  align-items: center;
  gap: 5px;
  margin: 3px 0;
}

.print-copies {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 6px;
}

.print-copies input {
  width: 52px;
}

.print-doc {
  margin: 0 0 8px 0;
  color: var(--ink-dim);
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.dialog-printing,
.dialog-printfail {
  width: 320px;
}

.print-status {
  margin: 2px 0 8px 0;
}

.dialog-download {
  width: min(340px, calc(100vw - 20px));
}

.dl-line {
  margin: 0 0 2px 0;
}

.dl-name {
  font-weight: bold;
  margin: 0 0 8px 0;
  word-break: break-word;
}

.dl-stats {
  margin: 2px 0;
}

.print-bar {
  display: flex;
  gap: 2px;
  padding: 3px;
  box-shadow: var(--bevel-sunken);
  background: #ffffff;
  margin-bottom: 10px;
}

.print-bar span {
  flex: 1;
  height: 14px;
  background: #ffffff;
}

.print-bar span.on {
  background: #000080;
}

.print-failure {
  min-height: 34px;
}

@media (pointer: coarse) {
  .dialog-print,
  .dialog-printing,
  .dialog-printfail {
    width: 94vw;
    max-width: 360px;
  }

  .w-printers {
    width: 96vw;
    max-width: 440px;
  }
}


.slot-reference {
  left: 12%;
  top: 6%;
}

.w-reference {
  width: 640px;
}

.w-monitor {
  width: min(300px, calc(100vw - 16px));
}

.mon-label {
  margin: 2px 2px 4px;
  font-size: 11px;
}

.mon-graph {
  display: block;
  width: 100%;
  height: 96px;
  border: 1px solid;
  border-color: #808080 #ffffff #ffffff #808080;
}

.mon-readouts {
  display: flex;
  justify-content: space-between;
  gap: 6px;
  margin-top: 4px;
  font-size: 11px;
}

.w-help {
  width: 560px;
}

.help-main {
  display: flex;
  gap: 6px;
  margin-top: 3px;
}

.help-side {
  width: 176px;
  flex: none;
}

.help-heading {
  margin: 0 0 3px 0;
}

.help-list {
  list-style: none;
  margin: 0;
  padding: 2px;
  background: #ffffff;
  box-shadow: var(--bevel-sunken);
  height: 268px;
  overflow-y: auto;
}

.help-row {
  display: block;
  width: 100%;
  text-align: left;
  background: transparent;
  box-shadow: none;
  min-width: 0;
  min-height: 0;
  padding: 2px 4px;
  color: #000000;
}

.help-row.picked {
  background: #000080;
  color: #ffffff;
}

.help-topic {
  flex: 1;
  min-width: 0;
  height: 268px;
  overflow-y: auto;
  padding: 6px 8px;
  background: #ffffff;
  box-shadow: var(--bevel-sunken);
}

.help-topic h2 {
  margin: 0 0 6px 0;
  font-size: 11px;
}

.help-topic p {
  margin: 0 0 8px 0;
}

.help-topic .help-more {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 0 0 8px 0;
  padding: 0 10px;
}

.help-more-mark {
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 4px 0 4px 5px;
  border-color: transparent transparent transparent #000000;
}

.help-more[aria-expanded="true"] .help-more-mark {
  border-width: 5px 4px 0 4px;
  border-color: #000000 transparent transparent transparent;
}

.help-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: 6px;
  font-size: 11px;
}

.help-foot span {
  flex: 1;
  min-width: 0;
}

.help-tell {
  flex: none;
}

.help-tell button {
  padding: 0 5px;
  font-size: 11px;
}

.ref-main {
  display: flex;
  gap: 6px;
  margin-top: 3px;
}

.ref-side {
  width: 172px;
  flex: none;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.ref-find {
  display: flex;
  align-items: center;
  gap: 5px;
}

.ref-find input {
  flex: 1;
  min-width: 0;
}

.ref-list {
  list-style: none;
  margin: 0;
  padding: 2px;
  background: #ffffff;
  box-shadow: var(--bevel-sunken);
  height: 296px;
  overflow-y: auto;
}

.ref-list button {
  display: block;
  width: 100%;
  text-align: left;
  background: transparent;
  box-shadow: none;
  min-width: 0;
  min-height: 0;
  padding: 2px 4px;
  color: #000000;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ref-list button.picked {
  background: #000080;
  color: #ffffff;
}

.ref-none {
  margin: 0;
  color: var(--ink-dim);
}

.ref-article {
  flex: 1;
  min-width: 0;
  height: 322px;
  overflow-y: auto;
  background: #ffffff;
  box-shadow: var(--bevel-sunken);
  padding: 10px 12px;
  font-family: 'Times New Roman', Times, serif;
  font-size: 16px;
  line-height: 1.45;
}

.ref-title {
  font-family: 'Times New Roman', Times, serif;
  font-size: 24px;
  margin: 0 0 8px 0;
  color: #000080;
}

.ref-article p {
  margin: 0 0 10px 0;
}

.ref-plate {
  float: right;
  margin: 0 0 8px 10px;
  padding: 2px;
  box-shadow: var(--bevel-thin-sunken);
  background: #c0c0c0;
}

.ref-plate canvas {
  display: block;
  image-rendering: pixelated;
}

.ref-see {
  clear: both;
  border-top: 1px solid #808080;
  padding-top: 8px;
  margin-bottom: 0;
}

.ref-link {
  background: transparent;
  box-shadow: none;
  border: none;
  min-width: 0;
  min-height: 0;
  padding: 0;
  font-family: 'Times New Roman', Times, serif;
  font-size: 16px;
  color: #0000cc;
  text-decoration: underline;
  cursor: pointer;
}

.ref-link:active {
  color: #cc0000;
}

.ref-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 5px;
}

.ref-count {
  margin-left: auto;
  color: var(--ink-dim);
}

@media (pointer: coarse) {
  .w-reference {
    width: 96vw;
    max-width: 440px;
  }

  .ref-main {
    flex-direction: column;
  }

  .ref-side {
    width: auto;
  }

    .ref-list {
    height: 104px;
  }

  .ref-list button {
    min-height: 30px;
    line-height: 26px;
  }

    .ref-article {
    flex: none;
    height: 232px;
  }

    .ref-plate {
    float: none;
    margin: 0 0 10px 0;
    display: inline-block;
    max-width: 100%;
  }

  .ref-plate canvas {
    max-width: 100%;
    height: auto;
  }

  .ref-actions button {
    min-height: 32px;
  }
}


.w-recycle {
  width: 560px;
}

.bin-head,
.bin-pick {
  display: flex;
  align-items: center;
  width: 100%;
  text-align: left;
}

.bin-head {
  margin-top: 3px;
  background: #c0c0c0;
}

.bin-head > span {
  box-shadow: var(--bevel-raised);
  background: var(--surface);
  padding: 2px 5px;
  overflow: hidden;
  white-space: nowrap;
}

.bin-rows {
  max-height: 156px;
  overflow-y: auto;
  overflow-x: hidden;
  background: #ffffff;
  box-shadow: var(--bevel-sunken);
}

@media (pointer: coarse) {
  .bin-rows {
    max-height: 224px;
  }
}

.bin-pick {
  background: transparent;
  box-shadow: none;
  min-height: 0;
  min-width: 0;
  padding: 1px 0;
  color: #000000;
}

.bin-row.selected .bin-pick {
  background: #000080;
  color: #ffffff;
}

.bin-pick > span,
.bin-head > span {
  padding: 0 5px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.bin-pick .bin-name {
  display: flex;
  align-items: center;
  gap: 4px;
}

.bin-text {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.bin-name {
  flex: 2 1 0;
  min-width: 0;
}

.bin-where {
  flex: 1.6 1 0;
  min-width: 0;
}

.bin-when {
  flex: 0 0 82px;
}

.bin-type {
  flex: 1.2 1 0;
  min-width: 0;
}

.bin-size {
  flex: 0 0 54px;
  text-align: right;
}

.bin-actions {
  display: flex;
  gap: 6px;
  margin-top: 6px;
}

.bin-status {
  min-height: 17px;
}

@media (pointer: coarse) {
  .w-recycle {
    width: 96vw;
    max-width: 440px;
  }

  .bin-pick {
    min-height: 32px;
  }

  .bin-actions button {
    min-height: 32px;
  }

    .bin-head .bin-where,
  .bin-head .bin-when,
  .bin-head .bin-type,
  .bin-pick .bin-where,
  .bin-pick .bin-when,
  .bin-pick .bin-type {
    display: none;
  }
}

.find-hint {
  padding: 4px 6px;
  color: var(--surface-shadow);
  text-shadow: 1px 1px 0 var(--surface-hilight);
  cursor: default;
  pointer-events: none;
}

.folder-rows {
  height: 96px;
}

.also-searching {
  border: 1px solid #808080;
  padding: 6px 10px;
  margin: 10px 0;
  background: #ffffcc;
}

.also-searching h2 {
  font-size: 15px;
  margin: 0 0 4px 0;
}

.also-searching ul {
  margin: 0;
  padding-left: 22px;
}


.dialog-saveas {
  width: 360px;
  max-width: 92vw;
}

.saveas-body {
  padding: 8px;
}

.saveas-where,
.saveas-name-row,
.saveas-type-row {
  gap: 6px;
  margin-bottom: 6px;
}

.saveas-where label,
.saveas-name-row label,
.saveas-type-row label {
  width: 84px;
  flex: 0 0 auto;
}

.saveas-where select,
.saveas-name-row input,
.saveas-type-row select {
  flex: 1;
  min-width: 0;
}

.saveas-list {
  height: 118px;
  overflow: auto;
  background: #ffffff;
  box-shadow: var(--bevel-sunken);
  margin-bottom: 8px;
  padding: 2px;
}

.saveas-empty {
  margin: 4px 6px;
  color: #808080;
}

.saveas-row {
  display: flex;
  align-items: center;
  gap: 4px;
  width: 100%;
  min-height: 0;
  min-width: 0;
  padding: 1px 3px;
  background: transparent;
  box-shadow: none;
  text-align: left;
}

.saveas-row.picked {
  background: #000080;
  color: #ffffff;
}

.saveas-name {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.saveas-status {
  margin: 0 0 8px 0;
  min-height: 13px;
}

@media (pointer: coarse) {
  .saveas-row {
    min-height: 26px;
  }

  .saveas-list {
    height: 132px;
  }

  .saveas-body input,
  .saveas-body select,
  .saveas-body button {
    min-height: 30px;
  }
}

.dialog-drive {
  width: min(320px, calc(100vw - 20px));
}

.drive-line {
  display: flex;
  gap: 8px;
  margin: 2px 0;
  align-items: center;
}

.drive-line > :first-child {
  min-width: 84px;
}

.drive-line > :last-child {
  margin-left: auto;
}

.drive-key {
  display: flex;
  align-items: center;
  gap: 5px;
}

.drive-swatch {
  width: 9px;
  height: 9px;
  border: 1px solid #000000;
  display: inline-block;
}

.drive-used {
  background: #000080;
}

.drive-free {
  background: #008080;
}

.drive-pie {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  margin: 8px 0 10px 0;
}

.ctx-default {
  font-weight: bold;
}

.desk-icon-rename {
  width: 100%;
  box-sizing: border-box;
  font-family: inherit;
  font-size: inherit;
  padding: 0 2px;
  border: 1px solid #000000;
  background: #ffffff;
  color: #000000;
}

.dialog-taskbar {
  width: min(300px, calc(100vw - 20px));
}

.task-group {
  margin: 8px 0 10px 0;
  padding: 10px;
}

.task-opt {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 4px 0;
}

.task-opt.dead {
  color: #808080;
  text-shadow: 1px 1px 0 #ffffff;
}

.minimize-trace {
  position: fixed;
  border: 1px dotted #000000;
  pointer-events: none;
  z-index: 35;
}

.w-defrag {
  width: 380px;
}

.defrag-line {
  margin: 2px 0 6px 0;
}

.defrag-grid {
  display: block;
  box-shadow: var(--bevel-sunken);
  background: #c0c0c0;
  margin: 4px 0 8px 0;
  image-rendering: pixelated;
  max-width: 100%;
}

.defrag-key {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 12px;
  margin-bottom: 8px;
}

.defrag-key span {
  display: flex;
  align-items: center;
  gap: 4px;
}

.defrag-chip {
  width: 9px;
  height: 9px;
  border: 1px solid #000000;
  display: inline-block;
}

.chip-used { background: #000080; }
.chip-free { background: #ffffff; }
.chip-fixed { background: #808080; }
.chip-read { background: #00cc00; }
.chip-write { background: #cc0000; }


.w-dos {
  width: 620px;
}

.dos-body {
  padding: 3px;
}

.dos-screen {
  background: #000000;
  color: #c0c0c0;
  font-family: 'Courier New', monospace;
  font-size: 12px;
  line-height: 1.2;
  padding: 4px 6px;
  height: 300px;
  overflow: auto;
  box-shadow: var(--bevel-sunken);
  cursor: text;
}

@media (pointer: coarse) {
  .dos-screen {
    font-size: 16px;
  }
}

.dos-out {
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  color: inherit;
  font: inherit;
  white-space: pre-wrap;
  word-break: break-word;
}

.dos-line {
  display: flex;
  align-items: baseline;
}

.dos-prompt {
  white-space: pre;
}

.dos-line .dos-input {
  flex: 1 1 auto;
  min-width: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
  color: inherit;
  font: inherit;
  padding: 0;
  margin: 0;
  outline: none;
  appearance: none;
  caret-color: #c0c0c0;
}

@media (pointer: coarse) {
  .w-dos {
    width: 100%;
  }

    .dos-screen {
    height: 46vh;
  }
}


.boot-screen.reading {
  cursor: wait;
}

.boot-screen {
  position: fixed;
  inset: 0;
  background: #000000;
  color: #c0c0c0;
  font-family: 'Courier New', monospace;
    font-size: min(15px, calc((100vw - 44px) / 31));
  line-height: 1.35;
  padding: 18px 20px;
  z-index: 100;
  cursor: default;
  overflow: hidden;
}

.boot-out {
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  color: inherit;
  font: inherit;
  white-space: pre-wrap;
  word-break: break-word;
}
.boot-cursor {
  display: inline-block;
  width: 0.6em;
  height: 1em;
  background: #c0c0c0;
  vertical-align: text-bottom;
}


.boot-foot {
  position: absolute;
  left: 20px;
  right: 20px;
  bottom: 16px;
  display: flex;
  justify-content: space-between;
  gap: 12px;
  font: inherit;
}

@media (pointer: coarse) {
    .boot-screen {
    padding: 12px 10px;
    font-size: min(15px, calc((100vw - 24px) / 31));
  }

  .boot-foot {
    left: 10px;
    right: 10px;
  }
}


@media (min-width: 701px) {
  .window-slot.resized > .window,
  .window-slot.resized > .browser {
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
  }

  .shell-slot.resized > .window > .shell-body {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
  }

  .shell-slot.resized .notepad-body,
  .shell-slot.resized .pat-board,
  .shell-slot.resized .painter-main,
  .shell-slot.resized .find-results,
  .shell-slot.resized .source-body,
  .shell-slot.resized .shell-icons,
  .shell-slot.resized .bin-rows,
  .shell-slot.resized .dos-screen,
  .shell-slot.resized .printers-queue {
    flex: 1 1 auto;
    min-height: 0;
    height: auto;
    max-height: none;
  }

  .shell-slot.resized .find-results,
  .shell-slot.resized .source-body,
  .shell-slot.resized .shell-icons,
  .shell-slot.resized .bin-rows {
    overflow: auto;
  }

  .shell-slot.resized .shell-icons {
    align-content: flex-start;
  }

  .shell-slot.resized .painter-pane {
    align-items: flex-start;
  }

    .window-slot.resized > .browser > .page-view {
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
  }
}

@media (max-width: 700px), (pointer: coarse) {
  .window-slot.resized > .window {
    width: 96vw !important;
    max-width: 440px;
    height: auto !important;
  }

  .window-slot.resized > .browser {
    width: 100% !important;
    height: 100% !important;
  }
}


.dt-zone-panel {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.dt-zone-select {
  width: 100%;
}

.dt-world {
  display: block;
  width: 100%;
  box-shadow: var(--bevel-sunken);
  image-rendering: pixelated;
}


.chat-rooms {
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
  padding: 3px 2px;
}

.chat-room {
  font-size: 11px;
  min-width: 0;
  padding: 2px 8px;
}

.chat-room.here {
  box-shadow: var(--bevel-sunken);
  font-weight: bold;
}

.chat-invite-link {
  margin: 4px 0 0;
  padding: 4px;
}

.chat-invite-link p {
  margin: 0 0 2px;
  font-size: 11px;
}

.chat-invite-link input {
  width: 100%;
  min-width: 0;
  font-size: 16px;
}

.chat-help,
.chat-disclosure {
  margin: 0;
  padding: 2px 4px;
  font-size: 11px;
}

.chat-event {
  margin: 0;
  padding: 2px 4px 0;
  font-size: 11px;
}


.cal-link {
  display: inline-block;
  min-width: 0;
  min-height: 0;
  padding: 10px 2px;
  margin: -10px -2px;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
  font: inherit;
  color: #666666;
  text-decoration: underline;
  text-shadow: none;
  cursor: pointer;
}

.cal-link:active,
.cal-link:focus {
  box-shadow: none;
  text-shadow: none;
}

.cal-choice {
  display: inline-block;
  padding: 10px 2px;
  margin: -10px -2px;
  font: inherit;
  text-decoration: underline;
  white-space: nowrap;
}

@media (pointer: coarse) {
  .chat-room {
    min-height: 32px;
    font-size: 13px;
  }
}

@media (max-width: 480px) {
  .chat-friends-short {
    display: none;
  }
}


.display-bg-row {
  display: flex;
  gap: 10px;
}

.display-bg-row .field-row-stacked {
  flex: 1 1 0;
  min-width: 0;
}

.display-placement {
  gap: 12px;
  margin-top: 4px;
}

.crt-titlebar {
  color: #ffffff;
  font-size: 9px;
  font-weight: bold;
  padding: 1px 3px;
  margin: 10px 8px 0 8px;
}

.task-note {
  margin: 6px 0;
  font-size: 11px;
}

.task-buttons {
  gap: 6px;
  align-items: center;
}


.slot-pinball {
  left: 30%;
  top: 5%;
}

.w-pinball {
  width: fit-content;
}

.pinball-body {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.pinball-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  background: #000000;
    box-shadow: var(--bevel-sunken);
  padding: 5px 8px;
  font-family: 'Courier New', Courier, monospace;
}

.pinball-score {
  color: #ffcc00;
  font-size: 18px;
  letter-spacing: 2px;
}

.pinball-balls {
  color: #cc0000;
  font-size: 11px;
  letter-spacing: 1px;
}

.pinball-table {
  position: relative;
  line-height: 0;
  align-self: center;
  padding: 2px;
  background: #c0c0c0;
  box-shadow: var(--bevel-sunken);
}

.pinball-canvas {
  display: block;
  width: auto;
  height: min(420px, calc(100vh - 180px));
  height: min(420px, calc(100dvh - 180px));
  image-rendering: pixelated;
  max-width: 100%;
}

.pinball-half {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 50%;
  background: transparent;
  border: 0;
  box-shadow: none;
  padding: 0;
  min-width: 0;
  min-height: 0;
  -webkit-tap-highlight-color: transparent;
  touch-action: none;
  cursor: pointer;
}

.pinball-half:focus,
.pinball-half:active {
  outline: 0;
  box-shadow: none;
}

.pinball-left {
  left: 0;
}

.pinball-right {
  right: 0;
}

.pinball-foot {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 6px;
  min-height: 20px;
}

.pinball-hint {
  font-size: 11px;
  color: #000000;
}

.pinball-best {
  font-family: 'Courier New', Courier, monospace;
  font-size: 11px;
  color: #000000;
  white-space: nowrap;
}

@media (pointer: coarse) {
    .pinball-canvas {
    height: min(420px, calc(100vh - 230px));
    height: min(420px, calc(100dvh - 230px));
  }

    .pinball-table,
  .pinball-head {
    user-select: none;
    -webkit-user-select: none;
  }
}


.w-longitude {
  width: 340px;
}

@media (max-width: 700px) {
  .w-longitude {
    width: 96vw;
    max-width: min(440px, calc(100vw - 16px));
  }
}

.lon-body {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.lon-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.lon-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.lon-scene {
  line-height: 0;
}

.lon-choices {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.lon-group {
  display: flex;
  gap: 4px;
}

.lon-choice {
  display: flex;
  align-items: center;
  gap: 3px;
}

.lon-choice.picked {
  font-weight: bold;
}

.lon-log {
  max-height: 140px;
  overflow-y: auto;
  border-top: 1px solid #808080;
  padding-top: 4px;
}

.lon-log p {
  margin: 0 0 4px;
}

.lon-log-line {
  display: flex;
  align-items: flex-start;
  gap: 4px;
}

.mail-fallback {
  margin: 4px 6px;
  padding: 6px 8px;
  background: var(--surface-hilight);
  box-shadow: var(--bevel-sunken);
}

.mail-fallback-note {
  margin: 0 0 6px;
}

.mail-fallback-text {
  margin: 0 0 6px;
  padding: 4px;
  background: var(--surface-hilight);
  border: 1px solid var(--surface-shadow);
  font: inherit;
  white-space: pre-wrap;
  user-select: text;
  box-shadow: none;
}

.mail-fallback-buttons {
  display: flex;
  gap: 6px;
}

@media (pointer: coarse) {
  .title-bar-controls {
    gap: 14px;
  }
  .tray {
    gap: 0;
  }
  .tray-share,
  .tray-speaker,
  .tray-icon {
    min-width: 44px;
    justify-content: center;
  }
  .menu-item,
  .notepad-menu-item,
  .mine-menu-item,
  .pat-menu-item {
    min-width: 44px;
    text-align: center;
  }
  .notepad-menu,
  .mine-menu,
  .pat-menu {
    gap: 0;
  }
    .menu-bar {
    margin-top: 11px;
  }
  .title-bar-controls button,
  .tray-share,
  .tray-speaker,
  .tray-icon,
  .menu-item,
  .notepad-menu-item,
  .mine-menu-item,
  .pat-menu-item {
    position: relative;
  }
  .title-bar-controls button::after,
  .tray-share::after,
  .tray-speaker::after,
  .tray-icon::after,
  .menu-item::after,
  .notepad-menu-item::after,
  .mine-menu-item::after,
  .pat-menu-item::after {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    width: max(100%, 44px);
    height: max(100%, 44px);
    transform: translate(-50%, -50%);
    z-index: 1;
  }
  .menu-drop button,
  .notepad-drop button,
  .mine-drop button,
  .pat-drop button,
  .ctx-item {
    min-height: 44px;
  }
  .menu-drop,
  .notepad-drop,
  .mine-drop,
  .pat-drop {
    max-height: calc(100vh - var(--taskbar-total) - 100px);
    max-height: calc(100dvh - var(--taskbar-total) - 100px);
    overflow-y: auto;
  }
}

@media (pointer: coarse) {
  .desk-icon,
  .shell-icon,
  .bin-pick,
  .title-bar,
  .taskbar,
  .start-menu,
  .start-flyout,
  .ctx-menu,
  .menu-bar,
  .menu-drop,
  .notepad-menu,
  .notepad-drop,
  .status-bar,
  .shell-statusline,
  .dialog-buttons {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    user-select: none;
  }
  body * {
    overscroll-behavior: contain;
  }
}

@media (max-height: 480px) {
  .center-stack {
    padding-top: 4px;
    margin-top: 0;
  }
  .dialog-connect {
    display: flex;
    flex-direction: column;
    max-height: calc(100vh - var(--taskbar-total) - 8px);
    max-height: calc(100dvh - var(--taskbar-total) - 8px);
  }
  .dialog-connect > .window-body {
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  .dialog-connect .dialog-buttons {
    position: sticky;
    bottom: 0;
    background: #c0c0c0;
    padding-top: 4px;
  }
}


@media (pointer: coarse) and (min-width: 701px) {
  .window-slot .title-bar {
    touch-action: none;
  }
}

.chat-pane {
  overflow-anchor: none;
}

.chat-newbelow {
  position: sticky;
  bottom: 0;
  display: block;
  width: 100%;
  min-height: 32px;
  margin-top: 4px;
  font: inherit;
  cursor: pointer;
}

.connect-skip-row {
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  height: 44px;
  margin: 0 -8px -14px 0;
}
.dialog-progress .connect-skip {
  min-width: 44px;
  min-height: 44px;
  padding: 0 10px;
  font: inherit;
  font-size: 11px;
  line-height: 44px;
  color: var(--ink-dim);
  background: none;
  border: 0;
  box-shadow: none;
  opacity: 0.45;
  cursor: pointer;
}
.dialog-progress .connect-skip:focus-visible {
  opacity: 1;
  text-decoration: underline;
}
@media (hover: hover) {
  .dialog-progress .connect-skip:hover {
    opacity: 1;
    text-decoration: underline;
  }
}
.dialog-progress .connect-skip:focus-visible {
  outline: 1px dotted var(--surface-dark);
  outline-offset: -8px;
}

[data-notify-pick='1'] .chat-line[data-notify-id] {
  cursor: pointer;
}

.chat-turnstile:empty {
  display: none;
}

.window-slot > .fit-capped {
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
}
.window-slot > .fit-capped > * {
  flex: 0 0 auto;
}
.window-slot > .fit-capped > .window-body {
  flex: 1 1 auto;
  min-height: 0;
  min-width: 0;
  overflow: auto;
  overscroll-behavior: contain;
}

@media (pointer: coarse) {
  input:not([type='checkbox']):not([type='radio']):not([type='submit']):not([type='button']):not([type='range']):not(.dos-input),
  select,
  textarea,
  .page-view input[type='text'],
  .page-view textarea,
  .notepad-body {
    font-size: 16px;
  }
}