/* KaSH Design Makeover • October 2026
   Non-destructive presentation layer: existing application styles and logic preserved.
*/
:root{
  --kash-violet:#7554db;--kash-violet-strong:#6743cc;--kash-plum:#251e3c;
  --kash-outline:#e6dff1;--kash-accent:#f1ebff;
  --kash-softshadow:0 12px 44px rgba(73,47,128,.085);
  --radius:23px;--radius-sm:16px;
  --line:#e6e0ef;--muted:#68627b;
}
html{scroll-padding-top:98px}
body{
  background:radial-gradient(ellipse 620px 440px at 85% 0%,rgba(222,207,255,.58),transparent 75%),
             radial-gradient(ellipse 570px 480px at 9% 95%,rgba(220,247,239,.58),transparent 75%),#faf9fe;
  color:var(--ink);
}
/* Keep the existing brand, just make the hierarchy easier to scan. */
.app-shell{grid-template-columns:270px minmax(0,1fr)}
.sidebar{
  width:242px;left:17px;top:17px;bottom:17px;padding:21px 15px 18px;
  background:rgba(255,255,255,.89);border:1px solid #eae5f3;
  border-radius:29px;box-shadow:0 16px 48px rgba(42,27,79,.07);
}
.brand{margin:0 0 3px 2px}
.brand-mark{background:linear-gradient(145deg,#7851e4,#a88ff9);border-radius:15px}
.brand strong{font-size:21px;letter-spacing:-.8px}
.brand small{font-size:10.5px}
.mini-profile{margin:15px 0 10px;background:linear-gradient(115deg,#f2ecff,#f6f2ff);border:1px solid #efe8ff;border-radius:19px}
.mini-profile strong{font-size:12.5px}
.kash-sidebar-label{font-size:10px;font-weight:800;letter-spacing:1.25px;text-transform:uppercase;color:#9488ad;margin:16px 12px 9px}
.kash-sidebar-label.quick{margin-top:20px}
.side-nav{gap:5px;padding:2px 0 7px;overflow:auto}
.nav-item{min-height:45px;border-radius:13px;padding:10px 12px;gap:12px;position:relative}
.nav-item span{font-size:18px;width:24px;text-align:center}
.nav-item b{font-size:13px;letter-spacing:-.1px}
.nav-item:hover{transform:none;background:#f5f0ff;color:#6548bc}
.nav-item.active{background:linear-gradient(90deg,#eee7ff 0%,#f8f4ff 95%);color:var(--kash-violet-strong)}
.nav-item.active:before{content:'';position:absolute;left:0;top:12px;bottom:12px;width:3px;background:#8965eb;border-radius:0 7px 7px 0}
.sidebar-quick{display:flex;gap:7px;flex-wrap:wrap}
.sidebar-quick button{font-size:10.5px;min-height:34px}
.sidebar-card{margin-top:auto;background:linear-gradient(148deg,#f2eaff,#e8f8ef);border:1px solid rgba(182,164,222,.17)}
.sidebar-card small{font-size:11px;line-height:1.55}
.main{padding:17px clamp(18px,3.1vw,46px) 36px 4px;min-width:0}
.topbar{grid-template-columns:auto minmax(190px,1fr) auto;gap:15px;align-items:center;padding:0 0 20px;background:linear-gradient(180deg,#faf9fef2,#faf9fee6 76%,transparent)}
.kash-top-scope{min-width:118px;display:flex;flex-direction:column;gap:2px;padding-left:2px}
.kash-top-scope small{font-size:9px;font-weight:800;letter-spacing:1.2px;color:#9689ab}
.kash-top-scope strong{font-size:15px;font-weight:800;color:#332747;letter-spacing:-.4px}
.search-wrap{height:52px;min-width:0;box-shadow:0 8px 25px rgba(66,47,114,.055);border-radius:17px;background:#fff}
.search-wrap:focus-within{border-color:#ad94ee;box-shadow:0 0 0 3px #b69cf52a,0 8px 25px #56409010}
.search-wrap input{font-size:13.5px;min-width:0}
.search-wrap kbd{font-size:10px}
.search-results{z-index:100;max-height:min(60vh,460px);overflow:auto;box-shadow:0 20px 60px #382b5e24}
.search-result{min-height:52px;gap:11px}
.search-result strong{display:block;font-size:12px}
.search-result small{display:block;margin-top:2px;font-size:10.5px}
.kash-search-group{padding:10px 14px 5px;font-size:10px;font-weight:900;letter-spacing:1px;color:#85749f;text-transform:uppercase}
.kash-search-jump{display:flex;width:100%;align-items:center;gap:11px;border:0;background:transparent;color:var(--ink);text-align:left;padding:11px 14px;cursor:pointer}
.kash-search-jump:hover,.kash-search-jump:focus-visible{background:var(--lav2)}
.kash-search-jump .kash-search-icon{font-size:19px;width:25px;text-align:center}
.kash-search-jump strong{display:block;font-size:12px}
.kash-search-jump small{font-size:10px;color:var(--muted)}
.spark-pill,.icon-btn,.account-pill{box-shadow:none;background:rgba(255,255,255,.94);border-color:#e9e3f1}
.spark-pill{font-size:14px}
.home-hello{margin:4px 2px 18px}
.home-hello h1{letter-spacing:-1.6px}
.home-hello p{font-size:13.5px}
.welcome-grid{gap:15px}
.daily-drop-card{border:1px solid #ece4ff;background:linear-gradient(126deg,#fff 0%,#f2edff 61%,#eefaf5 100%);box-shadow:var(--kash-softshadow);border-radius:26px}
.daily-drop-card h1{letter-spacing:-1.8px}
.daily-pulse{border-color:#eee7f4;box-shadow:var(--kash-softshadow)}
.drop-discovery{background:#ffffffca;border-color:#eee6fb}
.drop-discovery span{font-size:10.5px}
.drop-discovery p{font-size:12px}
.drop-return{font-size:10.5px}
.primary{background:linear-gradient(135deg,#7954df,#9576ee);box-shadow:0 9px 20px #7857dd33}
.primary:hover{box-shadow:0 12px 26px #7857dd3d}
.secondary{border-color:#e4dced}
.primary,.secondary{min-height:41px}
.card,.welcome-card{border-color:#eae5f1;box-shadow:var(--kash-softshadow)}
.section-heading h2{letter-spacing:-.9px}
.soft-label,.tiny{font-size:10px;letter-spacing:1.1px}
/* Fast way into every important tool: no new APIs or persisted data. */
.kash-quick-launch{margin:20px 0 7px;background:linear-gradient(135deg,#ffffffea,#faf7ffed);border:1px solid #ece5f5;border-radius:24px;padding:22px;box-shadow:var(--kash-softshadow)}
.kash-quick-head{display:flex;align-items:baseline;justify-content:space-between;gap:14px;margin-bottom:16px}
.kash-quick-head h2{font:800 clamp(18px,2vw,23px)/1.2 Manrope,system-ui,sans-serif;letter-spacing:-.7px;margin:0}
.kash-quick-head p{font-size:12px;color:var(--muted);margin:0}
.kash-quick-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px}
.kash-shortcut-card{display:flex;align-items:center;gap:11px;min-width:0;min-height:91px;text-align:left;padding:14px;border:1px solid #ebe5f2;border-radius:17px;background:#fff;cursor:pointer;color:var(--ink);transition:transform .18s,box-shadow .18s,border-color .18s}
.kash-shortcut-card:hover{transform:translateY(-3px);border-color:#c5b3eb;box-shadow:0 10px 25px #48377016}
.kash-shortcut-icon{flex:none;width:43px;height:43px;background:#f1eaff;border-radius:13px;display:grid;place-items:center;font-size:22px}
.kash-shortcut-card:nth-child(2) .kash-shortcut-icon{background:#fef0e7}
.kash-shortcut-card:nth-child(3) .kash-shortcut-icon{background:#eaf7f2}
.kash-shortcut-card:nth-child(4) .kash-shortcut-icon{background:#eaf1ff}
.kash-shortcut-card>span:nth-child(2){min-width:0}
.kash-shortcut-card b{display:block;font-size:12.5px;white-space:normal;line-height:1.3}
.kash-shortcut-card small{display:block;font-size:10.5px;color:var(--muted);line-height:1.4;margin-top:4px}
.kash-shortcut-arrow{color:#977bd6;font-size:17px;margin-left:auto;align-self:flex-start}
/* More legible details in Explore and Career, without altering their data or logic. */
.page-intro{padding:6px 2px 0}
.page-intro h1{font-size:clamp(31px,3.9vw,50px);max-width:920px}
.page-intro p{font-size:14px;max-width:770px}
.learning-paths,.news-grid{gap:15px}
.learning-paths>*,.news-grid>*{box-shadow:0 10px 33px #4b386c0c}
.career-view .career-hero{border-radius:24px}
.career-view .career-tabs button,.career-view .career-tool{min-height:43px}
/* Maintain visual hierarchy in twilight mode. */
body.twilight{--kash-outline:#3d334e;--line:#352d46;--muted:#bdb5ca;color:var(--ink)}
body.twilight .sidebar,body.twilight .search-wrap,body.twilight .kash-quick-launch,body.twilight .kash-shortcut-card,body.twilight .spark-pill,body.twilight .icon-btn,body.twilight .account-pill{background:var(--panel-solid);border-color:var(--line)}
body.twilight .topbar{background:linear-gradient(180deg,#14111de8,#14111dd7 76%,transparent)}
body.twilight .kash-top-scope strong{color:#f8f4ff}
body.twilight .nav-item.active{background:#31263f;color:#dbd0ff}
body.twilight .kash-shortcut-card small{color:#bbb3c9}
body.twilight .kash-shortcut-icon{background:#332947}
body.twilight .kash-shortcut-card:nth-child(n) .kash-shortcut-icon{background:#332947}
body.twilight .kash-quick-head p{color:var(--muted)}
body.twilight .daily-drop-card{background:linear-gradient(135deg,#241d32,#2a2340 70%,#1e3230)}
body.twilight .drop-discovery{background:#241e32;border-color:#3b314e}
body.twilight .drop-discovery p{color:#ebe4fa}
body.twilight .kash-search-jump{color:var(--ink)}
/* Keyboard and touch accessibility. */
.kash-skip{position:fixed;top:-90px;left:16px;background:#4f2cb9;color:#fff;text-decoration:none;padding:12px 16px;border-radius:10px;z-index:99999}
.kash-skip:focus{top:12px}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #9875e5;outline-offset:3px}
button[disabled]{cursor:not-allowed}
@media(max-width:1360px){
  .kash-quick-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .kash-quick-head{align-items:flex-start;flex-direction:column;gap:5px}
}
@media(max-width:1100px){
  .app-shell{grid-template-columns:246px minmax(0,1fr)}
  .sidebar{width:222px;left:12px}
  .main{padding-right:18px}
  .kash-top-scope{display:none}
  .topbar{grid-template-columns:minmax(160px,1fr) auto}
}
@media(max-width:860px){
  html{scroll-padding-top:80px}
  body{padding-bottom:96px}
  .app-shell{display:block}
  .sidebar{display:none}
  .main{padding:12px 16px 30px}
  .topbar{grid-template-columns:auto minmax(0,1fr) auto;gap:10px;padding:4px 1px 14px}
  .mobile-logo{display:flex}
  .kash-top-scope{display:none}
  .search-wrap{height:44px;border-radius:14px}
  .top-actions{gap:5px}
  .kash-quick-launch{padding:18px}
  .kash-quick-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bottom-nav{grid-template-columns:repeat(6,minmax(0,1fr));left:10px;right:10px;bottom:max(9px,env(safe-area-inset-bottom));padding:7px 5px;border:1px solid #e8def5;box-shadow:0 12px 42px #463a6630;gap:0}
  .bottom-nav button{min-width:0;padding:7px 1px;min-height:52px}
  .bottom-nav button span{font-size:19px}
  .bottom-nav button small{font-size:9px;letter-spacing:-.2px;white-space:nowrap}
  .bottom-nav button.active{background:#efe6ff;color:#6545cf}
  .more-sheet.compat-hidden,.sheet-backdrop.compat-hidden{display:none!important}
  .search-results{width:min(90vw,550px);left:0;right:auto}
}
@media(max-width:560px){
  .main{padding:9px 13px 32px}
  .topbar{gap:6px}
  .topbar .account-pill{min-width:36px;width:36px;height:39px}
  .topbar .account-avatar{width:28px;height:28px}
  .icon-btn{width:38px;height:39px}
  .search-wrap{height:43px;min-width:0;padding:0 10px}
  .search-wrap input{font-size:12.5px}
  .search-wrap>span:first-child{display:none}
  .daily-drop-card{padding:24px 20px}
  .daily-drop-card h1{font-size:clamp(27px,8vw,35px)}
  .home-hello h1{font-size:clamp(25px,7.5vw,31px)}
  .kash-quick-launch{border-radius:20px;padding:16px 13px;margin-top:16px}
  .kash-quick-head h2{font-size:19px}
  .kash-shortcut-card{min-height:110px;display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:12px;position:relative}
  .kash-shortcut-icon{height:38px;width:38px;font-size:19px}
  .kash-shortcut-card b{font-size:12px}
  .kash-shortcut-card small{font-size:10px}
  .kash-shortcut-arrow{position:absolute;top:12px;right:12px}
  .page-intro h1{letter-spacing:-1.3px;font-size:clamp(28px,8vw,36px)}
  .page-intro p{font-size:13px}
  .bottom-nav{left:5px;right:5px;bottom:max(6px,env(safe-area-inset-bottom));padding:6px 3px;border-radius:18px}
  .bottom-nav button{gap:2px;padding:8px 0;border-radius:11px}
  .bottom-nav button span{font-size:18px}
  .bottom-nav button small{font-size:8.5px}
  .search-results{left:auto;right:-102px;width:calc(100vw - 25px);max-width:none}
}
@media(max-width:360px){
  .topbar .icon-btn{display:none}
  .kash-quick-grid{gap:7px}
  .kash-shortcut-card{padding:10px}
  .bottom-nav button small{font-size:8px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .kash-shortcut-card,.nav-item,.primary,.secondary{transition:none!important}
  .kash-shortcut-card:hover,.primary:hover,.secondary:hover{transform:none}
}
/* Reliable typography when Google Fonts cannot load (offline or restricted networks). */
h1,h2,h3,h4,h5,h6,.brand strong,.spark-row strong,.daily-drop-card h1,.home-hello h1,
.card-head h3,.section-heading h2,.page-intro h1,.career-view h1,.career-view h2,.career-view h3,
.kash-quick-head h2,.kash-top-scope strong{
  font-family:'Manrope','DM Sans','Segoe UI',system-ui,-apple-system,sans-serif!important;
}