/* Terror OS v0.4 | edición visual de acceso y oscuridad, sin dependencias */
:root{--accent:#c11f2f;--accent2:#5f151d;--bg:#060304;--panel:#0d090c;--panel2:#18090d;--edge:rgba(196,82,82,.18);--soft:#a79a9d;--white:#f8f1f1}
html,body{background:#070509;color:#f5edf2}
.lockscreen{
  min-height:100svh;display:block;overflow-x:hidden;overflow-y:auto;
  background-color:#070407;
  background-image:linear-gradient(180deg,rgba(4,2,6,.55) 0%,rgba(6,3,8,.38) 40%,rgba(5,2,6,.78) 100%),url('./assets/wallpaper-craneos-rojo.png');
  background-position:center center;background-size:cover;background-attachment:fixed
}
.lockscreen::before{background:radial-gradient(ellipse 68% 75% at 50% 54%,rgba(10,4,11,.27),rgba(2,1,4,.55))}
.lock-menu{height:45px;position:relative;z-index:2;background:#0704087d;border-bottom:1px solid #ffffff12;padding:0 26px}
.lock-shell{width:100%;min-height:calc(100svh - 45px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;padding:30px 18px 38px;position:relative;z-index:1}
.lock-center{position:static;left:auto;right:auto;top:auto;display:flex;flex-direction:column;align-items:center;text-shadow:0 5px 30px #000e}
.lock-date{font-size:14px;font-weight:550;color:#eee2e9;letter-spacing:.015em}
.lock-clock{font-size:clamp(73px,10vw,112px);letter-spacing:-.065em;line-height:1.07;font-weight:550;color:#faf1f7;font-variant-numeric:tabular-nums}
.signin-card{width:100%;max-width:395px;padding:28px 32px 20px;background:linear-gradient(154deg,#12080cdf,#080306f5);border:1px solid #c74d5f42;border-radius:22px;box-shadow:0 25px 85px #000d,inset 0 1px #ffffff0a;backdrop-filter:blur(26px);-webkit-backdrop-filter:blur(26px);text-align:left}
.signin-avatar{height:49px;width:49px;display:grid;place-items:center;margin:0 auto 9px;border-radius:15px;color:#ead0db;font-size:28px;background:linear-gradient(135deg,#a4182d,#2a0509);border:1px solid #ff8b963b;box-shadow:inset 0 1px #fff2,0 8px 22px #0009}
.signin-card h1{font-size:18px;font-weight:650;letter-spacing:-.025em;text-align:center;margin:0 0 20px;color:#fff6f7}
.signin-card label{display:block;font-size:12px;color:#d8c8cb;margin-bottom:7px;font-weight:520}
.signin-card input{width:100%;height:41px;border:1px solid #7e3b453d;background:#050203d2;border-radius:10px;margin:0 0 14px;padding:0 13px;color:#f9f2f7;font-size:14px;outline:none;box-shadow:inset 0 2px 6px #0007}
.signin-card input:focus{border-color:#d3354f96;box-shadow:0 0 0 3px #c9233e2c}
.signin-card input::placeholder{color:#726669}
.signin-primary{width:100%;height:42px;margin-top:4px;border:1px solid #d240556f;border-radius:10px;background:linear-gradient(140deg,#d6283f,#76111d);font-size:13px;font-weight:700;color:#fff;box-shadow:inset 0 1px #fff2,0 4px 16px #0007;cursor:pointer}
.signin-primary:hover{filter:brightness(1.12)}
.signin-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-top:13px}
.signin-actions button{min-width:0;min-height:37px;background:#ffffff07;border:1px solid #9c5a6640;border-radius:9px;color:#f1dde2;font-size:11px;cursor:pointer}
.signin-actions button:hover{background:#d33b4a24;border-color:#dc5e7165}
.signin-footnote{font-size:10px;color:#b09ca0;text-align:center;line-height:1.4;margin:17px 0 0}
.signin-feedback:empty{display:none}
.signin-feedback:not(:empty){text-align:center;color:#ffc3cc;font-size:11px;line-height:1.5;margin-top:10px}
/* Apagado del fondo y superficies manteniendo contraste legible. */
.desktop:not(.legacy){
 background-color:#080507;
 background-image:linear-gradient(150deg,rgba(3,2,5,.58) 0%,rgba(6,3,8,.42) 51%,rgba(4,2,6,.72) 100%),url('./assets/wallpaper-craneos-rojo.png');
 background-position:center center;background-size:cover
}
.desktop:not(.legacy)::after{background:linear-gradient(180deg,#04020580,transparent 20%,transparent 80%,#02010492)!important}
.desktop .topbar{background:#0c080edb;border-color:#d5aaba1c;backdrop-filter:blur(28px) saturate(90%)}
.desktop-grid{right:23px;top:25px}
.tile-name{background:#050307c9;color:#f6eaf3}
.desktop-tile:hover,.desktop-tile:focus-visible{background:#7a182024;border-color:#c84e6050}
.dock-body{background:linear-gradient(135deg,#19080ce8,#0a0507e0);border:1px solid #d8586a4c;box-shadow:0 11px 50px #000d,inset 0 1px #ffffff19;backdrop-filter:blur(26px)}
.os-icon:not(.folder-art){filter:brightness(.88) saturate(.8)}
.window{background:#090406f7;border:1px solid #b249593d;box-shadow:0 36px 120px #000e,inset 0 1px #fff1}
.window.is-active{border-color:#d0415b82}
.window-head{background:linear-gradient(180deg,#24090ead,#12050980);border-bottom:1px solid #9e39442e}
.window-body{background:linear-gradient(145deg,#0c070be8,#090407ed)}
.content-card{background:linear-gradient(145deg,#ffffff09,#ffffff03);border-color:#98505d29}
.finder-sidebar{background:#0d070ee9}
.finder-grid .desktop-tile:hover{background:#a1263229}
.admin-feature-row,.admin-bottom-row{background:#ffffff04;border-color:#9736422a}
.admin-stats .stat{background:#ffffff06;border-color:#9f4a5726}
.admin-item{background:#ffffff03;border-color:#9e45541f}
.admin-item:hover{background:#ffffff07;border-color:#ba475c43}
.quick-card{background:#ffffff04;border-color:#a2445628}
.quick-card:hover{background:#aa1f3222}
.btn.primary{background:linear-gradient(130deg,#d22a3d,#8a1021);color:#fff6f7;border-color:#e06b7b7c}
.terminal{background:#050b08;color:#91d7a0;border:1px solid #41564a66}
.terminal-shortcuts{padding:9px 13px 11px;color:#829689;font-size:10px;letter-spacing:.005em;border-top:1px solid #21432f6e;line-height:1.5}
@media(max-width:740px){
 .lock-menu{padding:0 15px}
 .lock-shell{justify-content:flex-start;padding:25px 14px 25px;gap:17px;min-height:calc(100svh - 45px)}
 .lock-clock{font-size:clamp(66px,16vw,86px)}
 .lock-date{font-size:12px}
 .signin-card{padding:22px 23px 18px;max-width:380px;border-radius:19px}
 .signin-card h1{margin-bottom:15px}
 .signin-card input{height:39px;margin-bottom:12px}
 .desktop-grid{top:auto;right:auto}
}
@media(max-height:690px) and (min-width:741px){
 .lock-shell{justify-content:flex-start;gap:10px;padding-top:16px;padding-bottom:15px}
 .lock-clock{font-size:74px}
 .signin-card{padding:18px 27px 13px;max-width:390px}
 .signin-card h1{margin-bottom:12px}
 .signin-card input{height:35px;margin-bottom:9px}
 .signin-card .signin-avatar{height:38px;width:38px;font-size:22px}
 .signin-footnote{margin-top:9px}
}
/* Desktop icons need independent vertical space for longer names and status markers. */
@media(min-width:741px){
 .desktop-grid{grid-template-rows:repeat(5,130px);grid-auto-columns:115px;column-gap:14px;row-gap:7px;right:21px;top:23px}
 .desktop-grid .desktop-tile{width:115px;min-height:124px;padding:7px 2px;gap:5px}
 .desktop-grid .tile-name{max-width:115px;line-height:1.22;overflow-wrap:break-word}
 .desktop-grid .tile-locked{margin-top:0;line-height:1.3}
}
@media(max-width:740px){
 .desktop-grid{grid-template-rows:none;grid-auto-columns:auto;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px 9px}
 .desktop-tile{min-height:112px}
 .tile-locked{margin-top:0}
}

/* v0.4.1 visual refinement */
.lock-shell{padding-left:max(18px,env(safe-area-inset-left));padding-right:max(18px,env(safe-area-inset-right));}
.signin-card{box-shadow:0 28px 110px #000f,inset 0 1px #ffffff08;}
.signin-card input{box-shadow:inset 0 2px 10px #000a;}
.desktop:not(.legacy)::after{background:linear-gradient(180deg,#03010296,transparent 18%,transparent 82%,#010001aa)!important}
.desktop .topbar{background:#080306e0;border-color:#c347571f}
.tile-name{background:#020102d6;color:#fff4f4;border:1px solid rgba(163,57,70,.18)}
.os-icon.folder-art svg{filter:drop-shadow(0 6px 8px rgba(0,0,0,.42));}
.folder-art .folder-emoji{position:absolute;right:-2px;bottom:0;font-size:16px;filter:drop-shadow(0 2px 3px rgba(0,0,0,.5));}
.signin-actions button{backdrop-filter:blur(10px);}
.window-body,.admin-feature-row,.admin-bottom-row,.content-card,.quick-card,.admin-item,.admin-stats .stat{backdrop-filter:blur(10px);}

/* v0.4.3 — balanced dock, keeping generous space between icons. */
@media (min-width:741px){
  .desktop:not(.legacy) .dock{
    bottom:16px;max-width:calc(100vw - 24px);padding:0;
  }
  .desktop:not(.legacy) .dock-body{
    gap:clamp(10px,1.15vw,16px);padding:11px 17px 9px;
    max-width:calc(100vw - 24px);overflow-x:auto;
    border-radius:25px;scrollbar-width:thin;
    scrollbar-color:#ac35484d transparent;
  }
  .desktop:not(.legacy) .dock .dock-item{
    width:76px;height:82px;flex:0 0 76px;
    border-radius:17px;
  }
  .desktop:not(.legacy) .dock .dock-item .os-icon{
    width:70px;height:70px;flex:0 0 70px;border-radius:16px;
  }
  .desktop:not(.legacy) .dock .dock-sep{
    height:58px;flex:0 0 1px;margin:0 4px 7px;
  }
  .desktop:not(.legacy) .dock .dock-item .dock-tooltip{bottom:calc(100% + 9px);}
  .desktop:not(.legacy) .desktop-main{padding-bottom:140px;}
  .desktop:not(.legacy) .window-layer{bottom:125px;}
}
@media (max-width:740px){
  .desktop:not(.legacy) .dock{
    left:0;right:0;bottom:max(10px,env(safe-area-inset-bottom));
    transform:none;width:100%;max-width:none;padding:0 8px;box-sizing:border-box;
  }
  .desktop:not(.legacy) .dock-body{
    display:flex;gap:10px;overflow-x:auto;overscroll-behavior-x:contain;
    scrollbar-width:none;max-width:100%;box-sizing:border-box;
    padding:8px 11px 6px;border-radius:19px;scroll-snap-type:x proximity;
  }
  .desktop:not(.legacy) .dock-body::-webkit-scrollbar{display:none;}
  .desktop:not(.legacy) .dock .dock-item{
    width:53px;height:60px;flex:0 0 53px;scroll-snap-align:center;
  }
  .desktop:not(.legacy) .dock .dock-item .os-icon{
    width:49px;height:49px;flex:0 0 49px;border-radius:12px;
  }
  .desktop:not(.legacy) .dock .dock-sep{height:42px;flex:0 0 1px;margin:0 2px 4px;}
  .desktop:not(.legacy) .desktop-grid{padding-bottom:111px;}
  .desktop:not(.legacy) .window-layer{bottom:96px;}
  .desktop:not(.legacy) .window,.desktop:not(.legacy) .window.narrow,
  .desktop:not(.legacy) .window.maximized,.desktop:not(.legacy) .window.maximized.narrow{
    height:calc(100svh - 145px);
  }
}