/* V6.3 — colorful front universe, synchronized dual theme and complete front-page language controls. */
:root{
  --yellow:#ffd84d;--green:#52e58a;--pink:#ff5c9a;--lavender:#a99bff;
  --orange:#ff9650;--lime:#c7f77c;--cyan:#50d4f4;--ink:#0b0d12;
  --cream:#fff9eb;--white:#ffffff;--front-page:#f4f7fb;--front-panel:#ffffff;
  --front-muted:#526071;--front-border:#0b0d12;--front-shadow:rgba(11,13,18,.17);
}
html[data-front-theme="light"]{color-scheme:light;background:var(--front-page)}
html[data-front-theme="dark"]{color-scheme:dark;background:#080a0f}
body{background:var(--front-page);transition:background-color .28s ease,color .28s ease}
html[data-front-theme="dark"] body{background:#080a0f;color:#f4f7fb}
.scroll-progress{background:linear-gradient(90deg,var(--pink),var(--orange),var(--yellow),var(--green),var(--cyan),var(--lavender))}

/* Header controls live inside the actual navigation. */
.site-header{width:min(1540px,calc(100% - 28px));background:rgba(255,255,255,.9);border-color:#0b0d12;box-shadow:5px 5px 0 #0b0d12}
.front-display-controls{display:inline-flex;align-items:center;gap:7px;min-width:0}
.front-theme-control,.front-language-control{height:40px;display:inline-flex;align-items:center;gap:7px;border:2px solid #0b0d12;border-radius:11px;background:#fff;color:#0b0d12;box-shadow:2px 2px 0 #0b0d12;font:900 10px/1 var(--mono);transition:transform .16s ease,box-shadow .16s ease,background .2s ease,color .2s ease}
.front-theme-control{min-width:92px;justify-content:center;padding:0 10px;cursor:pointer}
.front-language-control{position:relative;min-width:178px;padding:0 10px}
.front-language-control::after{content:'⌄';position:absolute;right:10px;top:12px;pointer-events:none;font-size:13px}
.front-language-control select{appearance:none;-webkit-appearance:none;border:0;outline:0;background:transparent;color:inherit;width:100%;min-width:142px;padding:0 22px 0 0;font:900 10px/1 var(--mono);cursor:pointer}
.front-theme-control:hover,.front-language-control:hover{transform:translate(-1px,-1px);box-shadow:4px 4px 0 #0b0d12}
.front-theme-control:focus-visible,.front-language-control:focus-within{outline:3px solid var(--cyan);outline-offset:3px}
.front-display-controls--mobile{display:none;margin-top:12px;padding:12px;border-top:2px solid #0b0d12}

/* Restore the supplied illustration's colors and make the hero adapt visibly. */
.hero--illustrated .hero__art{background:radial-gradient(circle at 52% 42%,rgba(255,216,77,.18),transparent 34%),#1c201c}
.hero--illustrated .hero__art svg{filter:saturate(1.2) contrast(1.04) brightness(1.04);transition:filter .35s ease,transform .35s ease}
.hero--illustrated .hero__scrim{background:linear-gradient(90deg,rgba(12,14,18,.76) 0%,rgba(12,14,18,.42) 31%,rgba(12,14,18,.06) 63%,rgba(12,14,18,.12) 100%),linear-gradient(0deg,rgba(12,14,18,.48),transparent 36%)}
.hero--illustrated .hero__panel{color:#0b0d12;background:rgba(255,255,255,.86);border:3px solid #0b0d12;border-radius:24px;padding:22px;box-shadow:12px 12px 0 rgba(11,13,18,.82);backdrop-filter:blur(12px) saturate(135%)}
.hero--illustrated .hero__eyebrow{background:linear-gradient(135deg,var(--yellow),#fff2a3);box-shadow:4px 4px 0 var(--pink)}
.hero--illustrated h1{text-shadow:4px 4px 0 rgba(255,255,255,.88)}
.hero--illustrated h1 span{color:#0b0d12;-webkit-text-stroke:0}
.hero--illustrated .hero__copy{background:rgba(255,255,255,.72);color:#0b0d12;border-color:#0b0d12;border-left-color:var(--pink);box-shadow:none}
.hero--illustrated .hero__stats div{background:rgba(255,255,255,.94)}
html[data-front-theme="dark"] .hero--illustrated .hero__art svg{filter:saturate(1.05) contrast(1.12) brightness(.72)}
html[data-front-theme="dark"] .hero--illustrated .hero__scrim{background:linear-gradient(90deg,rgba(4,5,8,.94) 0%,rgba(4,5,8,.72) 32%,rgba(4,5,8,.2) 67%,rgba(4,5,8,.38) 100%),linear-gradient(0deg,rgba(4,5,8,.8),transparent 42%)}
html[data-front-theme="dark"] .hero--illustrated .hero__panel{color:#f7f9fc;background:rgba(8,10,15,.82);border-color:rgba(255,255,255,.88);box-shadow:12px 12px 0 rgba(0,0,0,.65)}
html[data-front-theme="dark"] .hero--illustrated h1{text-shadow:5px 5px 0 #000}
html[data-front-theme="dark"] .hero--illustrated h1 span{color:#f7f9fc;-webkit-text-stroke:0}
html[data-front-theme="dark"] .hero--illustrated .hero__copy{background:rgba(8,10,15,.82);color:#f7f9fc;border-color:rgba(255,255,255,.58);border-left-color:var(--pink)}
html[data-front-theme="dark"] .hero--illustrated .hero__stats div{background:rgba(245,247,250,.94);color:#0b0d12}

/* Modern, colorful project dashboard cards. */
.projects{background:linear-gradient(180deg,#eef3f9 0%,#f8fbff 100%)}
.section-heading--pink{background:linear-gradient(135deg,#ff6fa7 0%,#ff9b70 48%,#ffd75d 100%)}
.project-toolbar{top:84px;background:rgba(248,251,255,.92);border-bottom:3px solid #0b0d12;box-shadow:0 12px 32px rgba(15,23,42,.1)}
.projects__grid{gap:18px;padding:18px;background:linear-gradient(145deg,#eaf0f7,#f9fbff);align-items:stretch}
.project-card,.project-card:nth-child(n){border:3px solid #0b0d12;border-radius:26px;min-height:520px;box-shadow:0 18px 38px rgba(15,23,42,.16),6px 6px 0 #0b0d12;isolation:isolate;transition:box-shadow .25s ease,filter .25s ease}
.project-card::before{content:'';position:absolute;inset:-30% 35% 35% -20%;z-index:0;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.62),rgba(255,255,255,0) 67%);pointer-events:none}
.project-card::after{content:'';position:absolute;right:22px;top:70px;width:70px;height:70px;border:2px solid rgba(11,13,18,.18);border-radius:22px;transform:rotate(16deg);pointer-events:none}
.project-card:hover{box-shadow:0 26px 55px rgba(15,23,42,.24),9px 9px 0 #0b0d12;filter:saturate(1.08)}
.project-card--yellow{background:linear-gradient(145deg,#fff6a8 0%,#ffd84d 56%,#ffb448 100%)}
.project-card--cyan{background:linear-gradient(145deg,#c8f5ff 0%,#50d4f4 58%,#4d9fff 100%)}
.project-card--pink{background:linear-gradient(145deg,#ffd0e1 0%,#ff6aa2 55%,#ee5bff 100%)}
.project-card--lavender{background:linear-gradient(145deg,#e4deff 0%,#aa9cff 56%,#7f75ff 100%)}
.project-card--lime{background:linear-gradient(145deg,#eaffbd 0%,#c7f77c 56%,#62df8e 100%)}
.project-card--orange{background:linear-gradient(145deg,#ffe0bd 0%,#ff9a54 56%,#ff6b5f 100%)}
.project-card--green{background:linear-gradient(145deg,#c8f8d8 0%,#52e58a 56%,#35c6b4 100%)}
.project-card__number{border-radius:999px;padding:7px 12px;box-shadow:2px 2px 0 rgba(255,255,255,.62)}
.project-card__icon{display:grid;place-items:center;width:54px;height:54px;border:2px solid #0b0d12;border-radius:18px;background:rgba(255,255,255,.46);box-shadow:3px 3px 0 #0b0d12}
.project-card__title{font-size:clamp(34px,3.6vw,58px)}
.project-card__tag{border-radius:999px;background:rgba(255,255,255,.58);backdrop-filter:blur(6px)}
.card-btn{border-radius:12px;padding:12px 14px;background:rgba(255,255,255,.8)}
.card-btn--primary{background:#0b0d12;color:#fff}

/* Dark front shell: rich black surroundings, project colors remain distinguishable. */
html[data-front-theme="dark"] .site-header{background:rgba(10,12,17,.92);border-color:#eef3f8;box-shadow:5px 5px 0 #000}
html[data-front-theme="dark"] .brand,html[data-front-theme="dark"] .desktop-nav a{color:#f5f7fb}
html[data-front-theme="dark"] .brand__mark{background:var(--pink);border-color:#fff;color:#080a0f}
html[data-front-theme="dark"] .icon-button,html[data-front-theme="dark"] .menu-button,html[data-front-theme="dark"] .install-button,html[data-front-theme="dark"] .front-theme-control,html[data-front-theme="dark"] .front-language-control{background:#151922;color:#f5f7fb;border-color:#eef3f8;box-shadow:2px 2px 0 #000}
html[data-front-theme="dark"] .mobile-menu{background:#11151c;color:#f5f7fb;border-color:#eef3f8;box-shadow:8px 8px 0 #000}
html[data-front-theme="dark"] .mobile-menu a{color:#f5f7fb;border-color:#38404c}
html[data-front-theme="dark"] .projects{background:linear-gradient(180deg,#0b0e14,#111722)}
html[data-front-theme="dark"] .projects__grid{background:linear-gradient(145deg,#0b0e14,#121824)}
html[data-front-theme="dark"] .project-toolbar{background:rgba(11,14,20,.94);border-color:#e8edf4;color:#f5f7fb}
html[data-front-theme="dark"] .search-box{background:#151a23;border-color:#e8edf4;box-shadow:3px 3px 0 #000;color:#f5f7fb}
html[data-front-theme="dark"] .search-box input{color:#f5f7fb}
html[data-front-theme="dark"] .search-box input::placeholder{color:#aeb8c6}
html[data-front-theme="dark"] .filter-button{background:#151a23;color:#f5f7fb;border-color:#e8edf4}
html[data-front-theme="dark"] .filter-button.is-active{background:#f5f7fb;color:#0b0d12}
html[data-front-theme="dark"] .architecture,html[data-front-theme="dark"] .footer{background:#07090d;color:#f5f7fb}
html[data-front-theme="dark"] .manifesto{background:linear-gradient(135deg,#21102a,#37192f 58%,#40231f);color:#f7f8fb}
html[data-front-theme="dark"] .beliefs{background:#0c1017;color:#f5f7fb}
html[data-front-theme="dark"] .beliefs__left,html[data-front-theme="dark"] .beliefs__right{border-color:#e9edf4}
html[data-front-theme="dark"] .downloads-section{background:#10151e;color:#f5f7fb}
html[data-front-theme="dark"] .download-grid a{background:#171d28;color:#f5f7fb;border-color:#e9edf4;box-shadow:4px 4px 0 #000}
html[data-front-theme="dark"] .cta{background:linear-gradient(135deg,#ff9650,#ff5c9a 50%,#a99bff);color:#0b0d12}
html[data-front-theme="dark"] .command__box{background:#10151e;color:#f5f7fb;border-color:#eef3f8;box-shadow:8px 8px 0 #000}
html[data-front-theme="dark"] .command input,html[data-front-theme="dark"] .command-result{background:#171d28;color:#f5f7fb;border-color:#eef3f8}
html[data-front-theme="dark"] .command-result.is-selected,html[data-front-theme="dark"] .command-result:hover{background:var(--yellow);color:#0b0d12}

@media(max-width:1250px){.desktop-nav{display:none}.menu-button{display:inline-flex}}
@media(max-width:900px){.front-display-controls:not(.front-display-controls--mobile){display:none}.front-display-controls--mobile{display:flex;flex-wrap:wrap}.front-display-controls--mobile>*{flex:1 1 180px}.front-language-control select{min-width:0}.mobile-menu{padding-bottom:14px}}
@media(max-width:760px){.hero--illustrated .hero__panel{padding:16px;border-radius:18px}.projects__grid{padding:12px;gap:14px}.project-card,.project-card:nth-child(n){border-radius:20px;min-height:500px}.front-display-controls--mobile{display:flex}}
@media(prefers-reduced-motion:reduce){.project-card,.front-theme-control,.front-language-control,.hero--illustrated .hero__art svg{transition:none!important}}
/* V6.3 readability refinements for long translated project names. */
.project-card{color:#0b0d12!important}
.project-card__category,.project-card__desc,.project-card__title,.project-card__tag{color:#0b0d12}
.project-card__title,.project-card__title span{overflow-wrap:anywhere;word-break:normal;hyphens:auto}
.project-card__title span{display:block}
html[lang="de"] .project-card__title{font-size:clamp(27px,2.65vw,44px);line-height:.92}
html[lang="vi"] .project-card__title,html[lang="ms"] .project-card__title{font-size:clamp(29px,2.8vw,48px);line-height:.92}
html[lang="zh-CN"] .project-card__title,html[lang="ja"] .project-card__title{font-size:clamp(31px,3vw,50px);line-height:.98}
.front-theme-control{min-width:108px}
/* Wider desktop language selector for clearer native language names. */
.front-language-control{min-width:204px}
.front-language-control select{min-width:166px}
@media(max-width:900px){.front-language-control,.front-language-control select{min-width:0}}