@media(max-width:1024px){
    .tool-grid{grid-template-columns:repeat(2,1fr)}
    .hero-title{font-size:22px}
    .sidebar{position:fixed;top:0;left:0;bottom:0;height:100vh;z-index:150;transform:translateX(-100%);box-shadow:none;border-right:var(--border-w) solid var(--border-color);transition:transform var(--transition)}
    .sidebar.open{transform:translateX(0);box-shadow:var(--neo-shadow-lg)}
    .sidebar.collapsed{transform:translateX(-100%)}
    .sidebar.collapsed.open{transform:translateX(0);width:var(--sidebar-width)}
    .sidebar-header-mobile{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:var(--border-w) solid var(--border-color);background:var(--bg-card)}
    .sidebar-mobile-title{display:flex;align-items:center;gap:10px;font-family:var(--font-heading);font-size:15px;font-weight:800;color:var(--accent-purple)}
    .sidebar-mobile-title .logo-skull{width:22px;height:22px}
    .sidebar-close-btn{background:var(--bg-input);border:var(--border-w) solid var(--border-color);color:var(--text-muted);cursor:pointer;display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:6px;transition:all var(--transition)}
    .sidebar-close-btn:hover{color:var(--error);border-color:var(--error);transform:scale(1.05)}
    .sidebar-close-btn i{width:16px;height:16px}
    .main-content.has-sidebar,.main-content.has-sidebar.sidebar-mini{margin-left:0}
    .sidebar-toggle-mobile{display:flex!important}
    .sidebar-collapse-btn{display:none}
    .live-coding-grid{grid-template-columns:1fr!important}
    .sidebar-overlay{z-index:140}
}

@media(max-width:768px){
    .tool-grid{grid-template-columns:1fr}
    .header-inner{padding:0 14px}
    .site-logo{font-size:14px}
    .hero{padding:28px 16px 20px}
    .hero-title{font-size:20px}
    .page-body{padding:16px 14px 60px}
    .tool-actions{flex-direction:column}
    .tool-actions .btn{width:100%}
    .online-status span{display:none}
    .ping-display{display:none}
    .shell-card{flex-direction:column;gap:10px;align-items:flex-start}
    .shell-actions{width:100%}
    .shell-actions .btn{flex:1}
    .about-grid{grid-template-columns:1fr!important}
    .social-grid{flex-direction:column}
    .social-card{width:100%}
    .index-search{max-width:100%;padding:0 4px}
    .form-textarea{min-height:120px}
    .color-picker-layout{flex-direction:column!important}
    .color-picker-layout > div:first-child{display:flex;justify-content:center}
    .terminal-frame{margin:0 -6px;border-radius:8px}
    .terminal-body{padding:18px 14px}
    .retro-stats{gap:10px;padding:0 8px}
    .rstat{min-width:85px;padding:12px 14px}
    .rstat-num{font-size:20px}
    .term-prompt{font-size:11px}
    .retro-badge{font-size:10px;padding:6px 12px}
    /* Sidebar mobile improvements */
    .sidebar{width:280px}
    .sidebar-link{padding:10px 14px;min-height:40px;font-size:14px}
    .sidebar-cat-title{padding:10px 12px;font-size:11px}
    .sidebar-search-input{padding:10px 14px 10px 32px;font-size:13px}
}

@media(max-width:600px){
    .hero-title{font-size:18px}
    h1{font-size:16px}
    h2{font-size:14px}
    .typewriter{font-size:12px}
    .breadcrumb{font-size:11px}
    .tool-header h1{font-size:15px}
    .tool-header p{font-size:12px}
    .card{padding:14px}
    .result-header{flex-wrap:wrap;gap:6px}
    .stat-grid-4{grid-template-columns:repeat(2,1fr)!important}
    .tabs{overflow-x:auto;-webkit-overflow-scrolling:touch;gap:0}
    .tab{white-space:nowrap;flex-shrink:0}
    .drop-zone{padding:20px 14px;min-height:100px}
    .drop-zone p{font-size:11px!important}
    .related-grid{grid-template-columns:1fr}
}

@media(max-width:480px){
    .site-logo{font-size:13px}
    .hero-title{font-size:16px}
    h1{font-size:14px}
    .card{padding:12px}
    .btn{padding:8px 14px;font-size:12px}
    .form-input,.form-textarea,.form-select{padding:9px 12px;font-size:12px}
    .tab{padding:8px 12px;font-size:12px}
    .error-code{font-size:48px!important}
    .error-img{max-width:200px!important}
    .pixel-deco{display:none}
    .index-search-kbd{display:none}
    .retro-stats{gap:8px;flex-direction:row}
    .rstat{min-width:70px;padding:10px;flex:1}
    .rstat-num{font-size:16px}
    .rstat-label{font-size:8px}
    .term-title{display:none}
    .retro-hero{padding:24px 12px 16px}
    /* Sidebar touch-friendly */
    .sidebar{width:260px}
    .sidebar-link{padding:12px 14px;min-height:44px;font-size:14px}
    .sidebar-link i{width:18px;height:18px}
    .sidebar-search{padding:10px 12px}
    .sidebar-header-mobile{padding:16px}
}

@media(max-width:360px){
    .hero-title{font-size:14px}
    .site-logo{font-size:12px}
    .header-right{gap:6px}
    .theme-btn{width:32px;height:32px}
    .online-dot{width:6px;height:6px}
    .online-status{font-size:10px}
    .sidebar{width:240px}
}

@media(max-height:500px) and (orientation:landscape){
    .hero{padding:16px 14px 12px}
    .hero-title{font-size:16px}
    .retro-stats{margin-top:10px;gap:12px}
    .retro-badge{margin-top:8px}
    .page-body{padding:12px 14px 40px}
}

@media print{
    body::before,body::after,.pixel-deco,.sidebar,.sidebar-toggle-mobile,.site-header,.theme-btn,.crt-scanline,.pixel-particles,.retro-corner{display:none!important}
    .main-content{margin-left:0!important;margin-top:0!important}
    .page-body{padding:0!important}
}