:root{--os-face:#c0c0c0;--os-light:#fff;--os-mid:#808080;--os-dark:#000;--os-title:#000080;--os-title-inactive:#7f7f7f;--os-desktop:#3f78ad;--os-wallpaper:none;--os-wallpaper-size:cover;--os-wallpaper-repeat:no-repeat;--os-wallpaper-position:center;--os-taskbar-height:42px;--os-icon-size:74px;--os-font:"MS Sans Serif",Tahoma,Arial,sans-serif}
*{box-sizing:border-box}html,body{margin:0!important;padding:0!important;width:100%;height:100%;overflow:hidden}body.designic-os-theme{font-family:var(--os-font);font-size:12px;background:#000}.os-root{position:relative;width:100%;height:100%;overflow:hidden;color:#000;outline:none;background:var(--os-desktop)}
.os-root.use-classic-cursor,.os-root.use-classic-cursor *{cursor:url('../cursors/classic-arrow.svg') 3 2,default}.os-root.use-classic-cursor button,.os-root.use-classic-cursor a,.os-root.use-classic-cursor [role="button"]{cursor:url('../cursors/classic-hand.svg') 9 3,pointer}.os-root.is-busy,.os-root.is-busy *{cursor:url('../cursors/classic-busy.svg') 3 2,progress!important}.os-root.use-classic-cursor input[type="text"],.os-root.use-classic-cursor input[type="url"],.os-root.use-classic-cursor textarea{cursor:text}
button,input,select,textarea{font:inherit}.os-desktop{position:absolute;inset:0 0 var(--os-taskbar-height) 0;overflow:hidden;background-color:var(--os-desktop);background-image:var(--os-wallpaper);background-repeat:var(--os-wallpaper-repeat,no-repeat);background-position:var(--os-wallpaper-position,center);background-size:var(--os-wallpaper-size,cover);user-select:none}.os-shortcuts{position:absolute;inset:0;transition:opacity .12s}.os-shortcuts.is-refreshing{opacity:.35}.os-desktop-icon{position:absolute;width:var(--os-icon-size);min-height:72px;padding:3px 2px;border:1px solid transparent;background:transparent;color:#fff;text-shadow:1px 1px #000;display:flex;flex-direction:column;align-items:center;gap:3px;text-align:center;line-height:1.12;touch-action:none}.os-desktop-icon img{width:36px;height:36px;object-fit:contain;image-rendering:pixelated;pointer-events:none}.os-desktop-icon>span{max-width:100%;padding:1px 2px;overflow-wrap:anywhere}.os-desktop-icon.is-selected>span{background:#000080;color:#fff;outline:1px dotted #fff}.os-desktop-icon:focus{outline:1px dotted #fff;outline-offset:-2px}.os-desktop-icon.is-dragging{opacity:.76;z-index:5}.os-selection-box{position:fixed;z-index:3;border:1px dotted #fff;background:rgba(0,0,128,.15);pointer-events:none}.os-selection-box[hidden]{display:none}
.os-windows{position:absolute;inset:0;pointer-events:none}.os-window{position:fixed;z-index:20;min-width:280px;min-height:180px;padding:3px;background:var(--os-face);border-top:2px solid var(--os-light);border-left:2px solid var(--os-light);border-right:2px solid var(--os-dark);border-bottom:2px solid var(--os-dark);box-shadow:1px 1px 0 #000;pointer-events:auto}.os-window.is-minimized{display:none}.os-window.is-maximized{left:0!important;top:0!important;width:100%!important;height:calc(100% - var(--os-taskbar-height))!important}.os-window:not(.is-active) .os-titlebar{background:var(--os-title-inactive);color:#ddd}.os-titlebar{height:26px;padding:2px 3px;display:flex;align-items:center;gap:5px;background:var(--os-title);color:#fff;font-weight:700;touch-action:none;user-select:none}.os-title-icon{width:18px;height:18px;object-fit:contain;image-rendering:pixelated}.os-window-title{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.os-window-controls{display:flex;gap:2px}.os-caption-button,.os-window button:not(.os-explorer-item):not(.os-folder-item):not(.os-control-grid button),.os-dialog-actions button,.os-settings button,.os-button-link{min-width:23px;min-height:22px;padding:1px 6px;color:#000;background:var(--os-face);border-top:2px solid var(--os-light);border-left:2px solid var(--os-light);border-right:2px solid var(--os-dark);border-bottom:2px solid var(--os-dark);box-shadow:inset -1px -1px var(--os-mid);text-decoration:none}.os-caption-button:active,.os-window button:not(.os-explorer-item):not(.os-folder-item):not(.os-control-grid button):active,.os-dialog-actions button:active,.os-settings button:active,.os-start-button.is-open{border-top-color:var(--os-dark);border-left-color:var(--os-dark);border-right-color:var(--os-light);border-bottom-color:var(--os-light);box-shadow:inset 1px 1px var(--os-mid)}.os-caption-button{width:22px;padding:0;font-weight:700;line-height:16px}.os-close{font-size:16px}.os-window-body{height:calc(100% - 29px);overflow:auto;background:#fff;border-top:2px solid var(--os-mid);border-left:2px solid var(--os-mid);border-right:2px solid var(--os-light);border-bottom:2px solid var(--os-light);padding:12px;color:#111;user-select:text}.os-window-body img{max-width:100%}.os-window-body a{color:#0000ee}.os-window-body h1,.os-window-body h2,.os-window-body h3{margin-top:.35em}.os-window-loading,.os-error,.os-folder-empty{display:grid;place-items:center;min-height:160px}.os-error{color:#800000}.os-resize-handle{position:absolute;z-index:5;touch-action:none}.os-resize-e,.os-resize-w{top:28px;bottom:6px;width:7px;cursor:ew-resize!important}.os-resize-e{right:-3px}.os-resize-w{left:-3px}.os-resize-n,.os-resize-s{left:6px;right:6px;height:7px;cursor:ns-resize!important}.os-resize-n{top:-3px}.os-resize-s{bottom:-3px}.os-resize-ne,.os-resize-nw,.os-resize-se,.os-resize-sw{width:10px;height:10px}.os-resize-ne{right:-3px;top:-3px;cursor:nesw-resize!important}.os-resize-nw{left:-3px;top:-3px;cursor:nwse-resize!important}.os-resize-se{right:-3px;bottom:-3px;cursor:nwse-resize!important}.os-resize-sw{left:-3px;bottom:-3px;cursor:nesw-resize!important}
.os-taskbar{position:fixed;z-index:10000;left:0;right:0;bottom:0;height:var(--os-taskbar-height);padding:4px;display:flex;align-items:stretch;gap:5px;background:var(--os-face);border-top:2px solid var(--os-light);box-shadow:0 -1px var(--os-mid)}.os-start-button,.os-task-button,.os-tray{background:var(--os-face);border-top:2px solid var(--os-light);border-left:2px solid var(--os-light);border-right:2px solid var(--os-dark);border-bottom:2px solid var(--os-dark);box-shadow:inset -1px -1px var(--os-mid)}.os-start-button{min-width:92px;display:flex;align-items:center;justify-content:center;gap:6px}.os-start-button img{width:20px;height:20px;image-rendering:pixelated}.os-task-buttons{flex:1;min-width:0;display:flex;gap:4px;overflow:hidden}.os-task-button{width:175px;max-width:22vw;min-width:72px;padding:0 7px;display:flex;align-items:center;gap:5px;text-align:left;overflow:hidden}.os-task-button img{width:18px;height:18px;object-fit:contain;image-rendering:pixelated}.os-task-button span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.os-task-button.is-active{border-top-color:var(--os-dark);border-left-color:var(--os-dark);border-right-color:var(--os-light);border-bottom-color:var(--os-light);background-image:repeating-linear-gradient(45deg,#ddd 0 1px,#c5c5c5 1px 3px)}.os-tray{min-width:115px;padding:2px 5px;display:flex;align-items:center;justify-content:flex-end;gap:4px;border-top-color:var(--os-mid);border-left-color:var(--os-mid);border-right-color:var(--os-light);border-bottom-color:var(--os-light);box-shadow:none}.os-tray-button,.os-clock{border:0!important;box-shadow:none!important;background:transparent!important;min-width:0!important;padding:1px 4px!important}.os-tray-button img{width:18px;height:18px;image-rendering:pixelated}.os-clock{min-width:64px!important;text-align:center}
.os-start-menu{position:fixed;z-index:11000;left:4px;bottom:var(--os-taskbar-height);width:min(340px,calc(100vw - 8px));max-height:calc(100vh - var(--os-taskbar-height) - 8px);display:flex;background:var(--os-face);border-top:2px solid var(--os-light);border-left:2px solid var(--os-light);border-right:2px solid var(--os-dark);border-bottom:2px solid var(--os-dark);box-shadow:1px 1px 0 #000}.os-start-menu[hidden]{display:none}.os-start-side{width:36px;flex:0 0 36px;display:flex;align-items:flex-end;justify-content:center;padding:8px 0;background:#7d7d7d;color:#d8d8d8;font-weight:700;letter-spacing:1px}.os-start-side span{writing-mode:vertical-rl;transform:rotate(180deg);font-size:17px;white-space:nowrap}.os-start-content{flex:1;min-width:0;padding:3px;overflow:visible}.os-start-group-title{padding:4px 8px;color:#555;font-weight:700}.os-start-list,.os-start-submenu{list-style:none;padding:0;margin:0}.os-start-item{position:relative}.os-start-link{width:100%;min-height:38px;border:0;background:transparent;display:grid;grid-template-columns:30px 1fr auto;align-items:center;gap:7px;padding:4px 8px;text-align:left}.os-start-link:hover,.os-start-link:focus{background:var(--os-title);color:#fff;outline:0}.os-menu-icon{width:25px;height:25px;object-fit:contain;image-rendering:pixelated}.os-start-submenu{display:none;position:absolute;left:calc(100% - 4px);top:0;width:240px;padding:3px;background:var(--os-face);border-top:2px solid var(--os-light);border-left:2px solid var(--os-light);border-right:2px solid var(--os-dark);border-bottom:2px solid var(--os-dark)}.os-start-item.has-children:hover>.os-start-submenu,.os-start-item.has-children:focus-within>.os-start-submenu{display:block}.os-menu-separator{height:2px;margin:4px 2px;border-top:1px solid var(--os-mid);border-bottom:1px solid var(--os-light)}
.os-context-menu{position:fixed;z-index:12000;width:220px;padding:3px;background:var(--os-face);border-top:2px solid var(--os-light);border-left:2px solid var(--os-light);border-right:2px solid var(--os-dark);border-bottom:2px solid var(--os-dark);box-shadow:1px 1px #000}.os-context-menu[hidden],.os-context-menu [hidden]{display:none}.os-context-menu button{width:100%;min-height:27px;border:0;background:transparent;text-align:left;padding:3px 22px;color:#000}.os-context-menu button:hover,.os-context-menu button:focus{background:var(--os-title);color:#fff;outline:0}
.os-boot,.os-shutdown{position:fixed;z-index:20000;inset:0;display:grid;place-items:center;background:#000;color:#ddd}.os-boot.no-boot{display:none}.os-boot.is-done{opacity:0;pointer-events:none;transition:opacity .3s}.os-boot-box{width:min(460px,88vw);text-align:center}.os-boot-badge img{width:72px;height:72px;image-rendering:pixelated}.os-boot-logo{font:700 34px/1.1 var(--os-font);margin:10px 0 4px;color:#fff}.os-boot-sub{color:#aaa;margin-bottom:22px}.os-boot-progress{height:18px;border:2px solid #aaa;padding:2px}.os-boot-progress span{display:block;height:100%;width:0;background:repeating-linear-gradient(90deg,#8aa8d8 0 13px,#000 13px 16px);animation:osBoot 1s linear forwards}.os-boot-text{margin-top:8px;font-family:monospace}@keyframes osBoot{to{width:100%}}.os-shutdown{background:#000080;color:#000}.os-shutdown[hidden]{display:none}.os-shutdown-panel{width:min(500px,92vw);background:var(--os-face);padding:20px;border-top:2px solid #fff;border-left:2px solid #fff;border-right:2px solid #000;border-bottom:2px solid #000}.os-shutdown-head{display:flex;align-items:center;gap:12px}.os-shutdown-head img{width:44px;height:44px;image-rendering:pixelated}.os-shutdown-panel label{display:block;margin:12px 0}.os-dialog-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:14px}.os-dialog-actions button{min-width:82px}.os-power-off{text-align:center;padding:30px 10px;color:#000}
.os-explorer-window .os-window-body{padding:0;user-select:none}.os-explorer{height:100%;display:flex;flex-direction:column}.os-explorer-menu,.os-notepad-menu{height:25px;flex:0 0 25px;display:flex;align-items:center;gap:20px;padding:2px 8px;background:var(--os-face);border-bottom:1px solid var(--os-mid)}.os-explorer-toolbar{display:flex;align-items:center;gap:8px;padding:5px;background:var(--os-face);border-bottom:2px groove #fff}.os-explorer-toolbar button{min-width:55px!important}.os-address{height:25px;flex:1;display:flex;align-items:center;background:#fff;border:2px inset #ddd}.os-address span{padding:0 6px;background:var(--os-face);border-right:1px solid #999;height:100%;display:flex;align-items:center}.os-address strong{padding:0 7px;font-weight:400}.os-explorer-status{order:3;padding:4px 7px;background:var(--os-face);border-top:2px groove #fff}.os-explorer-grid{flex:1;overflow:auto;padding:14px;display:grid;grid-template-columns:repeat(auto-fill,minmax(105px,1fr));align-content:start;gap:12px}.os-explorer-item,.os-folder-item{border:1px solid transparent!important;background:transparent!important;box-shadow:none!important;min-width:0!important;min-height:94px!important;padding:4px!important;display:flex!important;flex-direction:column;align-items:center;justify-content:flex-start;gap:4px;text-align:center}.os-explorer-item img,.os-folder-item img{width:44px;height:44px;object-fit:contain;image-rendering:pixelated}.os-explorer-item span,.os-folder-item span{padding:1px 3px}.os-explorer-item small{color:#666}.os-explorer-item.is-selected span{background:#000080;color:#fff}.os-folder-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:10px}.os-computer-banner{display:flex;align-items:center;gap:10px;padding:10px;background:#f0f0f0;border-bottom:1px solid #ccc}.os-computer-banner img{width:48px;height:48px}.os-computer-banner small{display:block;color:#666;margin-top:3px}
.os-image-viewer{height:100%;display:flex;flex-direction:column}.os-image-toolbar{flex:0 0 32px;padding:3px;background:var(--os-face);display:flex;align-items:center;gap:5px}.os-image-stage{flex:1;min-height:0;overflow:auto;display:flex;align-items:center;justify-content:center;background:#777;padding:15px}.os-image-stage img{width:auto;max-width:100%;height:auto;box-shadow:0 0 0 1px #000;background:#fff;image-rendering:auto}.os-media-view{min-height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px;background:#111;color:#fff;text-align:center}.os-media-view video{max-width:100%;max-height:360px}.os-audio-view img{width:80px}.os-audio-view audio{width:min(480px,90%)}.os-pdf-view{height:100%;min-height:380px}.os-pdf-view object{width:100%;height:100%;min-height:380px}.os-file-dialog,.os-link-dialog,.os-recycle,.os-clock-app{text-align:center;padding:22px}.os-file-dialog>img,.os-link-dialog>img,.os-recycle>img,.os-clock-app>img{width:72px;height:72px;image-rendering:pixelated}.os-button-link{display:inline-flex!important;align-items:center;justify-content:center;min-height:28px!important}.os-muted{color:#666}.os-big-clock{font-size:32px;font-weight:700;margin:18px 0}
.os-notepad-menu{margin:-12px -12px 0}.os-notepad{width:calc(100% + 24px);height:calc(100% - 13px);margin:0 -12px -12px;padding:5px;resize:none;border:0;outline:0;font-family:"Courier New",monospace;font-size:14px;user-select:text}.os-terminal{margin:-12px;padding:10px;min-height:calc(100% + 24px);background:#000;color:#cfcfcf;font-family:"Courier New",monospace;overflow:auto}.os-terminal-output{white-space:pre-wrap;min-height:250px}.os-terminal-line{display:flex}.os-terminal-input{flex:1;min-width:0;border:0;outline:0;background:#000;color:#fff;font-family:inherit}.os-about{display:grid;grid-template-columns:110px 1fr;gap:16px}.os-about>img{width:96px;height:96px;image-rendering:pixelated}.os-control-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(105px,1fr));gap:16px;padding:15px}.os-control-grid button,.os-control-grid a{border:1px solid transparent;background:transparent;box-shadow:none;min-height:100px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;color:#000;text-decoration:none}.os-control-grid img{width:48px;height:48px;image-rendering:pixelated}.os-control-grid button:focus,.os-control-grid a:focus{outline:1px dotted #000}.os-settings fieldset,.os-sound-form fieldset{margin:12px 0;padding:12px}.os-settings label{display:block;margin:10px 0}.os-tabs{display:flex;margin-bottom:-2px}.os-tabs button{min-width:90px;border-bottom:0}.os-tabs button.is-active{background:#fff;position:relative;z-index:2}.os-mouse-demo{text-align:center;padding:15px}.os-mouse-demo>img{width:72px;height:72px}.os-system-table{width:100%;border-collapse:collapse}.os-system-table th,.os-system-table td{padding:7px 8px;border-bottom:1px solid #ddd;text-align:left}.os-system-hero{display:flex;align-items:center;gap:15px}.os-system-hero img{width:68px;height:68px}.os-help{display:grid;grid-template-columns:170px 1fr;min-height:360px;margin:-12px}.os-help aside{background:#f0f0f0;border-right:2px groove #fff;padding:10px}.os-help aside button{display:block;width:100%;margin:5px 0;text-align:left}.os-help article{padding:18px}.os-run>div:first-child{display:flex;align-items:center;gap:12px}.os-run>div:first-child img{width:48px;height:48px}.os-run label{display:flex;align-items:center;gap:8px;margin:14px 0}.os-run input{flex:1;min-width:0;padding:4px;border:2px inset #fff}.os-properties{display:grid;grid-template-columns:80px 1fr;gap:10px}.os-properties>img{width:64px;height:64px;image-rendering:pixelated}.os-properties table{grid-column:1/-1}
@media(max-width:700px){:root{--os-taskbar-height:48px}.os-window{left:5px!important;width:calc(100vw - 10px)!important;max-width:none}.os-task-button{max-width:105px}.os-tray{min-width:70px}.os-tray-button{display:none}.os-start-menu{width:min(320px,calc(100vw - 8px))}.os-start-submenu{position:static;width:100%;display:block;margin-left:12px;border:0}.os-help{grid-template-columns:1fr}.os-help aside{border-right:0;border-bottom:2px groove #fff}.os-about{grid-template-columns:1fr}.os-about>img{margin:auto}.os-explorer-grid{grid-template-columns:repeat(auto-fill,minmax(85px,1fr))}}
@media(prefers-reduced-motion:reduce){.os-boot-progress span{animation:none;width:100%}.os-boot.is-done{transition:none}.os-shortcuts{transition:none}}

/* v0.2.2 - Dial-up networking ------------------------------------------------ */
.os-window.is-minimizing-to-tray{transition:transform .65s cubic-bezier(.2,.75,.3,1),opacity .65s ease!important;transform-origin:0 0;transform:translate(var(--os-tray-dx,0),var(--os-tray-dy,0)) scale(.08);opacity:.15;pointer-events:none}
.os-modem-tray[hidden]{display:none!important}.os-modem-tray img{width:18px;height:18px;object-fit:contain;image-rendering:pixelated}.os-modem-tray.is-connected{animation:os-modem-pulse 1.8s steps(2,end) infinite}@keyframes os-modem-pulse{50%{filter:brightness(1.25)}}
.os-dialup-window .os-window-body,.os-modem-status-window .os-window-body,.os-message-window .os-window-body{background:var(--os-face);user-select:none}
.os-dialup{height:100%;display:flex;flex-direction:column}.os-dialup-head{display:flex;align-items:center;gap:14px;padding:4px 6px 13px;border-bottom:2px groove #fff}.os-dialup-head img{width:46px;height:46px;object-fit:contain;image-rendering:pixelated}.os-dialup-head strong{font-size:14px}
.os-dialup-fields{padding:12px 6px 4px}.os-dialup-fields label{display:grid;grid-template-columns:105px 1fr;align-items:center;gap:8px;margin:7px 0}.os-dialup-fields input,.os-dialup-fields select{width:100%;min-width:0;height:25px;padding:2px 5px;border:2px inset #fff;background:#fff;color:#000}.os-dialup-fields select:disabled{background:#d4d0c8;color:#777}.os-save-password{margin-top:-1px!important}.os-save-password>span:last-child{display:flex;align-items:center;gap:6px}.os-save-password input{width:auto;height:auto}.os-dialup-separator{height:2px;margin:11px 0;border-top:1px solid #808080;border-bottom:1px solid #fff}.os-dialup-status{min-height:31px;margin:2px 6px 6px;padding:7px 8px;border:2px inset #fff;background:#fff;color:#111}.os-dialup .os-dialog-actions{margin-top:auto}
.os-modem-status-head{display:flex;align-items:center;gap:12px;padding:4px 2px 12px}.os-modem-status-head img{width:52px;height:52px;object-fit:contain;image-rendering:pixelated}.os-modem-status-head strong,.os-modem-status-head span{display:block}.os-modem-status-head span{margin-top:4px;color:#444}.os-modem-status .os-dialog-actions{margin-top:14px}
.os-message-box{display:grid;grid-template-columns:52px 1fr;gap:14px;align-items:start;min-height:82px;padding:8px}.os-message-box img{width:42px;height:42px;object-fit:contain;image-rendering:pixelated}.os-message-copy{padding-top:7px;line-height:1.4;user-select:text}.os-message-actions{justify-content:center;margin-top:6px}
@media(max-width:520px){.os-dialup-fields label{grid-template-columns:1fr;gap:3px}.os-save-password{grid-template-columns:1fr!important}.os-save-password>span:first-child{display:none}}

/* v0.2.4 - interactive Explorer / virtual file system ------------------------- */
.os-explorer-grid{position:relative!important;display:block!important;padding:0!important;min-height:0;overflow:auto;background:#fff}
.os-explorer-canvas{position:relative;min-width:100%;min-height:100%;background:#fff}
.os-explorer-canvas>.os-explorer-item{position:absolute!important;width:105px!important;height:96px!important;min-height:96px!important;margin:0!important;touch-action:none;z-index:1}
.os-explorer-canvas>.os-explorer-item.is-dragging{opacity:.72;z-index:6}
.os-explorer-canvas>.os-folder-empty{position:absolute;inset:0;min-height:180px;pointer-events:none;color:#666}
.os-explorer-context-menu{z-index:16000}
.os-new-folder-form{height:100%;display:flex;flex-direction:column;padding:10px}
.os-dialog-row{display:grid;grid-template-columns:48px 1fr;gap:12px;align-items:center;flex:1}
.os-dialog-row>img{width:40px;height:40px;image-rendering:pixelated}
.os-dialog-row label{display:block;margin-bottom:5px}
.os-dialog-row input{width:100%;height:25px;padding:2px 5px;border:2px inset #fff;background:#fff;color:#000}
.os-recycle-toolbar{display:flex;gap:8px;padding:6px;background:var(--os-face);border-bottom:2px groove #fff}
.os-recycle-grid{height:calc(100% - 38px)}

/* v0.3.0 - Games, Calculator, and expanded MS-DOS ---------------------------- */
.os-games-start-list{margin-top:0}.os-games-start-list>.os-start-item>.os-start-submenu{top:auto;bottom:0;max-height:min(560px,calc(100vh - var(--os-taskbar-height) - 12px));overflow-y:auto}.os-internet-game.is-disabled{color:#777;text-shadow:1px 1px #fff}.os-internet-game.is-disabled img{filter:grayscale(1);opacity:.55}.os-game-window .os-window-body{padding:0;overflow:hidden}.os-game-menubar{height:27px;display:flex;align-items:center;gap:18px;padding:3px 8px;background:var(--os-face);border-bottom:2px groove #fff}.os-game-menubar button{border:0!important;box-shadow:none!important;background:transparent!important;padding:2px 4px!important;min-width:0!important}.os-game-toolbar{min-height:34px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:4px 7px;background:var(--os-face);border-bottom:2px groove #fff}.os-canvas-game,.os-blockdrop{height:100%;display:flex;flex-direction:column;align-items:center;background:var(--os-face)}.os-canvas-game .os-game-toolbar,.os-blockdrop .os-game-toolbar{width:100%}.os-canvas-game canvas,.os-blockdrop canvas{display:block;max-width:100%;height:auto;margin:auto;border:2px inset #fff;background:#000;image-rendering:pixelated;outline:0}.os-canvas-game p,.os-blockdrop p{margin:5px 10px 9px;text-align:center;color:#333}
.os-assault{height:100%;display:flex;flex-direction:column;background:#080808}.os-assault-stage{position:relative;flex:1;min-height:0;display:flex;align-items:center;justify-content:center;background:#000}.os-assault-stage canvas{display:block;width:100%;height:100%;object-fit:contain;image-rendering:pixelated;outline:0}.os-assault-overlay{position:absolute;inset:0;display:grid;place-items:center;background:rgba(0,0,0,.74);color:#fff;text-align:center;padding:20px;z-index:3}.os-assault-overlay.is-hidden{display:none}.os-assault-overlay h2{font:700 34px/1 "Courier New",monospace;letter-spacing:2px;color:#f0d25b;text-shadow:2px 2px #6a1b16}.os-assault-overlay p{font:14px "Courier New",monospace}.os-assault-overlay button{font-weight:700!important;padding:6px 14px!important}.os-assault-hud{height:44px;display:flex;align-items:center;justify-content:space-around;gap:8px;background:#202020;color:#eee;border-top:3px ridge #777;font:bold 13px "Courier New",monospace}.os-assault-hud b{color:#f1d45b}
.os-mines{height:100%;padding:9px;background:var(--os-face)}.os-mine-top{height:54px;margin-bottom:8px;padding:5px 8px;display:flex;align-items:center;justify-content:space-between;border:3px inset #fff}.os-mine-top>span{min-width:62px;padding:3px 5px;background:#190000;color:#ff2929;font:bold 25px "Courier New",monospace;text-align:right;letter-spacing:2px}.os-mine-top button{font-size:20px!important;min-width:40px!important;height:38px}.os-mine-board{display:grid;grid-template-columns:repeat(9,1fr);border:3px inset #fff}.os-mine-cell{aspect-ratio:1;min-width:0!important;min-height:0!important;padding:0!important;border-width:2px!important;font:bold 16px Tahoma,Arial,sans-serif!important}.os-mine-cell.is-open{border:1px solid #888!important;background:#c0c0c0!important;box-shadow:none!important}.os-game-status{text-align:center;padding:8px}
.os-memory{height:100%;padding:10px;background:var(--os-face)}.os-memory-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;padding:14px}.os-memory-card{aspect-ratio:1;min-width:0!important;min-height:0!important;font:bold 34px Georgia,serif!important}.os-memory-card.is-up{background:#fff!important}.os-memory-card.is-found{opacity:.62}
.os-blockdrop canvas{width:min(300px,100%);max-height:540px}.os-chess{height:100%;display:flex;flex-direction:column;background:var(--os-face)}.os-chess-board{width:min(520px,calc(100% - 18px));aspect-ratio:1;margin:12px auto;display:grid;grid-template-columns:repeat(8,1fr);border:3px inset #fff}.os-chess-square{min-width:0!important;min-height:0!important;padding:0!important;border:0!important;box-shadow:none!important;font:44px/1 "Times New Roman",serif!important}.os-chess-square.light{background:#e8dfc8!important}.os-chess-square.dark{background:#81906d!important}.os-chess-square.selected{outline:4px solid #000080;outline-offset:-4px}.os-chess-square.legal{box-shadow:inset 0 0 0 4px rgba(0,0,128,.45)!important}.os-chess>p{text-align:center;margin:0 10px 10px}
.os-card-game{height:100%;display:flex;flex-direction:column;background:#08752d;overflow:hidden}.os-solitaire,.os-freecell{position:relative;flex:1;min-height:0;padding:12px;color:#fff;overflow:auto}.os-sol-top,.os-free-top{display:flex;align-items:flex-start;gap:12px;min-height:110px}.os-sol-gap{flex:1}.os-card,.os-card-slot{width:72px;height:96px;border-radius:3px}.os-card{position:relative;display:flex!important;flex-direction:column;justify-content:space-between;align-items:flex-start;min-width:72px!important;min-height:96px!important;padding:4px!important;background:#fff!important;border:1px solid #111!important;box-shadow:1px 1px 1px rgba(0,0,0,.35)!important;color:#111!important;font:bold 16px Georgia,serif!important}.os-card.red{color:#b00000!important}.os-card.back{background:repeating-linear-gradient(45deg,#153c8b 0 4px,#d5d5d5 4px 6px)!important;border:4px double #fff!important}.os-card.selected{outline:3px solid #ffe45c;outline-offset:-3px}.os-card b{align-self:center;font-size:30px}.os-card-slot{display:grid;place-items:center;border:2px solid rgba(0,0,0,.35);color:rgba(0,0,0,.45);font:bold 20px Georgia,serif}.os-tableaus,.os-free-cols{display:grid;grid-template-columns:repeat(7,72px);justify-content:space-between;gap:10px;margin-top:12px;min-width:590px}.os-tableau,.os-free-col{position:relative;min-height:370px}.os-table-card{position:absolute;left:0}.os-foundation,.os-stock,.os-waste,.os-free-top>div{width:72px;min-height:96px}.os-free-cols{grid-template-columns:repeat(8,72px);min-width:680px}.os-free-col{min-height:380px}
.os-hearts{height:100%;display:flex;flex-direction:column;background:var(--os-face)}.os-hearts-table{position:relative;flex:1;min-height:430px;background:#116b35;border:3px inset #fff}.os-hearts-player{position:absolute;color:#fff;font-weight:700}.os-hearts-player.north{top:12px;left:50%;transform:translateX(-50%)}.os-hearts-player.west{left:12px;top:45%}.os-hearts-player.east{right:12px;top:45%}.os-hearts-trick{position:absolute;left:50%;top:43%;width:250px;height:170px;transform:translate(-50%,-50%)}.trick-card{position:absolute;width:62px;height:84px;padding:7px;background:#fff;color:#111;border:1px solid #111;border-radius:3px;font:bold 17px Georgia,serif}.trick-card.red{color:#b00000}.trick-card.p0{left:94px;top:86px}.trick-card.p1{left:25px;top:48px}.trick-card.p2{left:94px;top:5px}.trick-card.p3{right:25px;top:48px}.os-hearts-hand{position:absolute;left:8px;right:8px;bottom:9px;display:flex;justify-content:center}.os-heart-card{width:54px!important;height:78px!important;min-width:0!important;min-height:0!important;margin-left:-14px;padding:4px!important;background:#fff!important;color:#111!important;border:1px solid #111!important;box-shadow:1px 1px #333!important;font:bold 15px Georgia,serif!important}.os-heart-card:first-child{margin-left:0}.os-heart-card.red{color:#b00000!important}.os-heart-card.legal:hover,.os-heart-card.legal:focus{transform:translateY(-10px)}.os-hearts-score{text-align:center;padding:7px;font-weight:700}
.os-internet-games{height:100%;padding:15px}.os-network-head{display:flex;align-items:center;gap:14px;padding-bottom:12px;border-bottom:2px groove #fff}.os-network-head img{width:54px;height:54px;image-rendering:pixelated}.os-network-head h2{margin:0 0 5px}.os-network-head p{margin:0}.os-network-list{display:grid;gap:8px;margin:14px 0}.os-network-list button{display:flex!important;flex-direction:column;align-items:flex-start!important;padding:8px!important;text-align:left}.os-network-list small{color:#555;margin-top:3px}
.os-calculator{height:100%;padding:10px;background:var(--os-face)}.os-calc-display{width:100%;height:39px;padding:4px 7px;border:3px inset #fff;background:#fff;text-align:right;font:20px "Courier New",monospace}.os-calc-keys{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-top:10px}.os-calc-keys button{height:52px!important;font-weight:700!important}.os-terminal-line [data-terminal-prompt]{white-space:pre}.os-terminal-input{min-height:18px}
@media(max-width:760px){.os-games-start-list>.os-start-item>.os-start-submenu{max-height:none}.os-assault-hud{font-size:10px;flex-wrap:wrap;height:auto;min-height:42px}.os-card,.os-card-slot{width:58px;height:82px;min-width:58px!important;min-height:82px!important}.os-tableaus{grid-template-columns:repeat(7,58px);min-width:490px}.os-free-cols{grid-template-columns:repeat(8,58px);min-width:550px}.os-foundation,.os-stock,.os-waste,.os-free-top>div{width:58px;min-height:82px}.os-chess-square{font-size:31px!important}}


/* v0.4.0: virtual PC, Paint, media player and screen saver */
.os-paint { display:flex; flex-direction:column; height:100%; background:#c0c0c0; }
.os-paint-menu { display:flex; gap:18px; padding:4px 8px; border-bottom:1px solid #808080; }
.os-paint-toolbar { display:flex; flex-wrap:wrap; align-items:center; gap:6px; padding:6px; border-top:1px solid #fff; border-bottom:2px groove #fff; }
.os-paint-toolbar button,.os-paint-toolbar label { min-height:28px; }
.os-paint-toolbar button.is-active { box-shadow:inset 1px 1px #000,inset -1px -1px #fff; background:#ddd; }
.os-paint-stage { flex:1; min-height:0; overflow:auto; padding:10px; background:#808080; }
.os-paint-stage canvas { display:block; max-width:none; background:#fff; box-shadow:0 0 0 1px #000; touch-action:none; cursor:crosshair; }
.os-paint-status { padding:4px 7px; border-top:2px groove #fff; }
.os-media-player { height:100%; display:grid; grid-template-rows:minmax(230px,1fr) auto 150px; background:#c0c0c0; }
.os-media-player-screen { min-height:0; display:grid; place-items:center; background:#000; color:#fff; margin:6px; border:2px inset #fff; overflow:hidden; }
.os-media-player-screen video { width:100%; height:100%; object-fit:contain; background:#000; }
.os-media-player-logo,.os-media-audio-card { display:grid; place-items:center; gap:8px; text-align:center; }
.os-media-player-logo img,.os-media-audio-card img { width:48px; height:48px; image-rendering:pixelated; }
.os-media-player-controls { display:flex; gap:8px; align-items:center; padding:5px 8px; border-top:2px groove #fff; border-bottom:2px groove #fff; }
.os-media-playlist { overflow:auto; padding:4px; background:#fff; }
.os-media-playlist button { width:100%; display:flex; align-items:center; gap:8px; text-align:left; padding:5px; border:0; background:#fff; }
.os-media-playlist button:focus,.os-media-playlist button:hover { background:#000080; color:#fff; }
.os-media-playlist img { width:24px; height:24px; image-rendering:pixelated; }
.os-screensaver { position:fixed; inset:0; z-index:2147483000; background:#000; overflow:hidden; cursor:none; }
.os-screensaver canvas { position:absolute; inset:0; width:100%; height:100%; }
.os-screensaver > div { position:absolute; right:6%; bottom:8%; color:#fff; font:bold 26px Arial,sans-serif; text-shadow:2px 2px #000080; }