:root{--background: #282c33;--foreground: #abb2bf;--accent: #c778dd;--white: #ffffff;--line: #abb2bf;--ink: #2c313a}*{box-sizing:border-box}html,body{margin:0;padding:0}body{min-height:100vh;color:var(--foreground);background:var(--background);font-family:Fira Code,ui-monospace,Menlo,Monaco,Cascadia Mono,Segoe UI Mono,Roboto Mono,Courier New,monospace}a{color:inherit;text-decoration:none}rollsev-app{display:block}.social-rail{position:fixed;top:0;left:24px;z-index:20;display:none;height:100vh;flex-direction:column;align-items:center}@media(min-width:1080px){.social-rail{display:flex}}.rail-line{width:1px;height:190px;background:var(--line)}.social-links{margin-top:16px;display:flex;flex-direction:column;gap:12px}.social-links a{color:var(--line);transition:color .2s ease}.social-links a:hover{color:var(--white)}.layout{width:min(1040px,100%);margin-inline:auto;padding:28px 20px 42px}@media(min-width:768px){.layout{padding-inline:32px;padding-top:36px}}.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px}.brand{display:flex;align-items:center;gap:12px;color:var(--white);font-size:1.25rem;font-weight:600}.logo-mark{width:16px;height:16px;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:1px}.logo-mark:before,.logo-mark:after{content:""}.logo-mark,.logo-mark:before,.logo-mark:after{background:linear-gradient(var(--white),var(--white)) 0 0/7px 7px no-repeat,linear-gradient(var(--white),var(--white)) 100% 100%/7px 7px no-repeat,linear-gradient(var(--white),var(--white)) 100% 0/7px 7px no-repeat,linear-gradient(var(--white),var(--white)) 0 100%/7px 7px no-repeat}.menu{display:none;align-items:center;gap:20px;font-size:.875rem}@media(min-width:860px){.menu{display:flex}}.menu a{color:var(--line);transition:color .2s ease}.menu a:hover{color:var(--white)}.menu a span,.accent{color:var(--accent)}.hero{margin-top:52px;display:grid;align-items:center;gap:42px}@media(min-width:1024px){.hero{grid-template-columns:1.08fr .92fr}}.hero h1{margin:0;max-width:620px;color:var(--white);font-size:clamp(2rem,3.8vw,2.95rem);line-height:1.28;font-weight:600}.hero p{margin-top:20px;max-width:560px;font-size:clamp(1rem,2vw,1.15rem)}.counter{margin-top:24px;max-width:420px;border:1px solid var(--accent);background:var(--ink);padding:12px 14px}.counter-label{font-size:.78rem;color:var(--line)}.counter-value{margin-top:4px;color:var(--white);font-size:1rem}.btn{margin-top:24px;display:inline-flex;border:1px solid var(--accent);padding:10px 16px;color:var(--white);transition:background-color .2s ease}.btn:hover{background:#c778dd1f}.btn.secondary{margin-top:20px}.hero-media{position:relative;margin-inline:auto;width:min(470px,100%)}.hero-media img{position:relative;z-index:3;margin-left:auto;width:min(420px,92%);height:auto;display:block}.outline-cube{border:1px solid rgba(199,120,221,.65)}.cube-a,.cube-b{position:absolute;width:92px;height:92px}.cube-a{top:80px;left:8px}.cube-b{top:132px;left:56px}.dot-grid{background-image:radial-gradient(rgba(171,178,191,.75) 1.4px,transparent 1.4px);background-size:12px 12px}.grid-a{position:absolute;top:180px;right:6px;width:96px;height:96px}.status-badge{position:absolute;left:20px;bottom:16px;z-index:4;width:min(356px,92%);display:flex;align-items:center;gap:8px;border:1px solid var(--line);background:var(--background);padding:10px 12px;color:var(--line);font-size:.95rem}.status-badge span{width:14px;height:14px;display:block;background:var(--accent)}.quote{margin-top:32px;border-top:1px solid var(--line);padding-top:28px}.quote p{margin:0 auto;max-width:780px;border:1px solid var(--line);padding:26px 22px;text-align:center;color:var(--white);font-size:clamp(1.08rem,2vw,1.45rem)}.quote span{margin-top:10px;display:block;text-align:right}section{margin-top:56px}section>h2{margin:0 0 16px;display:flex;align-items:center;gap:10px;color:var(--white);font-size:2rem;line-height:1.2}section>h2 span{color:var(--accent)}.cards-grid{margin-top:24px;display:grid;gap:16px}@media(min-width:900px){.cards-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}.project-card{border:1px solid var(--line);background:var(--ink);padding:14px}.project-head{display:flex;justify-content:space-between;gap:12px;align-items:baseline}.project-head strong{color:var(--white)}.project-head a{color:var(--accent);font-size:.84rem}.project-card p{margin:10px 0 0;color:var(--line);font-size:.94rem}.project-card .meta{margin-top:8px;color:var(--line);opacity:.88;font-size:.84rem}.chips{margin-top:10px;display:flex;flex-wrap:wrap;gap:6px}.chips span{border:1px solid rgba(199,120,221,.55);padding:3px 8px;font-size:.78rem;color:var(--white)}.repo{margin-top:10px;display:inline-flex;color:var(--accent);font-size:.84rem}.skills-groups{margin-top:20px;display:grid;gap:12px}@media(min-width:900px){.skills-groups{grid-template-columns:repeat(3,minmax(0,1fr))}}.skill-box{border:1px solid var(--line);background:var(--ink);padding:12px}.skill-box h3{margin:0;color:var(--white);font-size:1rem}.skill-box p{margin:8px 0 0;font-size:.9rem;line-height:1.45}.core-list{margin-top:14px;display:grid;gap:8px}.core-list>div{border:1px solid var(--line);background:#2c313a8c;padding:10px 12px;font-size:.88rem}.about{display:grid;gap:24px}@media(min-width:920px){.about{grid-template-columns:1.05fr .95fr;align-items:end}}.about p{margin:8px 0 0;line-height:1.7}.about-media{border-bottom:1px solid var(--line);width:min(320px,100%);margin-inline:auto}.about-media img{display:block;margin-inline:auto;width:min(220px,95%);height:auto}.contacts{display:grid;gap:20px}@media(min-width:900px){.contacts{grid-template-columns:1.1fr .9fr;align-items:start}}.contacts p{margin:0;max-width:560px;line-height:1.7}.contact-list{display:grid;gap:12px}.contact-list article{border:1px solid var(--line);background:var(--ink);padding:12px}.contact-list h4{margin:0;color:var(--white)}.contact-list a{margin-top:8px;display:inline-flex;color:var(--line);transition:color .2s ease}.contact-list a:hover{color:var(--white)}.footer{margin-top:68px;border-top:1px solid var(--line);padding-top:18px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px}.footer strong{color:var(--white)}.footer p{margin:8px 0 0;font-size:.9rem}.footer-icons{display:flex;gap:12px}.footer-icons a{color:var(--line);transition:color .2s ease}.footer-icons a:hover{color:var(--white)}
