:root{--ink:#182f45;--teal:#008d8c}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font:16px/1.65 system-ui,sans-serif;background:#f5f8fb;color:var(--ink)}a{color:#007b80;text-decoration:none}nav{padding:22px 6%;background:white;border-bottom:1px solid #e0e8ee;display:flex;align-items:center;justify-content:space-between}.logo{font-size:29px;font-weight:850;color:var(--ink);line-height:1.15;letter-spacing:-1px}.logo span{color:var(--teal)}.logo small{display:block;font-size:10px;letter-spacing:2px;margin-top:6px;color:#738496}nav>div{display:flex;align-items:center;gap:24px}nav form{margin:0}.button,button{display:inline-block;background:var(--teal);color:white;border:0;border-radius:8px;padding:11px 20px;font:inherit;cursor:pointer}.button:hover,button:hover{background:#006e73}main{max-width:1450px;margin:auto;padding:32px 6%}.hero{background:#142f43;color:white;padding:65px 55px;border-radius:18px;background-image:radial-gradient(ellipse at right top,#28616c 0,transparent 60%)}.eyebrow{letter-spacing:2px;font-size:11px;font-weight:750;color:#29a89f}h1{font-size:55px;line-height:1.15;letter-spacing:-2px;margin:20px 0}h2{font-size:30px;line-height:1.25;letter-spacing:-.7px}h3{font-size:21px;line-height:1.3}.hero p{color:#bdd0dd;max-width:650px;font-size:19px;margin-bottom:30px}.secondary{color:white;margin-left:25px}.hero-bottom{border-top:1px solid #3d5b6b;margin-top:55px;padding-top:22px;font-size:11px;letter-spacing:2px;color:#a9c7d4}section{margin-bottom:45px}#computers{padding-top:20px}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.cards article{padding:30px;background:white;border:1px solid #e0e8ef;border-radius:13px}.cards p{color:#62768b;font-size:14px}.icon{font-size:32px;color:var(--teal);margin-bottom:20px}.tag{color:#007b75;background:#e2f5ef;border-radius:20px;padding:5px 9px;font-size:9px;letter-spacing:.8px}.planned{background:#eef1f5;color:#718094}.about{display:grid;grid-template-columns:1fr 1fr;gap:55px;background:#e8f1f5;padding:40px;border-radius:15px}.about p{color:#5b7184}.auth{max-width:500px;margin:30px auto 70px;background:white;border:1px solid #dfe8ef;border-radius:15px;padding:35px}.auth h1{font-size:35px;letter-spacing:-1px}.auth label{display:block;margin:17px 0}.auth input{display:block;width:100%;padding:12px;font:inherit;border:1px solid #cbd8e2;border-radius:7px;margin-top:6px}.auth button{width:100%;margin-top:15px}.small{font-size:12px;color:#6a7c8f}.message{background:#fff3e0;padding:13px;border-radius:8px}.dashboard h1{font-size:40px}.dashboard>p{color:#62768b}footer{padding:25px 6%;border-top:1px solid #dfe8ee;font-size:12px;color:#6a7d91;display:flex;justify-content:space-between}@media(max-width:850px){.cards{grid-template-columns:1fr 1fr}.about{grid-template-columns:1fr}h1{font-size:40px}nav>div{gap:12px;font-size:13px}}@media(max-width:550px){.cards{grid-template-columns:1fr}.hero{padding:35px 25px}nav{align-items:flex-start}nav>div{flex-wrap:wrap;justify-content:flex-end;max-width:200px}.logo{font-size:23px}h1{font-size:32px}.secondary{display:block;margin:15px 0}.auth{padding:23px}.about{padding:25px}footer span{display:none}}
/* Shared light/dark theme for public and account pages. */
.theme-toggle{background:#edf5f5;color:#126c70;border:1px solid #d1e4e5;padding:8px 12px;font-size:13px;white-space:nowrap}
html.dark{color-scheme:dark;--ink:#e3edf8;--teal:#087f84}
html.dark body{background:#101b29;color:#e3edf8}
html.dark nav{background:#19283b;border-color:#33465b}
html.dark .logo{color:#e3edf8}
html.dark .logo span,html.dark a{color:#6cddd5}
html.dark .logo small{color:#abbcd0}
html.dark .button{color:white}
html.dark .theme-toggle{background:#223d49;color:#d4f6f1;border-color:#456274}
html.dark .cards article,html.dark .auth{background:#19283b;border-color:#33465b}
html.dark .cards p,html.dark .about p,html.dark .dashboard>p,html.dark .small{color:#b6c7d8}
html.dark .about{background:#1b3242}
html.dark .auth input{background:#112033;border-color:#476078;color:#edf5ff}
html.dark .tag{background:#17423e;color:#8de9cf}
html.dark .planned{background:#2c3a4f;color:#c0cddd}
html.dark .message{background:#43371f;color:#ffe0a1}
html.dark footer{border-color:#33465b;color:#abbcd0}
html.dark .hero .secondary{color:#fff}
:focus-visible{outline:3px solid #3cbeb6;outline-offset:3px}
