*{box-sizing:border-box}html,body{height:100%;margin:0;font-family:Tahoma, sans-serif;background:#008080;color:#000}
.hidden{display:none}

/* Splash */
.splash{position:fixed;inset:0;background:#000;color:#fff;display:flex;align-items:center;justify-content:center}
.splash-inner{width:min(520px,90%);text-align:center}
.win-logo{margin-bottom:24px}
.win-logo-img{width:160px;height:auto;image-rendering:pixelated;filter:drop-shadow(0 0 4px rgba(255,255,255,.25))}
.win-logo .brand{font-family:'VT323',monospace;font-size:44px;letter-spacing:1px}
.win-logo .ver{font-size:.8em}
.progress{height:18px;border:2px solid #777;background:#111;box-shadow:inset -2px -2px 0 #000,inset 2px 2px 0 #444}
.progress .bar{height:100%;width:0;background:#0a84ff;animation:load 3s linear forwards}
@keyframes load{to{width:100%}}
.boot-text{margin-top:10px;color:#ccc;font-size:14px}

/* Desktop */
.desktop{position:fixed;inset:0;background:#008080}
.icons{list-style:none;margin:12px;padding:0;display:flex;flex-direction:column;gap:24px;align-content:start;position:absolute;left:6px;top:12px}
.icon{width:120px;text-align:center;color:#fff;cursor:default}
.icon-link{appearance:none;-webkit-appearance:none;background:none;border:none;padding:0;margin:0;width:100%;color:inherit}
.icon-img{width:48px;height:48px;margin:0 auto 6px;background-size:cover;background-position:center}
.icon-label{display:inline-block;font-size:12px;line-height:1.2;text-shadow:1px 1px 0 #000;padding:2px 4px;border:1px solid transparent}

/* Hover selection like Win95 */
.icon:hover .icon-img,.icon-link:hover .icon-img{outline:1px dotted #000;outline-offset:2px}
.icon:hover .icon-label,.icon-link:hover .icon-label{background:#000080;color:#fff;border-color:#000080}

/* Specific Icon images */
.icon-img.pc{background-image:url('pc.ico')}
.icon-img.documents{background-image:url('belgelerim.ico')}
.icon-img.videos{background-image:url('videolarim.ico')}
.icon-img.pictures{background-image:url('resimlerim.ico')}
.icon-img.chat{background-image:url('chat95.ico')}
.icon-img.winmp3{background-image:url('winmp.ico')}

/* Win95 Window & Overlay */
.win-overlay{position:absolute;inset:0;background:rgba(0,0,0,.2);backdrop-filter:blur(0.5px);}
.win-window{position:absolute;left:80px;top:80px;width:min(960px,86vw);height:min(640px,70vh);display:flex;flex-direction:column;background:#c0c0c0;border:2px solid #fff;border-right-color:#808080;border-bottom-color:#808080;box-shadow:8px 8px 0 rgba(0,0,0,.25)}
.win-titlebar{display:flex;justify-content:space-between;align-items:center;background:linear-gradient(#000080,#000060);color:#fff;padding:2px 4px}
.win-window.dragging .win-titlebar{cursor:grabbing}
.win-titlebar{cursor:grab}
.win-title{display:flex;align-items:center;gap:6px;font-weight:700}
.win-title-icon{width:16px;height:16px;background:center/contain no-repeat;filter:drop-shadow(0 0 1px #000)}
.win-controls{display:flex;gap:4px}
.win-btn{width:22px;height:20px;background:#c0c0c0;border:2px solid #fff;border-right-color:#808080;border-bottom-color:#808080;line-height:16px;text-align:center;cursor:default;transition:transform .06s ease, filter .06s ease, box-shadow .06s ease}
.win-btn:hover{filter:brightness(1.05);box-shadow:inset -1px -1px 0 #000,inset 1px 1px 0 #fff}
.win-btn:active{transform:translateY(1px);filter:brightness(0.95)}

/* Locked window: hide resize handles and min/max buttons */
.win-window.locked .win-resizer{display:none}
.win-window.locked #btn-min,.win-window.locked #btn-max{display:none}
.win-content{flex:1;background:#fff;border:2px solid #808080;border-left-color:#fff;border-top-color:#fff;overflow:hidden}
.win-content iframe{width:100%;height:100%;display:block}
.win-statusbar{height:22px;background:#c0c0c0;border-top:2px solid #fff;box-shadow:inset 0 2px 0 #808080;padding:2px 6px;font-size:12px}

/* Ensure hidden state wins over base window/overlay display */
.win-window.hidden{display:none}
.win-overlay.hidden{display:none}

/* Dedicated WinMP3 window fixed size/pos */
#winmp3-window{left:565px;top:70px;width:417px;height:665px}

/* Mobile responsive adjustments */
@media (max-width: 768px) {
  #winmp3-window{left:10px;top:10px;width:calc(100vw - 20px);height:calc(100vh - 60px);max-width:400px;max-height:600px}
  .win-window{left:10px;top:10px;width:calc(100vw - 20px);height:calc(100vh - 60px)}
  .desktop .icons{gap:16px}
  .icon{width:100px}
  .icon-img{width:40px;height:40px}
  .icon-label{font-size:11px}
  .taskbar{height:40px}
  .start-btn{height:32px;padding:0 8px;font-size:12px}
  .copyright{font-size:10px}
  .clock{min-width:60px;font-size:11px}
}

/* Resizers */
.win-resizer{position:absolute;z-index:2}
.win-resizer.n{top:-3px;left:8px;right:8px;height:6px;cursor:n-resize}
.win-resizer.s{bottom:-3px;left:8px;right:8px;height:6px;cursor:s-resize}
.win-resizer.w{left:-3px;top:8px;bottom:8px;width:6px;cursor:w-resize}
.win-resizer.e{right:-3px;top:8px;bottom:8px;width:6px;cursor:e-resize}
.win-resizer.nw{top:-3px;left:-3px;width:10px;height:10px;cursor:nw-resize}
.win-resizer.ne{top:-3px;right:-3px;width:10px;height:10px;cursor:ne-resize}
.win-resizer.sw{bottom:-3px;left:-3px;width:10px;height:10px;cursor:sw-resize}
.win-resizer.se{bottom:-3px;right:-3px;width:10px;height:10px;cursor:se-resize}

/* Taskbar */
.taskbar{position:absolute;left:0;right:0;bottom:0;height:36px;background:#c0c0c0;border-top:2px solid #fff;box-shadow:inset 0 2px 0 #808080, inset 0 -2px 0 #fff;display:flex;align-items:center;padding:3px;justify-content:space-between}
.start-btn{display:flex;align-items:center;gap:6px;height:28px;padding:0 10px;border:2px solid #fff;border-right-color:#808080;border-bottom-color:#808080;background:#c0c0c0;font-weight:700;cursor:default}
.start-flag{width:18px;height:18px;background:url('logo.png') center/contain no-repeat}
.taskbar-center{flex:1;display:flex;justify-content:center;align-items:center}
.copyright{color:#000;font-size:11px;font-weight:700;text-align:center;padding:0 8px}
.tray{display:flex;align-items:center;gap:8px}
.clock{min-width:72px;text-align:center;border:2px solid #fff;border-right-color:#808080;border-bottom-color:#808080;padding:4px 6px;background:#c0c0c0;font-size:12px}
