*{margin:0;padding:0;box-sizing:border-box} :root{--win98-gray-light:#c0c0c0;--win98-gray:#808080;--win98-gray-dark:#404040;--win98-white:#ffffff;--win98-black:#000000;--win98-blue:#000080;--win98-blue-light:#0080ff;--win98-teal:#008080;--win98-green:#008000;--win98-red:#800000;--win98-yellow:#ffff00;--border-light:#ffffff;--border-dark:#808080;--border-darker:#000000;--border-inset-light:#808080;--border-inset-dark:#000000} body{font-family:'MS Sans Serif','MS Sans Serif','Arial',sans-serif;font-size:11px;background:url('/background.svg');background-size:cover;background-position:center;background-attachment:fixed;background-repeat:no-repeat;color:var(--win98-black);line-height:1.4;min-height:100vh;padding-bottom:30px;image-rendering:pixelated;image-rendering:-moz-crisp-edges;image-rendering:crisp-edges;cursor:default} .desktop{min-height:calc(100vh - 30px);padding:8px;padding-bottom:60px;position:relative;display:flex;flex-direction:column} .taskbar{position:fixed;bottom:0;left:0;right:0;height:30px;background:var(--win98-gray-light);border-top:2px solid var(--border-light);display:flex;align-items:center;z-index:10000;box-shadow:0 -2px 4px rgba(0,0,0,0.2)} .start-button-link{text-decoration:none;display:inline-block;position:relative} .start-button{height:24px;padding:0 8px;margin:0 2px;background:var(--win98-gray-light);border:2px outset var(--win98-gray-light);font-family:'MS Sans Serif',Arial,sans-serif;font-size:11px;font-weight:bold;color:var(--win98-black);cursor:pointer;display:flex;align-items:center} .start-button:hover{background:#e0e0e0} .start-button:active{border:2px inset var(--win98-gray-light);padding-top:1px;padding-left:1px} .start-icon{display:inline-block;margin-right:4px} .start-button.active{border:2px inset var(--win98-gray-light);padding-top:1px;padding-left:1px} .start-menu{position:absolute;bottom:30px;left:0;width:200px;background:var(--win98-gray-light);border:2px outset var(--win98-gray-light);box-shadow:2px -2px 4px rgba(0,0,0,0.3);z-index:10001} .start-menu-header{background:linear-gradient(to bottom,#000080 0%,#1084d0 100%);color:var(--win98-white);padding:4px 8px;font-size:11px;font-weight:bold} .start-menu-items{padding:2px 0} .start-menu-item{display:flex;align-items:center;padding:4px 8px;font-size:11px;color:var(--win98-black);cursor:pointer;text-decoration:none;border:none;background:none;width:100%;text-align:left} .start-menu-item:hover{background:var(--win98-blue);color:var(--win98-white)} .start-menu-icon{display:inline-block;width:20px;margin-right:8px;font-size:14px;text-align:center} .start-menu-text{flex:1} .start-menu-divider{height:1px;background:var(--border-dark);margin:2px 4px;border-top:1px solid var(--border-light)} .wallet-selector-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.3);display:flex;align-items:center;justify-content:center;z-index:20000} .wallet-selector-window{background:var(--win98-gray-light);border:2px outset var(--win98-gray-light);min-width:400px;max-width:500px;box-shadow:2px 2px 8px rgba(0,0,0,0.5)} .wallet-selector-content{padding:16px} .wallet-list{display:flex;flex-direction:column;gap:4px;margin-bottom:16px} .wallet-item{display:flex;align-items:center;padding:8px 12px;background:var(--win98-white);border:2px outset var(--win98-gray-light);cursor:pointer;transition:background 0.1s} .wallet-item:hover{background:#e0e0e0} .wallet-item:active{border:2px inset var(--win98-gray-light);padding-top:9px;padding-left:13px} .wallet-item-icon{width:40px;height:40px;display:flex;align-items:center;justify-content:center;margin-right:12px;background:var(--win98-gray-light);border:1px inset var(--win98-gray-light);overflow:hidden} .wallet-item-icon img{width:100%;height:100%;object-fit:contain;display:block} .wallet-item-info{flex:1;display:flex;flex-direction:column;gap:2px} .wallet-item-name{font-size:11px;font-weight:bold;color:var(--win98-black)} .wallet-item-status{font-size:10px;color:var(--win98-gray-dark)} .wallet-item-arrow{font-size:10px;color:var(--win98-gray-dark);margin-left:8px} .wallet-empty-state{text-align:center;padding:20px} .wallet-links{display:flex;flex-direction:column;gap:8px;align-items:center} .wallet-link{display:flex;align-items:center;gap:8px;padding:8px 16px;background:var(--win98-white);border:2px outset var(--win98-gray-light);text-decoration:none;color:var(--win98-black);font-size:11px;cursor:pointer} .wallet-link:hover{background:#e0e0e0} .wallet-link:active{border:2px inset var(--win98-gray-light);padding-top:9px;padding-left:17px} .wallet-link-icon{font-size:20px} .wallet-link-text{font-weight:bold} .wallet-selector-footer{display:flex;justify-content:flex-end;gap:8px;padding-top:12px;border-top:1px solid var(--border-dark)} .taskbar-window-button{height:22px;padding:0 8px;margin:0 2px;background:var(--win98-gray-light);border:2px outset var(--win98-gray-light);font-family:'MS Sans Serif',Arial,sans-serif;font-size:11px;color:var(--win98-black);cursor:pointer;display:flex;align-items:center;gap:4px} .taskbar-window-button:hover{background:#e0e0e0} .taskbar-window-button:active{border:2px inset var(--win98-gray-light);padding-top:1px;padding-left:1px} .taskbar-window-button.active{border:2px inset var(--win98-gray-light);background:#c0c0c0} .taskbar-window-button.minimized{border:2px outset var(--win98-gray-light);background:var(--win98-gray-light)} .taskbar-window-icon{display:inline-block;font-size:14px} .taskbar-window-text{display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:150px} .taskbar-tray{margin-left:auto;display:flex;align-items:center;height:100%;padding:0 4px;background:var(--win98-gray-light);border-left:1px solid var(--border-dark)} .tray-time{padding:0 8px;font-size:11px;color:var(--win98-black)} .window{background:var(--win98-gray-light);border:2px outset var(--win98-gray-light);margin:0;box-shadow:2px 2px 8px rgba(0,0,0,0.3);z-index:1000;user-select:none;position:relative;overflow:visible;display:flex;flex-direction:column;height:auto} .window:not(.maximized){position:absolute} .window.maximized{position:fixed;top:0;left:0;right:0;bottom:30px;max-width:none;margin:0} .resize-handle{position:absolute;background:transparent;z-index:10} .resize-handle-nw{top:-4px;left:-4px;width:8px;height:8px;cursor:nw-resize} .resize-handle-ne{top:-4px;right:-4px;width:8px;height:8px;cursor:ne-resize} .resize-handle-sw{bottom:-4px;left:-4px;width:8px;height:8px;cursor:sw-resize} .resize-handle-se{bottom:-4px;right:-4px;width:8px;height:8px;cursor:se-resize} .resize-handle-n{top:-4px;left:8px;right:8px;height:8px;cursor:n-resize} .resize-handle-s{bottom:-4px;left:8px;right:8px;height:8px;cursor:s-resize} .resize-handle-w{top:8px;bottom:8px;left:-4px;width:8px;cursor:w-resize} .resize-handle-e{top:8px;bottom:8px;right:-4px;width:8px;cursor:e-resize} .resize-handle:hover{background:rgba(0,0,0,0.1)} .title-bar{background:linear-gradient(to bottom,#000080 0%,#1084d0 100%);color:var(--win98-white);height:20px;display:flex;align-items:center;justify-content:space-between;padding:0 2px;font-size:11px;font-weight:bold;cursor:move} .title-bar-text{display:flex;align-items:center;gap:4px;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .window-icon{font-size:14px} .title-bar-controls{display:flex;gap:2px} .title-bar-button{width:16px;height:14px;border:1px outset var(--win98-gray-light);background:var(--win98-gray-light);cursor:pointer;font-size:9px;color:var(--win98-black);display:flex;align-items:center;justify-content:center;padding:0} .title-bar-button:hover{background:#e0e0e0} .title-bar-button:active{border:1px inset var(--win98-gray-light)} .title-bar-button.minimize::before{content:'_';font-weight:bold} .title-bar-button.maximize::before{content:'□';font-size:10px} .title-bar-button.close::before{content:'×';font-size:14px;line-height:1} .window-body{padding:2px;flex:1;display:flex;flex-direction:column;overflow:visible;min-height:0} .menu-bar{background:var(--win98-gray-light);border-bottom:1px solid var(--border-dark);display:flex;padding:0;height:22px} .menu-item{position:relative;padding:2px 8px;cursor:pointer;font-size:11px;border:1px solid transparent} .menu-item:hover{background:var(--win98-blue);color:var(--win98-white)} .menu-dropdown{display:none;position:absolute;top:100%;left:0;background:var(--win98-gray-light);border:2px outset var(--win98-gray-light);min-width:150px;z-index:1000;box-shadow:2px 2px 4px rgba(0,0,0,0.3)} .menu-item:hover .menu-dropdown{display:block} .menu-option{padding:4px 20px;font-size:11px;cursor:pointer;border-bottom:1px solid var(--border-dark);color:#000000} .menu-option-link{text-decoration:none;color:#000000;display:block} .menu-option-link:hover .menu-option{background:var(--win98-blue);color:var(--win98-white)} .menu-option:hover{background:var(--win98-blue);color:var(--win98-white)} .content-area{padding:8px;background:var(--win98-gray-light)} .welcome-section{text-align:center;margin-bottom:16px;padding:16px;background:var(--win98-white);border:2px inset var(--win98-gray-light)} .welcome-title{font-size:18px;font-weight:bold;margin-bottom:8px;color:var(--win98-blue)} .welcome-text{font-size:11px;color:var(--win98-black)} .upload-window,.info-window,.docs-window{background:var(--win98-white);border:2px inset var(--win98-gray-light);margin-bottom:16px} .window-title-bar{background:var(--win98-gray-light);border-bottom:1px solid var(--border-dark);padding:2px 4px;font-size:11px;font-weight:bold} .window-title-text{display:flex;align-items:center;gap:4px} .window-content{padding:8px} .upload-area{border:2px dashed var(--win98-gray);background:var(--win98-white);padding:32px 16px;text-align:center;cursor:pointer;margin-bottom:16px} .upload-area:hover,.upload-area.dragover{border-color:var(--win98-blue);background:#e6f3ff} .upload-icon-wrapper{margin-bottom:12px} .upload-icon{font-size:48px;display:inline-block} .upload-text{font-size:11px;color:var(--win98-black);margin-bottom:16px} .button-group{display:flex;gap:8px;justify-content:center} .btn-win98{padding:4px 12px;font-family:'MS Sans Serif',Arial,sans-serif;font-size:11px;font-weight:normal;border:2px outset var(--win98-gray-light);background:var(--win98-gray-light);color:var(--win98-black);cursor:pointer;min-width:75px;height:23px;display:inline-flex;align-items:center;justify-content:center} .btn-win98:hover{background:#e0e0e0} .btn-win98:active{border:2px inset var(--win98-gray-light)} .btn-win98:disabled{border:2px inset var(--win98-gray-light);color:var(--win98-gray);cursor:not-allowed;opacity:0.6} .btn-primary{font-weight:bold} .btn-upload{width:100%;margin-top:16px;font-weight:bold;font-size:12px;height:28px} .btn-copy{margin-left:8px} .file-list{margin-top:16px;max-height:200px;overflow-y:auto;background:var(--win98-white);border:2px inset var(--win98-gray-light);padding:4px} .file-item{padding:4px 8px;font-size:11px;border-bottom:1px solid var(--border-dark);display:flex;justify-content:space-between} .file-item:last-child{border-bottom:none} .file-name{color:var(--win98-black);flex:1} .file-size{color:var(--win98-gray-dark)} .progress-container{margin-top:16px} .progress-bar-win98{width:100%;height:20px;background:var(--win98-white);border:2px inset var(--win98-gray-light);padding:2px} .progress-fill-win98{height:100%;background:var(--win98-blue);width:0%;transition:width 0.3s ease} .progress-text{text-align:center;margin-top:8px;font-size:11px;color:var(--win98-black)} .result-container{margin-top:16px;background:var(--win98-white);border:2px inset var(--win98-gray-light);padding:12px} .result-header{display:flex;align-items:center;gap:8px;margin-bottom:12px} .success-icon{font-size:18px;color:var(--win98-green);font-weight:bold} .result-header h3{font-size:14px;font-weight:bold;color:var(--win98-black)} .result-info{display:flex;flex-direction:column;gap:8px} .result-item{display:flex;justify-content:space-between;align-items:center;font-size:11px} .result-item.full-width{flex-direction:column;align-items:flex-start;gap:4px} .result-label{color:var(--win98-black);font-weight:bold} .result-value{color:var(--win98-black)} .url-box-win98{width:100%;display:flex;gap:4px} .url-input-win98{flex:1;padding:4px;border:2px inset var(--win98-gray-light);background:var(--win98-white);font-family:'Courier New',monospace;font-size:11px;color:var(--win98-black)} .url-input-win98:focus{outline:1px dotted var(--win98-black)} .features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px} .feature-card-win98{background:var(--win98-white);border:2px inset var(--win98-gray-light);padding:12px;text-align:center} .feature-icon{font-size:32px;margin-bottom:8px} .feature-card-win98 h3{font-size:12px;font-weight:bold;margin-bottom:4px;color:var(--win98-blue)} .feature-card-win98 p{font-size:10px;color:var(--win98-black);line-height:1.4} .api-doc h3{font-size:12px;font-weight:bold;margin-top:16px;margin-bottom:8px;color:var(--win98-blue)} .api-doc h3:first-child{margin-top:0} .code-win98{background:var(--win98-white);border:2px inset var(--win98-gray-light);padding:8px;overflow-x:auto;margin-top:8px;font-size:10px} code{font-family:'Courier New','Courier',monospace;color:var(--win98-black);line-height:1.6} .footer-win98{text-align:center;padding:16px;font-size:10px;color:var(--win98-black);background:var(--win98-gray-light);border-top:2px solid var(--border-dark);position:fixed;bottom:30px;left:0;right:0;z-index:1} .footer-win98 a{color:var(--win98-blue);text-decoration:underline} .footer-win98 a:hover{color:var(--win98-blue-light)} ::-webkit-scrollbar{width:16px;height:16px} ::-webkit-scrollbar-track{background:var(--win98-gray-light);border:1px inset var(--win98-gray-light)} ::-webkit-scrollbar-thumb{background:var(--win98-gray-light);border:2px outset var(--win98-gray-light)} ::-webkit-scrollbar-thumb:hover{background:var(--win98-gray)} ::-webkit-scrollbar-button{background:var(--win98-gray-light);border:1px outset var(--win98-gray-light);width:16px;height:16px} ::-webkit-scrollbar-button:active{border:1px inset var(--win98-gray-light)} @media (max-width:768px){.window{margin:8px} .features-grid{grid-template-columns:1fr} .button-group{flex-direction:column} .btn-win98{width:100%} } .explorer-window{display:flex;flex-direction:column;height:100%;background:var(--win98-white)} .explorer-toolbar{background:var(--win98-gray-light);border-bottom:1px solid var(--border-dark);padding:4px;display:flex;align-items:center} .toolbar-buttons{display:flex;align-items:center;gap:2px} .toolbar-btn{width:24px;height:24px;border:1px outset var(--win98-gray-light);background:var(--win98-gray-light);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:12px;padding:0} .toolbar-btn:hover{background:#e0e0e0} .toolbar-btn:active{border:1px inset var(--win98-gray-light)} .toolbar-btn.active{border:1px inset var(--win98-gray-light);background:#c0c0c0} .toolbar-separator{width:2px;height:20px;background:var(--border-dark);margin:0 4px} .explorer-address-bar{background:var(--win98-white);border-bottom:1px solid var(--border-dark);padding:4px 8px;display:flex;align-items:center;gap:8px} .address-label{font-size:11px;font-weight:bold;color:var(--win98-black)} .address-input{flex:1;display:flex;align-items:center;gap:4px;padding:2px 4px;border:2px inset var(--win98-gray-light);background:var(--win98-white);font-size:11px} .address-icon{font-size:12px} .address-text{flex:1;color:var(--win98-black)} .address-go-btn{padding:2px 12px;border:1px outset var(--win98-gray-light);background:var(--win98-gray-light);font-size:11px;cursor:pointer} .address-go-btn:hover{background:#e0e0e0} .address-go-btn:active{border:1px inset var(--win98-gray-light)} .explorer-content{flex:1;overflow:auto;background:var(--win98-white);position:relative} .explorer-loading,.explorer-error,.explorer-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;padding:40px;text-align:center} .loading-spinner,.error-icon,.empty-icon{font-size:48px;margin-bottom:16px} .explorer-loading p,.explorer-error p,.explorer-empty p{font-size:14px;color:var(--win98-black);margin:8px 0;font-weight:500} .empty-subtitle{font-size:10px;color:var(--win98-gray-dark)} .error-retry-btn{margin-top:16px;padding:4px 16px;border:1px outset var(--win98-gray-light);background:var(--win98-gray-light);font-size:11px;cursor:pointer} .error-retry-btn:hover{background:#e0e0e0} .error-retry-btn:active{border:1px inset var(--win98-gray-light)} .explorer-details-view{width:100%;display:flex;flex-direction:column;overflow:hidden} .details-header{display:grid;grid-template-columns:60% 40%;background:var(--win98-gray-light);border-bottom:2px solid var(--border-dark);font-size:13px;font-weight:bold;color:var(--win98-black);width:100%;padding:2px 0;box-sizing:border-box} .details-header-cell{padding:6px 12px;border-right:1px solid var(--border-dark);cursor:pointer;user-select:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;box-sizing:border-box;min-width:0} .details-header-cell.details-col-name{grid-column:1} .details-header-cell.details-col-creator{grid-column:2} .details-header-cell:hover{background:#d0d0d0} .details-header-cell:last-child{border-right:none} .details-list{width:100%;display:flex;flex-direction:column;overflow-x:auto} .details-row{display:grid;grid-template-columns:60% 40%;border-bottom:1px solid var(--border-light);cursor:pointer;font-size:13px;width:100%;min-height:32px;transition:background-color 0.1s ease;box-sizing:border-box} .details-row:hover{background:#e8f4f8} .details-row.selected{background:#316ac5;color:var(--win98-white)} .details-row.selected .file-name{color:var(--win98-white);font-weight:600} .details-row.selected .file-icon{filter:brightness(0) invert(1)} .details-cell{padding:8px 12px;border-right:1px solid var(--border-light);display:flex;align-items:center;gap:8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;box-sizing:border-box;line-height:1.4} .details-cell.details-col-name{grid-column:1} .details-cell.details-col-creator{grid-column:2} .details-cell:last-child{border-right:none} .file-icon{font-size:18px;display:inline-block;flex-shrink:0} .file-name{color:var(--win98-black);font-weight:500;font-size:13px} .details-row.selected .file-name{color:var(--win98-white)} .explorer-grid-view{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:4px;padding:8px;background:var(--win98-white);overflow:auto;align-content:start} .grid-item{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;width:100px;min-height:80px;padding:8px 4px;cursor:pointer;border:1px dotted transparent;background:transparent;transition:background-color 0.1s ease;position:relative} .grid-item:hover{background:rgba(0,0,0,0.05)} .grid-item.selected{background:rgba(49,106,197,0.1);border-color:#316ac5;border-style:dotted} .grid-item-icon{font-size:48px;margin-bottom:4px;display:flex;align-items:center;justify-content:center;width:64px;height:64px;flex-shrink:0} .grid-item-name{font-size:11px;text-align:center;word-break:break-word;color:var(--win98-black);line-height:1.2;font-weight:normal;max-width:100%;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;padding:2px 4px;background:rgba(255,255,255,0.9);border:1px solid rgba(0,0,0,0.1);border-radius:2px;margin-top:2px;width:calc(100% - 8px)} .grid-item.selected .grid-item-name{background:rgba(49,106,197,0.2);color:var(--win98-black);font-weight:500;border-color:rgba(49,106,197,0.3)} .grid-item.selected .grid-item-icon{filter:brightness(0.9)} .explorer-status-bar{background:var(--win98-gray-light);border-top:1px solid var(--border-dark);padding:4px 8px;display:flex;justify-content:space-between;font-size:12px;color:var(--win98-black);height:24px;align-items:center;font-weight:500} .status-left,.status-right{display:flex;align-items:center} .status-left{border-right:1px solid var(--border-dark);padding-right:8px;margin-right:8px} .explorer-cards-view{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px;padding:12px;background:var(--win98-white);overflow:auto;align-content:start}.preview-card{background:var(--win98-white);border:2px outset var(--win98-gray-light);cursor:pointer;transition:all 0.1s ease;display:flex;flex-direction:column;overflow:hidden}.preview-card:hover{border-color:var(--win98-blue);box-shadow:2px 2px 4px rgba(0,0,0,0.2)}.preview-card.selected{border:2px inset var(--win98-gray-light);background:#e8f4f8}.preview-card-image{width:100%;height:180px;background:var(--win98-gray-light);border-bottom:1px solid var(--border-dark);position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center}.preview-card-image img{width:100%;height:100%;object-fit:cover;display:block}.preview-card-fallback{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:var(--win98-gray-light)}.preview-fallback-icon{font-size:64px;opacity:0.5}.preview-fallback-favicon{width:64px;height:64px;object-fit:contain;opacity:0.7}.preview-card-content{padding:8px;display:flex;flex-direction:column;gap:4px}.preview-card-title{font-size:13px;font-weight:bold;color:var(--win98-black);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.preview-card-meta{display:flex;flex-direction:column;gap:2px;font-size:10px;color:var(--win98-gray-dark)}.preview-card-creator,.preview-card-date{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}