:root { color-scheme: dark; --bg:#16141b; --fg:#e8e5ed; --muted:#aaa3b5; --line:#3c3547; --accent:#c3a5ed; }
.portal { --bg:#181818; --fg:#ededed; --muted:#ababab; --line:#3d3d3d; --accent:#d0d0d0; }
* { box-sizing:border-box; }
body { margin:0; background:var(--bg); color:var(--fg); font:15px/1.8 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; padding-inline:env(safe-area-inset-left,0px) env(safe-area-inset-right,0px); }
a { color:var(--accent); text-underline-offset:5px; }
.site-header,main,footer { width:min(1100px,calc(100% - 64px)); margin-inline:auto; }
.site-header { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px 24px; min-height:84px; padding-block:14px; border-bottom:1px solid var(--line); }
.brand { font:600 15px/1.8 Consolas,monospace; text-decoration:none; color:var(--fg); }
.site-header > span { color:var(--muted); font-size:12px; }
main { padding-block:56px 64px; }
.path,.folder { color:var(--accent); font:12px/1.8 Consolas,monospace; }
h1 { max-width:900px; margin:20px 0; font:500 clamp(30px,5vw,54px)/1.2 Consolas,monospace; letter-spacing:-.05em; overflow-wrap:anywhere; }
.cursor { color:var(--accent); animation:blink 1.2s step-end infinite; }
.lead { max-width:680px; margin:0 0 40px; color:var(--muted); }
.directions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.directions > a { position:relative; min-width:0; padding:24px 48px 24px 24px; border:1px solid var(--card-line,var(--line)); border-left:3px solid var(--accent); border-radius:6px; background:var(--card-bg,var(--bg)); color:var(--fg); text-decoration:none; transition:border-color .15s; }
.direction-ml { --accent:#91c99e; --card-bg:#1b2820; --card-line:#385443; }
.direction-cpp { --accent:#c3a5ed; --card-bg:#251f30; --card-line:#514064; }
.direction-algo { --accent:#e2a0b3; --card-bg:#2f1c24; --card-line:#71374b; }
.direction-python { --accent:#e6cd72; --card-bg:#2c281b; --card-line:#615334; }
.direction-rust { --accent:#eda76e; --card-bg:#302219; --card-line:#71492e; }
.directions h2 { margin:8px 0; font:500 23px/1.4 Consolas,monospace; letter-spacing:-.035em; }
.directions p { margin:0; color:var(--muted); font-size:14px; }
.arrow { position:absolute; right:20px; top:24px; color:var(--accent); font-size:22px; transition:transform .15s; }
.directions h2 { color:var(--accent); }
.directions a:hover,.directions a:focus-visible { border-color:var(--accent); }
.directions a:hover .arrow { transform:translate(2px,-2px); }
.empty-section { margin-block:36px; padding-block:24px; border-block:1px solid var(--line); }
.back { display:inline-flex; align-items:center; min-height:44px; }
footer { border-top:1px solid var(--line); padding-block:22px; color:var(--muted); font-size:12px; }
:focus-visible { outline:2px solid var(--accent); outline-offset:5px; }
@keyframes blink { 50% { opacity:0; } }
@media(max-width:600px) { .site-header,main,footer { width:calc(100% - 32px); } main { padding-top:36px; } .directions { grid-template-columns:minmax(0,1fr); } h1 { font-size:32px; } }
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { animation:none!important; transition:none!important; } }