:root{
  --bg:#0a0a0a; --ink:#f2f2f2; --edge:rgba(255,255,255,0.08); --edge-strong:rgba(255,255,255,0.16);
  --soft:rgba(255,255,255,0.03); --chrome:#121212; --accent:#f2f2f2; --muted:#cfcfcf; --win-bg:rgba(12,12,12,.92);
}
.bright-mode{
  --bg:#f0f0f0; --ink:#0a0a0a; --edge:rgba(0,0,0,0.1); --edge-strong:rgba(0,0,0,0.18);
  --soft:rgba(0,0,0,0.03); --chrome:#e9e9e9; --accent:#0a0a0a; --muted:#555; --win-bg:rgba(242,242,242,.92);
}

*{box-sizing:border-box}
html,body{height:100%; transition: background .3s ease, color .3s ease;}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"Space Mono",monospace;line-height:1.45;letter-spacing:.2px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow:hidden}

.bg{position:fixed;inset:0;pointer-events:none}
.vignette{z-index:0;background:radial-gradient(1400px 900px at 50% 40%, rgba(255,255,255,0.05), rgba(0,0,0,0) 55%), radial-gradient(closest-side at 50% 50%, rgba(0,0,0,0) 70%, rgba(0,0,0,0.7) 110%)}
.bright-mode .vignette{display:none;}
.pixel-dust{z-index:1;overflow:hidden}
.pixel-dust .p{position:absolute;background:var(--ink);image-rendering:pixelated;animation:floatY linear infinite;filter:contrast(115%);border-radius:1px; will-change: transform; transition: transform 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);}
@keyframes floatY{0%{transform:translateY(0) translateX(0)}50%{transform:translateY(-10px) translateX(6px)}100%{transform:translateY(0) translateX(0)}}
.noise{z-index:1;opacity:.06;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='1' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)' opacity='.8'/></svg>");background-size:160px 160px;mix-blend-mode:overlay;animation:noiseShift 7s linear infinite}
.bright-mode .noise{opacity: 0.1;}
.scanlines{z-index:2;background:repeating-linear-gradient(0deg, rgba(255,255,255,0.06) 0px, rgba(255,255,255,0.06) 1px, transparent 1px, transparent 3px);opacity:.05;animation:scan 6s linear infinite; transition: opacity 0.3s;}
.bright-mode .scanlines{background: repeating-linear-gradient(0deg, rgba(0,0,0,0.06) 0px, rgba(0,0,0,0.06) 1px, transparent 1px, transparent 3px);}
.dither{z-index:2;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='8' height='8'><rect width='8' height='8' fill='black'/><rect x='0' y='0' width='1' height='1' fill='white' opacity='.18'/><rect x='4' y='4' width='1' height='1' fill='white' opacity='.18'/></svg>");image-rendering:pixelated;opacity:.05;mix-blend-mode:soft-light}
.bright-mode .dither{display:none;}
@keyframes noiseShift{0%{background-position:0 0}100%{background-position:1000px 600px}}
@keyframes scan{0%{background-position-y:0}100%{background-position-y:4px}}

/* === Base Layout === */
.mode{ position:fixed; inset:0; }
#desktop{ display:flex; flex-direction:column; }
#phone{ display:none; }

/* === Mobile Layout & CRITICAL FIX === */
@media (max-width:900px){
  #desktop{ display:none !important; }
  #phone{ display:block !important; }

  #phone {
    position: fixed; inset: 0; z-index: 5; overflow: hidden;
  }
  #phone .app-sheet, #phone .home-screen {
    position: fixed;
    inset: 32px 0 48px 0;
    display: none; /* Hide all by default, JS will show the active one */
    flex-direction: column;
    background: var(--bg);
    z-index: 10;
  }
  #phone .app-sheet.active, #phone .home-screen.active {
    display: flex;
  }
  #phone .sheet-body {
    flex: 1 1 auto; min-height: 0; overflow-y: auto; -webkit-overflow-scrolling: touch;
    overflow-x: hidden; /* Prevent horizontal scroll in all apps */
  }

  /* FIX: About section layout on mobile */
  .about-wrap {
    grid-template-columns: 1fr !important;
  }
}

.lockscreen{ position:fixed; inset:0; z-index:80; background:var(--bg); display:none; flex-direction:column; align-items:center; justify-content:center; }
.lockscreen.active{ display:flex !important; }

.menubar{height:28px;background:linear-gradient(180deg,var(--chrome),#0d0d0d); color:#e5e5e5; border-bottom:1px solid var(--edge);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 10px;font-size:12px;z-index:5}
.bright-mode .menubar{background:linear-gradient(180deg, var(--chrome), #e0e0e0); color: #333;}
.menu-left{display:flex;align-items:center;gap:10px}
.menu-center{display:flex;justify-content:center}
.menu-right{display:flex;justify-content:flex-end;gap:10px;align-items:center}
.brand{font-family:"Press Start 2P",monospace;font-size:11px}
.hint-bar{opacity:.8;color:#d4d4d4;font-size:11px;padding:3px 8px;border:1px dashed var(--edge);border-radius:6px;background:rgba(255,255,255,0.02);backdrop-filter:blur(1px)}
.bright-mode .hint-bar{color:#444; background: rgba(0,0,0,0.02);}
.status-song{max-width:300px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:.9}

#desktop-icons{position:absolute;top:56px;left:50%;transform:translateX(-50%);display:grid;grid-template-columns:repeat(3, 92px);gap:16px;z-index:3; grid-auto-flow: row; justify-content: center;}
.icon{width:92px;height:92px;background:rgba(255,255,255,0.03);border:1px solid var(--edge);border-radius:12px;color:#e9e9e9;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;backdrop-filter:blur(2px);cursor:pointer;user-select:none;font-family: "Space Mono", monospace;}
.bright-mode .icon{background: rgba(0,0,0,0.03); color: var(--ink);}
.icon .glyph{font-family:"Press Start 2P",monospace;font-size:18px}
.icon span:last-child{font-size:12px}
.icon:hover{background:rgba(255,255,255,0.07)}
.bright-mode .icon:hover{background: rgba(0,0,0,0.07);}

.window{position:absolute;left:120px;top:120px;width:min(980px,84vw);height:min(600px,66vh);background:var(--win-bg);border:1px solid var(--edge);border-radius:12px;backdrop-filter:blur(4px);display:none;flex-direction:column;z-index:6;box-shadow:0 16px 70px rgba(0,0,0,.65)}
.bright-mode .window{box-shadow: 0 16px 70px rgba(0,0,0,.25);}
.window.active{display:flex}
.titlebar{height:32px;display:flex;align-items:center;justify-content:space-between;padding:0 10px;border-bottom:1px solid var(--edge);background:linear-gradient(180deg,#161616,#0f0f0f);cursor:move}
.bright-mode .titlebar{background: linear-gradient(180deg,#fefefe,#f0f0f0);}
.title{font-family:"Press Start 2P",monospace;font-size:12px}
.win-ctrls .btn-close{border:1px solid var(--edge);background:#0b0b0b;color:#fff;border-radius:6px;height:22px;width:28px;cursor:pointer}
.bright-mode .win-ctrls .btn-close{background: #fdfdfd; color: #111;}
.window-body{flex:1;overflow:auto;padding:12px}

.card{background:linear-gradient(180deg, var(--soft), transparent);border:1px solid var(--edge);border-radius:12px;padding:16px}
.kicker{color:#b9b9b9;text-transform:uppercase;letter-spacing:2px;font-size:11px;margin-bottom:6px}
.bright-mode .kicker{color: #777;}
.title-main{font-family:"Press Start 2P",monospace;font-size:22px;margin:0 0 8px; word-break: break-word;}
.lead{color:#e3e3e3;font-size:14px;margin-bottom:10px}
.bright-mode .lead{color: #333;}
.pills{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
.pill{border:1px dashed var(--edge);border-radius:999px;padding:6px 10px;font-size:12px;color:#dedede}
.bright-mode .pill{color: #222;}
.about-wrap{display:grid;grid-template-columns:300px 1fr;gap:14px;align-items:start}
.portrait{overflow:hidden}
.portrait img{width:100%;height:100%;object-fit:cover;filter:grayscale(100%) contrast(120%)}
.bright-mode .portrait img{filter: grayscale(80%) contrast(105%);}
.about-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px}

.toolbar{display:flex;gap:10px;align-items:center;border:1px solid var(--edge);border-radius:10px;padding:6px 8px;background:rgba(255,255,255,0.02)}
.bright-mode .toolbar{background: rgba(0,0,0,0.02);}
.spacer{flex:1}

.input,textarea,select{width:100%;background:transparent;color:var(--ink);border:1px solid var(--edge);border-radius:10px;padding:10px;font-family:inherit}
select{padding-right: 30px; appearance: none; background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23f2f2f2' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e"); background-repeat: no-repeat; background-position: right 10px center; background-size: 1em;}
.bright-mode select {background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230a0a0a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");}
[dir="rtl"] select { background-position: left 10px center; padding-left: 30px; padding-right: 10px; }
textarea{min-height:120px;resize:vertical}
.form-actions{display:flex;gap:10px;align-items:center;margin-top:8px}
.btn{appearance:none;background:transparent;color:var(--ink);border:1px solid var(--edge);padding:10px 14px;border-radius:10px;text-decoration:none;font-size:12px;display:inline-flex;align-items:center;gap:8px;cursor:pointer}
.btn.primary{background:var(--ink);color:var(--bg);border-color:var(--ink);font-weight:700}
.btn:active{transform:translateY(1px)}

.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px}
.gallery-grid .tile{position:relative;border:1px solid var(--edge);border-radius:10px;overflow:hidden;background:#0b0b0b;min-height:140px}
.bright-mode .gallery-grid .tile{background: #e0e0e0;}
.gallery-grid .tile img{width:100%;height:100%;object-fit:cover;display:block}
.desktop-vhs .tile img{filter:grayscale(100%) contrast(125%) brightness(92%);image-rendering:pixelated;transform:scale(1.01);transition:transform .8s cubic-bezier(.22,.9,.25,1), filter .5s ease}
.desktop-vhs .tile:hover img{transform:scale(1.06) skewX(.6deg);filter:grayscale(0%) contrast(102%) brightness(100%) drop-shadow(1px 0 0 #ff0048) drop-shadow(-1px 0 0 #00fff2)}
.mobile-color .tile img{filter:none}

.dock{position:absolute;left:50%;transform:translateX(-50%);bottom:12px;height:auto; min-height:62px; background:rgba(255,255,255,0.05);border:1px solid var(--edge);border-radius:16px;display:flex;flex-wrap:wrap; gap:10px;align-items:center;padding:8px 10px;backdrop-filter:blur(4px);z-index:7; max-width: 95vw; justify-content: center;}
.bright-mode .dock{background: rgba(0,0,0,0.05);}
.dock-item{height:46px;width:72px;border:1px solid var(--edge);border-radius:12px;background:#0b0b0b;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:4px;cursor:pointer; flex-shrink: 0;}
.bright-mode .dock-item{background: #fafafa; color: #111;}
.dock-item .glyph{font-family:"Press Start 2P",monospace;font-size:13px}
.dock-item span:last-child{font-size:10px;opacity:.9; text-align: center; word-break: break-word; line-height: 1.2;}

.tutorial{position:fixed;inset:0;background:rgba(0,0,0,.6);display:none;align-items:center;justify-content:center;z-index:50}
.tutorial.active{display:flex}
.tutorial-card{width:min(560px,90vw);background:rgba(14,14,14,.98);border:1px solid var(--edge);border-radius:14px;padding:18px;box-shadow:0 12px 80px rgba(0,0,0,.7)}
.bright-mode .tutorial-card{background: rgba(250,250,250,0.98); box-shadow: 0 12px 80px rgba(0,0,0,.3);}
.tutorial-title{font-family:"Press Start 2P",monospace;font-size:16px;margin-bottom:10px}
.tutorial-steps{margin:0 0 14px 18px;color:#dcdcdc;line-height:1.7}
[dir="rtl"] .tutorial-steps { margin: 0 18px 14px 0; }
.bright-mode .tutorial-steps{color: #333;}
.tutorial-steps li{margin-bottom:6px}

.modal{position:fixed;inset:0;display:none;align-items:center;justify-content:center;background:rgba(0,0,0,.88);z-index:40;padding:30px}
.bright-mode .modal{background: rgba(255,255,255,0.88);}
.modal.show{display:flex}
.modal-card{width:92%;max-width:1100px;border:2px solid var(--edge);border-radius:12px;overflow:hidden;background:#0b0b0b;display:flex;align-items:center;justify-content:center;padding:18px}
.bright-mode .modal-card{background: #f0f0f0;}
.modal-card img{width:100%;height:80vh;object-fit:contain;background:#0b0b0b}
.bright-mode .modal-card img{background: #f0f0f0;}
.ctrl{position:absolute;z-index:42;height:44px;min-width:44px;padding:0 10px;border:2px solid var(--edge);border-radius:8px;background:rgba(0,0,0,.45);color:#f2f2f2;font-family:"Press Start 2P",monospace;font-size:22px;line-height:40px;display:flex;align-items:center;justify-content:center;cursor:pointer;backdrop-filter:blur(2px)}
.bright-mode .ctrl{background:rgba(255,255,255,.45); color: #111;}
.prev{left:24px}
.next{right:24px}
.close{top:24px;right:24px}
[dir="rtl"] .prev { right: 24px; left: auto; }
[dir="rtl"] .next { left: 24px; right: auto; }
[dir="rtl"] .close { left: 24px; right: auto; }

.hint{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);font-size:11px;font-family:"Press Start 2P",monospace;color:#dcdcdc;background:rgba(0,0,0,.35);border:1px solid var(--edge);border-radius:8px;padding:8px 10px;opacity:.95}
.bright-mode .hint{background:rgba(255,255,255,.35); color: #111;}

.music-app{display:grid;grid-template-columns:320px 1fr;gap:12px}
.music-app.mobile{grid-template-columns:1fr}
.music-now{display:flex;gap:12px;align-items:flex-start}
.music-cover{width:120px;height:120px;object-fit:cover;border:1px solid var(--edge);border-radius:10px;background:#0b0b0b;image-rendering:pixelated}
.music-meta{flex:1;min-width:0}
.music-title{font-family:"Press Start 2P",monospace;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.music-artist{font-size:12px;color:#d0d0d0;margin-bottom:6px}
.bright-mode .music-artist{color: #555;}
.music-progress{display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:center;margin-top:6px}
.music-controls{display:flex;gap:8px;align-items:center;margin-top:8px}
.music-list{max-height:320px;overflow:auto}
#playlist,#m-playlist{list-style:none;margin:0;padding:0}
.track{display:grid;grid-template-columns:42px 1fr auto;gap:10px;align-items:center;padding:8px;border-radius:10px;border:1px solid transparent;cursor:pointer}
.track img{width:42px;height:42px;object-fit:cover;border:1px solid var(--edge);border-radius:8px;background:#0b0b0b;image-rendering:pixelated}
.track span{font-size:13px;color:#f0f0f0}
.bright-mode .track span{color: #111;}
.track i{font-size:12px;color:#bdbdbd}
.bright-mode .track i{color: #666;}
.track:hover{background:rgba(255,255,255,0.04);border-color:var(--edge)}
.bright-mode .track:hover{background: rgba(0,0,0,0.04);}
.track.active{background:rgba(255,255,255,0.07);border-color:var(--edge-strong)}
.bright-mode .track.active{background: rgba(0,0,0,0.07);}

input[type="range"]{appearance:none;height:18px;background:transparent;width:100%}
input[type="range"]::-webkit-slider-runnable-track{height:4px;background:linear-gradient(90deg,#fff,#999);border-radius:999px}
.bright-mode input[type="range"]::-webkit-slider-runnable-track{background: linear-gradient(90deg, #333, #999);}
input[type="range"]::-webkit-slider-thumb{appearance:none;margin-top:-6px;width:14px;height:14px;border-radius:3px;background:#fff;border:1px solid #000;box-shadow:0 0 0 2px #000}
.bright-mode input[type="range"]::-webkit-slider-thumb{background: #111; border: 1px solid #fff; box-shadow: 0 0 0 2px #fff;}
input[type="range"]::-moz-range-track{height:4px;background:linear-gradient(90deg,#fff,#999);border-radius:999px}
.bright-mode input[type="range"]::-moz-range-track{background: linear-gradient(90deg, #333, #999);}
input[type="range"]::-moz-range-thumb{width:14px;height:14px;border-radius:3px;background:#fff;border:1px solid #000}
.bright-mode input[type="range"]::-moz-range-thumb{background: #111; border: 1px solid #fff;}

#phone .statusbar{height:32px;background:#0f0f0f;border-bottom:1px solid var(--edge);display:flex;align-items:center;justify-content:space-between;padding:0 10px;color:#d7d7d7;z-index:6}
.bright-mode #phone .statusbar{background: #e9e9e9; color: #333;}
.sb-left,.sb-right{font-size:12px}
.sb-center{font-size:12px;opacity:.95;max-width:40vw;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

#ls-time{font-family:"Press Start 2P",monospace;font-size:26px}
#ls-date{font-size:12px;color:#d0d0d0}
.bright-mode #ls-date{color: #555;}
.ls-icons{position:absolute;top:10px;right:10px;display:flex;gap:8px;color:#e0e0e0}
[dir="rtl"] .ls-icons { right: auto; left: 10px; }
.ls-swipe{position:absolute;bottom:42px;left:50%;transform:translateX(-50%);display:flex;gap:8px;align-items:center;border:1px dashed var(--edge);border-radius:999px;padding:8px 14px;background:rgba(255,255,255,0.03)}
.bright-mode .ls-swipe{background: rgba(0,0,0,0.03);}
.ls-swipe .chevron{font-family:"Press Start 2P",monospace;font-size:12px;animation:chev 1.4s ease-in-out infinite}
[dir="rtl"] .ls-swipe .chevron { transform: scaleX(-1); }
.ls-swipe .text{font-size:12px;color:#eaeaea;opacity:.9;animation:shine 2.4s ease-in-out infinite}
.bright-mode .ls-swipe .text{color: #222;}
@keyframes chev{0%{opacity:.2;transform:translateX(0)}50%{opacity:1;transform:translateX(6px)}100%{opacity:.2;transform:translateX(0)}}
@keyframes shine{0%{opacity:.6}50%{opacity:1}100%{opacity:.6}}
.ls-legal{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);font-size:11px;color:var(--muted);opacity:0.6;text-decoration:none;padding:4px 8px;}
.ls-legal:hover{opacity:1;text-decoration:underline;}


.app-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding:8px 12px}
.app{aspect-ratio:1/1;background:rgba(255,255,255,0.06);border:1px solid var(--edge);border-radius:16px;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px; font-family: "Space Mono", monospace; padding: 4px;}
.app span:last-child { font-size: 11px; text-align: center; line-height: 1.2; word-break: break-word; }
.bright-mode .app{background: rgba(0,0,0,0.06); color: var(--ink);}
.app .glyph{font-family:"Press Start 2P",monospace}
.sheet-bar{height:44px;display:flex;align-items:center;justify-content:space-between;padding:0 10px;border-bottom:1px solid var(--edge);background:linear-gradient(180deg,#151515,#0f0f0f)}
.bright-mode .sheet-bar{background: linear-gradient(180deg, #fdfdfd, #f0f0f0);}
.sheet-back,.sheet-close{border:1px solid var(--edge);background:#0b0b0b;color:#fff;border-radius:8px;height:28px;width:36px}
.bright-mode .sheet-back, .bright-mode .sheet-close{background: #fdfdfd; color: #111;}

.nav-bar{position:fixed;left:0;right:0;bottom:0;height:48px;background:#0f0f0f;border-top:1px solid var(--edge);display:flex;align-items:center;justify-content:space-around;z-index:7}
.bright-mode .nav-bar{background: #e9e9e9;}
.nav-btn{height:36px;width:56px;border:1px solid var(--edge);border-radius:10px;background:#0b0b0b;color:#fff;font-size:18px}
.bright-mode .nav-btn{background: #fdfdfd; color: #111;}

.files-app.mobile{display:block}
.files-tree{display: none;}
@media (min-width: 980px) {
    .files-app{display:grid;grid-template-columns:220px 1fr 280px;gap:12px}
    .files-tree {display: block;}
}
.files-main{display:flex;flex-direction:column;gap:10px}
.files-toolbar{display:flex;align-items:center;justify-content:space-between;border:1px solid var(--edge);border-radius:10px;padding:8px 10px;background:rgba(255,255,255,0.02)}
.bright-mode .files-toolbar{background: rgba(0,0,0,0.02);}
#files-path,#mfiles-path{font-size:12px;color:#d8d8d8}
.bright-mode #files-path, .bright-mode #mfiles-path{color: #444;}
.files-actions{display:flex;gap:8px}
.files-list{padding:10px}
.files-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px}
.file-row{display:grid;grid-template-columns:36px 1fr auto;gap:10px;align-items:center;border:1px solid transparent;border-radius:10px;padding:8px;cursor:pointer}
.file-row:hover{background:rgba(255,255,255,0.04);border-color:var(--edge)}
.bright-mode .file-row:hover{background: rgba(0,0,0,0.04);}
.file-row.active{background:rgba(255,255,255,0.07);border-color:var(--edge-strong)}
.bright-mode .file-row.active{background: rgba(0,0,0,0.07);}
.file-icon{width:32px;height:32px;border:1px solid var(--edge);border-radius:6px;display:flex;align-items:center;justify-content:center;background:#0b0b0b;font-family:"Press Start 2P",monospace}
.bright-mode .file-icon{background: #fafafa;}
.file-name{font-size:13px;color:#f0f0f0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bright-mode .file-name{color: #111;}
.file-meta{font-size:12px;color:#bdbdbd}
.bright-mode .file-meta{color: #666;}
.files-inspector{padding:12px}
.insp-title{font-family:"Press Start 2P",monospace;font-size:12px;margin-bottom:8px}
.insp-body{font-size:13px;color:#dcdcdc;display:flex;flex-direction:column;gap:8px}
.bright-mode .insp-body{color: #333;}
.insp-actions{display:flex;gap:8px;margin-top:8px}

.status-icon{ width:14px; height:14px; image-rendering:pixelated; filter:invert(1) grayscale(1) contrast(115%); opacity:.9; vertical-align:middle; }
.bright-mode .status-icon{ filter: invert(0) grayscale(1) contrast(115%); }
.menu-right .status-icon{margin-left:6px}
.ls-icons .status-icon{width:16px;height:16px;margin-left:8px}

.lockscreen { touch-action: none; }

/* === TERMINAL APP === */
.terminal-body{ padding: 8px; background: rgba(0,0,0,0.2); display: flex; flex-direction: column; }
.bright-mode .terminal-body{ background: rgba(255,255,255,0.2); }
.terminal-output{ flex: 1; overflow-y: auto; font-family: "Space Mono", monospace; font-size: 13px; line-height: 1.6; color: #f0f0f0; }
.bright-mode .terminal-output{ color: #111; }
.terminal-output pre{ margin: 0; white-space: pre-wrap; word-break: break-all; }
.terminal-prompt{ display: flex; align-items: center; margin-top: 8px; }
.prompt-user{ color: #87d7ff; white-space: nowrap; }
.bright-mode .prompt-user{ color: #005f87; }
[dir="rtl"] .prompt-user { order: 2; }
.terminal-input{ flex: 1; background: transparent; border: none; outline: none; color: inherit; font: inherit; padding-left: 8px; }
[dir="rtl"] .terminal-input { padding-left: 0; padding-right: 8px; }
.terminal-output .prompt-line{color: #87d7ff;}
.bright-mode .terminal-output .prompt-line{color: #005f87;}
.terminal-output .cmd-output{color: #f0f0f0;}
.bright-mode .terminal-output .cmd-output{color: #111;}
.terminal-output .cmd-error{color: #ff8787;}
.bright-mode .terminal-output .cmd-error{color: #d70000;}

/* === TEXT VIEWER APP === */
.viewer-body { padding: 8px; }
.viewer-body pre { white-space: pre-wrap; word-wrap: break-word; font-family: "Space Mono", monospace; font-size: 13px; }

/* === SETTINGS APP === */
.settings-app{ display: flex; flex-direction: column; gap: 20px; }
.section-title{ font-family: "Press Start 2P", monospace; font-size: 14px; margin: 0; }
.setting-item{ display: flex; justify-content: space-between; align-items: center; gap: 12px;}
.setting-item label { flex-shrink: 0; }
.setting-item input[type="range"] { width: 100%; max-width: 150px; }
.setting-item select { max-width: 150px; }
.toggle-switch{ position: relative; display: inline-block; width: 50px; height: 28px; }
.toggle-switch input{ opacity: 0; width: 0; height: 0; }
.slider{ position: absolute; cursor: pointer; inset: 0; background-color: #333; border-radius: 28px; transition: .4s; }
.bright-mode .slider{ background-color: #ccc; }
.slider:before{ position: absolute; content: ""; height: 20px; width: 20px; left: 4px; bottom: 4px; background-color: white; border-radius: 50%; transition: .4s; }
input:checked + .slider{ background-color: #f2f2f2; }
.bright-mode input:checked + .slider{ background-color: #0a0a0a; }
input:checked + .slider:before{ transform: translateX(22px); }
.slim-range::-webkit-slider-thumb{ width: 12px; height: 20px; margin-top: -8px; border-radius: 4px;}

/* === SNAKE APP FIXES === */
#win-snake .window-body,
#app-snake .sheet-body {
    overflow: hidden; /* Prevents scrolling inside the game window/app */
    display: flex;
    justify-content: center;
    align-items: center;
}
.snake-wrap{
    display:flex;
    flex-direction:column;
    gap:10px;
    align-items:center;
    width: 100%;
    height: 100%;
}
.snake-wrap .snake-topbar{width:100%;display:flex;align-items:center;justify-content:space-between;border:1px solid var(--edge);border-radius:10px;padding:8px 10px;background:rgba(255,255,255,0.02)}
.bright-mode .snake-wrap .snake-topbar{background: rgba(0,0,0,0.02);}
.snake-score{font-family:"Press Start 2P",monospace;font-size:12px}
#snake-canvas,#msnake-canvas{border:1px solid var(--edge);border-radius:10px;background:#0b0b0b;image-rendering:pixelated; flex-shrink: 1;}
.bright-mode #snake-canvas, .bright-mode #msnake-canvas{background: #e9e9e9;}
.snake-hint{font-size:11px;color:#bdbdbd}
.bright-mode .snake-hint{color: #666;}
.snake-wrap.mobile #msnake-canvas{width:100%;height:auto;max-width:460px}
#app-snake .snake-controls{ display: flex !important; flex-direction: column; align-items: center; gap: 10px; }
#app-snake .snake-controls .mid{ display: flex; justify-content: center; align-items: center; gap: 66px; width: auto; margin: 0 auto; }
#app-snake .snake-controls .dpad{ --d: clamp(48px, 14vw, 64px); width: var(--d); height: var(--d); flex: 0 0 auto; margin: 0; }