:root{--taskbar-height:48px;--taskbar-bg:#f2f0ea;--taskbar-border:#111;--button-bg:#fff;--button-text:#111;--button-hover:#ece9df;--titlebar-bg:#e8e8e8;--titlebar-text:#111;--primary-color:#0b5ed7;--primary-text-color:#fff;--primary-inactive-text-color:gray;--titlebar-height:32px;--titlebar-inactive-bg:#fff;--titlebar-inactive-text:gray;--desktop-bg:#00a9a9}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;min-height:100svh;margin:0;font-family:Noto Sans JP,Hiragino Kaku Gothic ProN,Yu Gothic UI,sans-serif}.app-shell{grid-template-rows:1fr var(--taskbar-height);width:100%;height:100%;min-height:100svh;display:grid}.desktop{border-bottom:1px solid var(--taskbar-border);background-color:var(--desktop-bg);background-repeat:no-repeat;background-size:26% 22%,30% 24%,22% 20%,28% 22%,100% 100%;position:relative;overflow:hidden}.taskbar{background:linear-gradient(180deg, #f8f6f0 0%, var(--taskbar-bg) 100%);border-top:1px solid var(--taskbar-border);justify-content:space-between;align-items:center;gap:12px;padding:0 24px;display:flex}.taskbar-actions{align-items:center;gap:8px;display:flex}.clock-display{text-align:right;color:#111;font-variant-numeric:tabular-nums;min-width:88px;font-size:14px}.taskbar-center{flex:1;justify-content:flex-start;align-items:center;gap:4px;display:flex;overflow:hidden}.taskbar-button-group{z-index:100;flex-direction:column;align-items:flex-start;display:flex;position:relative}.taskbar-button{background:var(--button-bg);height:44px;color:var(--button-text);cursor:pointer;white-space:nowrap;text-overflow:ellipsis;border:1px solid #ccc;border-radius:4px;align-items:center;gap:6px;max-width:120px;padding:0 8px;font-size:12px;transition:background-color .2s,color .2s;display:flex;overflow:hidden}.taskbar-button:hover{background-color:#e9ecef}.taskbar-button-active{border-color:#bbb;color:#111!important;background-color:#dddad0!important}.taskbar-button-active:hover{background-color:#d0cdc2!important}.taskbar-button-icon{flex-shrink:0;justify-content:center;align-items:center;width:16px;height:16px;display:flex}.taskbar-button-icon svg{fill:none;stroke:currentColor;stroke-width:2px;width:100%;height:100%}.taskbar-button-label{text-overflow:ellipsis;overflow:hidden}.taskbar-dropdown-menu{z-index:100000;background:#fff;border:1px solid #999;border-radius:4px;min-width:150px;max-width:220px;box-shadow:0 4px 8px #00000026}.taskbar-dropdown-item{color:#111;text-align:left;cursor:pointer;white-space:nowrap;text-overflow:ellipsis;background:#fff;border:none;width:100%;padding:8px 12px;font-size:12px;transition:background-color .2s;display:block;overflow:hidden}.taskbar-dropdown-item:hover{background-color:#e9ecef}.taskbar-dropdown-item-active{color:#fff;background-color:#0b5ed7}.taskbar-dropdown-item-active:hover{background-color:#0a58ca}.window-frame{color:#707070;touch-action:none;border:1px solid #000;position:absolute;overflow:clip;box-shadow:0 4px 16px #0006,0 2px 4px #00000026}.window-frame-active{color:#111}.window-titlebar{height:var(--titlebar-height);background:var(--titlebar-inactive-bg);color:var(--titlebar-inactive-text);cursor:move;-webkit-user-select:none;user-select:none;touch-action:none;border-bottom:1px solid #777;justify-content:space-between;align-items:center;gap:8px;padding:0 8px;display:flex}.window-frame-active .window-titlebar{color:#fff;background:#0b5ed7;border-color:#000}.window-frame-active .window-title{font-weight:700}.window-icon{width:16px;height:16px;color:inherit;flex-shrink:0;justify-content:center;align-items:center;display:flex}.window-icon svg{fill:none;stroke:currentColor;stroke-width:2px;width:100%;height:100%}.window-title{text-overflow:ellipsis;white-space:nowrap;margin-right:8px;font-size:13px;overflow:hidden}.window-close-button{color:inherit;cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;width:28px;height:28px;padding:0;font-size:24px;font-weight:500;line-height:1;display:flex}.window-frame-active .window-close-button:hover{color:#fff;background:#d33}.window-canvas{display:block}.terminal-panel{grid-template-rows:1fr auto;height:calc(100% - 32px);display:grid}.terminal-screen{color:#333;white-space:pre-wrap;background:#fff;border:0;margin:0;padding:8px;font-family:Noto Sans Mono CJK JP,BIZ UDGothic,Courier New,monospace;font-size:13px;line-height:1.45;overflow-y:auto}.terminal-command-form{background:#ddd;border-top:1px solid #aaa;grid-template-columns:1fr auto;align-items:center;gap:8px;padding:8px;display:grid}.terminal-command-input{color:#333;background:#fff;border:1px solid #000;width:100%;height:32px;padding:0 8px;font-size:14px}.terminal-command-button{color:#333;cursor:pointer;background:#fff;border:1px solid #000;min-width:72px;height:32px}.terminal-command-button:hover{background:#f0f0f0}@media (width<=900px){.app-shell{grid-template-rows:1fr var(--taskbar-height)}}.taskbar-left{align-items:center;display:flex;position:relative}.hamburger-menu{background:var(--button-bg);color:var(--button-text);cursor:pointer;border:none;justify-content:center;align-items:center;width:47px;height:47px;padding:0;display:flex}.hamburger-menu:hover{background:var(--button-hover)}.menu-popup{z-index:999;background:#fff;border:1px solid #111;min-width:160px;margin-bottom:2px;position:absolute;bottom:100%;left:0;box-shadow:2px 2px 8px #0003}.menu-popup.hidden{display:none}.menu-item{color:#111;text-align:left;cursor:pointer;background:0 0;border:none;align-items:center;gap:8px;width:100%;padding:8px 12px;font-family:inherit;font-size:14px;display:flex}.menu-item-icon{flex-shrink:0;justify-content:center;align-items:center;width:16px;height:16px;display:flex}.menu-item-icon svg{fill:none;stroke:currentColor;stroke-width:2px;width:100%;height:100%}.menu-item-label{white-space:nowrap}.menu-item:hover{background:#ece9df}.filemanager-panel{background:#fff;flex-direction:column;height:calc(100% - 32px);padding:8px;display:flex;overflow:hidden}.filemanager-list{background:#fff;border:1px solid #777;outline:none;flex:1;font-family:Noto Sans Mono CJK JP,BIZ UDGothic,Courier New,monospace;font-size:13px;line-height:1.6;overflow-y:auto}.filemanager-item{cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap;text-overflow:ellipsis;align-items:center;gap:8px;padding:4px 8px;display:flex;overflow:hidden}.filemanager-item-icon{color:#333;flex-shrink:0;justify-content:center;align-items:center;width:16px;height:16px;display:inline-flex}.filemanager-item-icon svg{width:16px;height:16px}.filemanager-item-name{text-overflow:ellipsis;flex:1;overflow:hidden}.filemanager-item-selected,.window-frame-active .filemanager-item-selected{color:#fff;background:#0b5ed7}.window-frame:not(.window-frame-active) .filemanager-item-selected{color:#111;background:silver}.window-frame-active .filemanager-item-selected .filemanager-item-icon{color:#fff}.window-frame:not(.window-frame-active) .filemanager-item-selected .filemanager-item-icon{color:#111}.filemanager-item-selected:hover{background:#0a4cbd}.window-frame:not(.window-frame-active) .filemanager-item-selected:hover{background:#a8a8a8}.filemanager-item:not(.filemanager-item-selected):hover{background:#e0e0e0}.filemanager-empty{color:#999;padding:8px;font-style:italic}.about-panel{background:#fff;flex-direction:column;gap:8px;height:calc(100% - 32px);padding:8px;display:flex;overflow:hidden}.about-info{word-break:break-all;background:#f5f5f5;border:1px solid #ddd;border-radius:4px;padding:8px;line-height:1.6}.about-app-name{margin-bottom:6px;font-size:16px;font-weight:700}.about-version{color:#666;font-size:11px}.about-license-container{flex-direction:column;flex:1;gap:4px;max-height:200px;display:flex;overflow:hidden}.about-license-container label{padding:0 4px;font-size:12px;font-weight:700}.about-license-text{color:#111;white-space:pre-wrap;word-wrap:break-word;-webkit-user-select:text;user-select:text;background:#fff;border:1px solid #999;flex:1;padding:8px;font-family:Courier New,monospace;font-size:11px;line-height:1.4;overflow-y:auto}.about-license-text strong{font-weight:700}.about-button-container{justify-content:flex-end;gap:8px;padding:4px 0;display:flex}.about-ok-button{color:#fff;cursor:pointer;background:#0b5ed7;border:1px solid #0b5ed7;border-radius:2px;padding:6px 16px;font-size:12px;font-weight:700}.about-ok-button:hover{background:#0a4cbd}.about-github-button{color:#06c;cursor:pointer;background:0 0;border:1px solid #06c;border-radius:2px;padding:6px 16px;font-size:12px;font-weight:700}.about-github-button:hover{background:#e7f1ff}.window-secondary-button{cursor:pointer;border:1px solid #999;border-radius:2px;padding:6px 16px;font-size:12px;font-weight:700;transition:all .15s ease-in-out}.window-frame-active .window-secondary-button{color:#333;background:#f5f5f5}.window-frame-active .window-secondary-button:hover{background:#e0e0e0}.window-frame:not(.window-frame-active) .window-secondary-button{color:#999;background:0 0;border-color:#d0d0d0}.window-frame:not(.window-frame-active) .window-secondary-button:hover{background:#f5f5f5}.textviewer-panel{background:#fff;flex-direction:column;width:100%;height:calc(100% - 32px);display:flex;overflow:hidden}.textviewer-container{flex-direction:column;flex:1;display:flex;overflow:hidden}.textviewer-textarea{color:#111;resize:none;white-space:pre;word-wrap:normal;background:#fff;border:none;flex:1;padding:8px;font-family:Courier New,monospace;font-size:12px;line-height:1.4;overflow-y:auto}.window-primary-button{cursor:pointer;border:1px solid #0b5ed7;border-radius:2px;padding:6px 16px;font-size:12px;font-weight:700;transition:all .15s ease-in-out}.window-frame-active .window-primary-button{background:var(--primary-color);color:var(--primary-text-color)}.window-frame-active .window-primary-button:hover{background:#0a4cbd}.window-frame:not(.window-frame-active) .window-primary-button{color:var(--primary-inactive-text-color);background:0 0;border-color:#d0d0d0}.window-frame:not(.window-frame-active) .window-primary-button:hover{background:#f5f5f5}.onboarding-panel{background-position:50%;background-repeat:no-repeat;background-size:cover;flex-direction:column;gap:0;height:calc(100% - 32px);padding:0;display:flex;overflow:hidden}.onboarding-content{flex-direction:column;flex:1;gap:12px;padding:16px;display:flex;overflow-y:auto}.onboarding-title{color:#0b5ed7;margin:0;font-size:36px;font-weight:700}.onboarding-description{color:#333;margin:0;font-size:14px;line-height:1.5}.onboarding-description a{color:#0b5ed7;font-weight:500;text-decoration:none}.onboarding-description a:hover{text-decoration:underline}.onboarding-features{color:#333;margin:0;padding-left:20px;font-size:14px;line-height:1.6}.onboarding-feature-item{margin-bottom:8px}.onboarding-tips{background:#f0f7ff;border-left:4px solid #0b5ed7;border-radius:2px;padding:8px 12px}.onboarding-tips h3{color:#0b5ed7;margin:0 0 8px;font-size:12px;font-weight:700}.onboarding-tips-list{color:#333;margin:0;padding-left:20px;font-size:12px;line-height:1.6}.onboarding-tip-item{margin-bottom:6px}.onboarding-button-container{justify-content:flex-end;gap:8px;margin-top:auto;padding:12px 16px;display:flex}.onboarding-close-button{color:#fff;cursor:pointer;background:#0b5ed7;border:1px solid #0b5ed7;border-radius:2px;padding:6px 16px;font-size:14px;font-weight:700}.onboarding-close-button:hover{background:#0a4cbd}.taskbar-volume-container{align-items:center;gap:8px;display:flex;position:relative}.taskbar-volume-button{cursor:pointer;color:#111;background:0 0;border:none;justify-content:center;align-items:center;width:24px;height:24px;padding:0;transition:opacity .2s;display:flex}.taskbar-volume-button:hover{opacity:.7}.taskbar-volume-button svg{fill:none;stroke:currentColor;stroke-width:2px;width:100%;height:100%}.volume-popup{z-index:1000;background:#fff;border:1px solid #ccc;border-radius:4px;flex-direction:column;align-items:center;gap:10px;width:240px;margin-bottom:8px;padding:10px 12px;display:flex;position:absolute;bottom:100%;right:0;box-shadow:0 2px 8px #0000001a}.volume-popup.hidden{display:none}.volume-display{color:#111;text-align:center;min-width:30px;font-size:18px;font-weight:600}.volume-controls{align-items:center;gap:10px;width:100%;display:flex}.volume-icon{color:#111;flex-shrink:0;justify-content:center;align-items:center;width:20px;height:20px;display:flex}.volume-icon svg{fill:none;stroke:currentColor;stroke-width:2px;width:100%;height:100%}.volume-slider{appearance:none;cursor:pointer;background:#e0e0e0;border-radius:4px;outline:none;flex:1;min-width:100px;height:8px}.volume-slider::-webkit-slider-thumb{appearance:none;cursor:pointer;background:#0b5ed7;border:none;border-radius:50%;width:16px;height:16px;box-shadow:0 1px 3px #0003}.volume-slider::-moz-range-track{background:0 0;border:none}.volume-slider::-moz-range-thumb{cursor:pointer;background:#0b5ed7;border:none;border-radius:50%;width:16px;height:16px;box-shadow:0 1px 3px #0003}.system-modal-overlay{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);pointer-events:all;background-color:#00000080;width:100%;height:100%;position:fixed;top:0;left:0}.system-modal-frame{pointer-events:all;background:#fff;border:none;border-radius:24px;flex-direction:column;display:flex;position:absolute;overflow:hidden;box-shadow:0 10px 40px #0000004d,0 0 0 1px #0000001a}.system-modal-frame-active{box-shadow:0 10px 40px #0006,0 0 0 1px #00000026}.system-modal-close-button{cursor:pointer;color:#111;z-index:10;background:0 0;border:none;border-radius:4px;justify-content:center;align-items:center;width:32px;height:32px;padding:0;transition:background-color .2s;display:flex;position:absolute;top:12px;right:12px}.system-modal-close-button:hover{background-color:#00000014}.system-modal-close-button svg{stroke:currentColor;stroke-width:2px;fill:none;width:20px;height:20px}.system-modal-panel{background:#fff;flex-direction:column;flex:1;padding:0;display:flex;overflow:hidden}.system-modal-content{color:#111;flex-direction:column;flex:1;justify-content:center;align-items:center;padding:32px;display:flex;overflow-y:auto}.system-modal-title{color:#111;margin:0 0 16px;font-size:18px;font-weight:600}.system-modal-message{color:#333;white-space:pre-line;text-align:center;margin:0 0 24px;font-size:14px;line-height:1.6}.system-modal-spacer{flex:none;height:2.5em}.system-modal-message-import{margin:0;font-size:16px;line-height:1.8}.system-modal-message-complete{margin:0 0 24px;font-size:15px}.system-modal-button-container{justify-content:flex-end;gap:8px;width:100%;padding-top:16px;display:flex}.system-modal-button{color:#fff;cursor:pointer;background-color:#0b5ed7;border:none;border-radius:4px;padding:8px 24px;font-size:14px;font-weight:500;transition:background-color .2s}.system-modal-button:hover{background-color:#0a58ca}.system-modal-button:active{background-color:#0d5fcf}