/* 4D ME — BRIGHT WHITE EDITION
   A single, reversible visual layer. All application features remain intact. */
:root {
  --bg:#ffffff;
  --panel:#ffffff;
  --panel2:#ffffff;
  --stroke:#e4e7ef;
  --white:#172032;
  --muted:#606b80;
  --purple:#7768df;
  --teal:#087b71;
  --pink:#d86eab;
  --gold:#b57d2d;
}
html { color-scheme:light; }
body {
  background:#ffffff;
  color:#172032;
  -webkit-font-smoothing:antialiased;
}
::selection {background:#dcd7ff;color:#18172e;}
.app,.main {background:#fff;}
.side {
  background:#fff;
  border-right:1px solid #e8eaf1;
  box-shadow:8px 0 36px #20325904;
  backdrop-filter:none;
}
.logo-icon {
  color:#fff;
  background:linear-gradient(145deg,#7161d6,#40b5b3);
  box-shadow:0 6px 15px #7767d929;
}
.logo strong {color:#161b2e;}
.logo small {color:#66738e;}
.nav-kicker {color:#8991a6;}
.nav button {color:#69748a;}
.nav button svg {color:#8590a6;}
.nav button.active {
  color:#5441bf;
  background:#f3f1ff;
  border:1px solid #e3ddff;
  box-shadow:none;
}
.nav button.active svg {color:#7061d6;}
.nav button:hover {color:#332d6a;background:#f8f7fd;}
.side-bottom {
  background:#fff;
  border:1px solid #e5e5f1;
  box-shadow:0 8px 26px #2b356d09;
}
.side-bottom strong {color:#22243b;}
.side-bottom p {color:#737d91;}
.side-bottom .eyebrow {color:#7661d1;}
.breadcrumbs {color:#8a93a4;}
.breadcrumbs b {color:#3d4256;}
.topbar {border-bottom:1px solid #f0f1f6;padding-bottom:17px;}
.status-pill {
  background:#effbf6;
  color:#166a52;
  border:1px solid #cbebdf;
}
.circle-btn {
  background:#fff;
  border:1px solid #e2e6ee;
  color:#545c74;
  box-shadow:0 2px 9px #141b280a;
}
.circle-btn:hover {background:#f7f8fb;}
.hero {
  background:
    radial-gradient(ellipse at 79% 47%,#eae5ff 0%,#f8f6ff 21%,transparent 51%),
    radial-gradient(ellipse at 95% 90%,#e6faf7 0%,transparent 44%),
    #fff;
  border:1px solid #e6e3f3;
  box-shadow:0 13px 48px #655aa610,0 4px 13px #1a1d3407;
}
.eyebrow {color:#7762d1;}
.hero h1 {color:#14182b;}
.hero h1 em {
  background:linear-gradient(102deg,#6a55bf,#9376d7 50%,#149c97);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.hero p {color:#5b6578;}
.portal-art {opacity:.98;}
.ring {
  border-color:#a69bec86;
  box-shadow:0 0 20px #b3a7f64a,inset 0 0 35px #e0ddff77;
}
.ring.two {
  border-color:#7cd9d2;
  box-shadow:0 0 22px #7cd9d23a,inset 0 0 22px #ddf8f3c9;
}
.ring.three {border-color:#b4a7f3;opacity:.7;}
.orbitcore {
  background:radial-gradient(ellipse,#baadfa55 0%,#eff2ff9e 45%,transparent 75%);
}
.timechip {
  background:#ffffffed;
  color:#222940;
  border:1px solid #d6d4eb;
  box-shadow:0 14px 31px #66658c24;
}
.timechip b {color:#178a85;}
.hero-foot {color:#667487;}
.dot {background:#28aa88;box-shadow:0 0 7px #42bd9b6b;}
.btn {transition:transform .15s,background .15s,box-shadow .15s;}
.btn.primary {
  color:#fff;
  background:linear-gradient(120deg,#7361d9,#5c66d3);
  box-shadow:0 8px 18px #7469d83d;
}
.btn.primary:hover {box-shadow:0 12px 23px #7469d84d;}
.btn.secondary {
  background:#fff;
  color:#3e405c;
  border:1px solid #deddec;
  box-shadow:0 2px 8px #221c490a;
}
.btn.secondary:hover {background:#f6f5ff;}
.btn.dark {
  color:#5146ac;
  background:#f7f6ff;
  border:1px solid #e1def5;
}
.btn.dark:hover {background:#eeebff;}
.stats .stat,.stat {
  background:#fff;
  border:1px solid #e6e8f0;
  box-shadow:0 6px 21px #26365408;
}
.stat small {color:#7a8597;}
.stat strong {color:#181f32;}
.stat strong[style] {color:#148779 !important;}
.section-title h2 {color:#1a2032;}
.section-title p {color:#788295;}
.section-title h2 span {color:#8170d8 !important;}
.glass {
  background:#fff;
  border:1px solid #e5e7ef;
  box-shadow:0 5px 29px #242c4509;
}
.glass h3 {color:#202437;}
.glass p {color:#677286;}
.eyelabel {color:#77849c;}
.pill {
  background:#f6f3ff;
  border:1px solid #e9e1ff;
  color:#6b58bb;
}
.frame {
  border:1px solid #e6e1f7;
  background:radial-gradient(circle at 50% 43%,#efebff,#fafaff 55%,#fff 100%);
}
.frame:after {box-shadow:inset 0 0 52px #f5f2ff80;}
.frame img {box-shadow:0 15px 42px #2936582c;}
.frame-text {color:#68718c;}
.frame-text .big {
  background:linear-gradient(145deg,#8072d7,#42b4ad);
  color:transparent;
  background-clip:text;
  -webkit-background-clip:text;
}
.frame-year {
  background:#fffefb;
  border:1px solid #ddd7f2;
  color:#5d52a0;
  box-shadow:0 2px 8px #1e245316;
}
.slider-row {color:#646d81;}
.timeline-slider {accent-color:#7060d7;}
.memory-strip .empty {color:#8c94a6;}
.mini {background:#f9f7ff;border-color:#e4def5;}
.mini.selected {border-color:#3db9ad;box-shadow:0 0 0 3px #e2f9f3;}
.mini span {background:#fffffff0;color:#2d3451;}
.upload-pad {
  border:1.5px dashed #bdb5e5;
  background:#fbfaff;
}
.upload-pad:hover {border-color:#71bbb3;background:#f0fdf9;}
.upload-pad strong {color:#3c3d61;}
.upload-pad span {color:#7b8597;}
.file-icon {background:#f1ecff;color:#7462ca;border:1px solid #dcd4f6;}
.listline {background:#fff;border:1px solid #e7eaf0;}
.listline b {color:#283047;}
.listline small {color:#788396;}
.listline .left {color:#29334b;}
.listline .left + span {color:#16927d !important;}
.tinybtn {
  background:#fff5f9;
  border:1px solid #f0dbe7;
  color:#b24e77;
}
.info,.privacy {
  background:#f2fbf7;
  border:1px solid #d9eee3;
  color:#276951;
}
.timelinehint {color:#7a8294;}
.muted {color:#6c7489;}
.footer {border-top:1px solid #eff0f5;color:#8c95a5;}
.footer span {color:#808a9c;}
.dialog {background:#1b254c60;backdrop-filter:blur(8px);}
.modal {
  background:#fff;
  border:1px solid #e0deeb;
  box-shadow:0 18px 70px #1c245d34;
}
.modal h2 {color:#1e2235;}
.modal p {color:#687387;}
.lab {color:#5b6579;}
.field {
  color:#1b2232;
  background:#fff;
  border:1px solid #dadfeb;
}
.field:focus {border-color:#8979db;box-shadow:0 0 0 3px #dfd9ff;}
.field::placeholder {color:#a4acb9;}
.modal input[type=file] {
  color:#4d5872;
  background:#fff;
  border:1px solid #e0e3eb;
}
.room {
  background:radial-gradient(ellipse at 50% 45%,#ede9ff,#fbfaff 61%,#fff);
  border:1px solid #e2ddf1;
  box-shadow:0 9px 37px #282b4e0b;
}
.room .floor {
  background:repeating-linear-gradient(0deg,transparent,transparent 39px,#a4a1dd21 40px),
             repeating-linear-gradient(90deg,transparent,transparent 39px,#a0c9ce34 40px);
  box-shadow:0 -50px 80px #b6a7ef18;
}
.room .portal-arch {
  border-color:#9c8adf;
  box-shadow:0 0 52px #b6a7f27a,inset 0 0 70px #e8ddff83;
}
.room-label {color:#5445ac;text-shadow:0 1px 10px white;}
.selfcard {
  border:2px solid #b4a5ed;
  background:linear-gradient(150deg,#e1dcfa,#f7f9fc);
  box-shadow:0 17px 36px #4c43773d;
}
.selfcard .personplaceholder {color:#7565b0;}
.selfcard .age-tag {
  color:#3e4260;
  background:#fffef9ed;
}
.room-bottom {color:#596579;}
.price {
  background:#fff;
  border:1px solid #e3e5ee;
  box-shadow:0 6px 24px #20274409;
}
.price.highlight {
  border-color:#a99be6;
  background:linear-gradient(140deg,#f8f6ff,#fff 55%);
  box-shadow:0 12px 34px #8a7fd21c;
}
.price h3,.price .amount {color:#252b40;}
.price small {color:#8790a1;}
.price p {color:#737d90;}
.tipline {border-top:1px solid #e7eaf0;color:#707b8d;}
.toast {
  background:#fff;
  border:1px solid #ddd9f5;
  color:#263049;
  box-shadow:0 12px 42px #28335929;
}
.empty {color:#939aaa;}
.circle-btn:focus-visible,button:focus-visible {outline-color:#7361d9;}
@media(max-width:780px) {
  .side {
    background:#fffffff7;
    border-bottom:1px solid #ebedf2;
    box-shadow:0 3px 18px #1820440b;
    backdrop-filter:blur(14px);
  }
  .nav button.active {background:#f3f0ff;}
  .portal-art {opacity:.45;}
  .hero {background:radial-gradient(circle at 86% 81%,#ede8ff,transparent 51%),#fff;}
}
@media(max-width:430px) {
  .nav button.active {color:#6350b6;}
  .hero p {color:#647085;}
}