:root{
  --ltj-blue:#0B2C5D;
  --ltj-red:#E30613;
  --ltj-black:#111111;
  --ltj-bg:#F4F4F4;
  --ltj-white:#FFFFFF;
}

*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:var(--ltj-bg);color:var(--ltj-black)}

.ltj-shell{display:flex;min-height:100vh}
.ltj-sidebar{
  width:260px;background:var(--ltj-blue);color:var(--ltj-white);
  display:flex;flex-direction:column;position:fixed;top:0;left:0;height:100vh;
  border-right:4px solid rgba(255,255,255,0.06)
}
.ltj-content{margin-left:260px;padding:24px;flex:1}

.ltj-brand{display:flex;gap:12px;align-items:center;padding:18px 16px;border-bottom:1px solid rgba(255,255,255,0.10)}
.ltj-logo{width:44px;height:44px;object-fit:contain;border-radius:10px;background:rgba(255,255,255,0.10);padding:6px}
.ltj-brand-name{font-weight:800;letter-spacing:0.3px}
.ltj-brand-sub{font-size:12px;opacity:0.85}

.ltj-nav{padding:10px 8px;display:flex;flex-direction:column;gap:6px}
.ltj-nav-item{
  display:flex;align-items:center;gap:10px;
  padding:10px 12px;border-radius:12px;text-decoration:none;color:var(--ltj-white);
  opacity:0.95
}
.ltj-nav-item:hover{background:rgba(255,255,255,0.08)}
/* simple active state by query param not implemented yet; future */

.ltj-sidebar-footer{margin-top:auto;padding:14px 16px;border-top:1px solid rgba(255,255,255,0.10)}
.ltj-userbox{font-size:12px;opacity:0.95;margin-bottom:10px}
.ltj-userbox-label{opacity:0.8}
.ltj-userbox-value{font-weight:700;word-break:break-all}

.ltj-logout{
  display:block;text-align:center;padding:10px 12px;border-radius:12px;
  background:var(--ltj-red);color:var(--ltj-white);text-decoration:none;font-weight:800
}
.ltj-logout:hover{filter:brightness(0.95)}

.card{
  background:var(--ltj-white);border-radius:16px;padding:16px 18px;
  box-shadow:0 8px 24px rgba(17,17,17,0.08);border:1px solid rgba(17,17,17,0.06)
}
h1,h2{margin:0 0 12px}
p{margin:0 0 12px;line-height:1.5}