:root{--color-primary: #0A2463;--color-accent: #00FFFF;--color-bg: #FFFFFF;--color-text: #424242;--color-surface: #FFFFFF;--color-border: rgba(10,36,99,.12);--color-border-strong: rgba(10,36,99,.25);--muted-bg: rgba(10,36,99,.06);--muted-border: rgba(10,36,99,.12);--shadow: rgba(10,36,99,.06);--nav-bg: #FFFFFF;--text-muted: rgba(66,66,66,.9);--btn-secondary-bg: #FFFFFF;--btn-secondary-text: var(--color-primary);--btn-secondary-border: rgba(10,36,99,.25);--color-title: var(--color-primary);--btn-primary-bg: var(--color-primary);--btn-primary-text: #FFFFFF;--btn-primary-hover: #091d4f;--badge-text: var(--color-primary);--nav-active: var(--color-primary)}.theme-white{--color-bg: #FFFFFF;--color-text: #424242;--color-surface: #FFFFFF;--color-border: rgba(10,36,99,.12);--color-border-strong: rgba(10,36,99,.25);--muted-bg: rgba(10,36,99,.06);--muted-border: rgba(10,36,99,.12);--shadow: rgba(10,36,99,.06);--nav-bg: #FFFFFF;--text-muted: rgba(66,66,66,.9);--btn-secondary-bg: #FFFFFF;--btn-secondary-text: var(--color-primary);--btn-secondary-border: rgba(10,36,99,.25);--color-title: var(--color-primary);--btn-primary-bg: var(--color-primary);--btn-primary-text: #FFFFFF;--btn-primary-hover: #091d4f;--badge-text: var(--color-primary);--nav-active: var(--color-primary)}.theme-black{--color-bg: #000000;--color-text: #E6E6E6;--color-surface: #0f0f12;--color-border: rgba(255,255,255,.18);--color-border-strong: rgba(255,255,255,.28);--muted-bg: rgba(255,255,255,.08);--muted-border: rgba(255,255,255,.18);--shadow: rgba(0,0,0,.6);--nav-bg: #0f0f12;--text-muted: rgba(230,230,230,.8);--btn-secondary-bg: transparent;--btn-secondary-text: #E6E6E6;--btn-secondary-border: rgba(255,255,255,.28);--color-title: var(--color-accent);--btn-primary-bg: var(--color-accent);--btn-primary-text: #FFFFFF;--btn-primary-hover: #00d7d7;--badge-text: #E6E6E6;--nav-active: var(--color-accent)}.theme-blue{--color-bg: #212f5c;--color-text: #E6E6E6;--color-surface: #1b274f;--color-border: rgba(255,255,255,.18);--color-border-strong: rgba(255,255,255,.28);--muted-bg: rgba(255,255,255,.1);--muted-border: rgba(255,255,255,.2);--shadow: rgba(18,24,54,.6);--nav-bg: #1b274f;--text-muted: rgba(230,230,230,.8);--btn-secondary-bg: transparent;--btn-secondary-text: #E6E6E6;--btn-secondary-border: rgba(255,255,255,.28);--color-title: var(--color-accent);--btn-primary-bg: var(--color-accent);--btn-primary-text: #FFFFFF;--btn-primary-hover: #00d7d7;--badge-text: #E6E6E6;--nav-active: var(--color-accent)}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background:var(--color-bg);color:var(--color-text);display:flex;flex-direction:column;min-height:100vh}.container{max-width:960px;margin:0 auto;padding:24px 20px 96px}.header{display:flex;align-items:center;justify-content:center;padding:24px 20px;border-bottom:2px solid var(--color-border);position:sticky;top:0;background:var(--color-bg);z-index:10}.brand{display:flex;flex-direction:column;align-items:center;gap:8px}.logo{display:inline-block;height:64px}.logo img{height:100%;display:block}.logo.icon{height:64px}.feed-title{font-weight:800;font-size:22px;color:var(--color-text);text-align:center}.title-row{display:flex;align-items:center;gap:10px}.theme-selector{display:flex;align-items:center;gap:12px}.theme-selector button{padding:8px 12px;border-radius:12px;border:1px solid var(--btn-secondary-border);background:var(--btn-secondary-bg);color:var(--btn-secondary-text);cursor:pointer;opacity:.6;transition:all .3s ease}.theme-selector button.active{border-color:var(--color-accent);color:var(--nav-active);background:var(--muted-bg);opacity:1;transform:scale(1.1);box-shadow:0 0 0 2px var(--color-primary)}.user-level{display:inline-flex;align-items:center;justify-content:center;border-radius:50%;border:2px solid var(--color-accent);background:var(--muted-bg);color:var(--color-title);font-weight:700}.user-level.small{width:28px;height:28px;font-size:12px}.user-level.medium{width:36px;height:36px;font-size:14px}.user-level.large{width:48px;height:48px;font-size:16px}.badge-list{display:flex;flex-wrap:wrap;gap:8px}.theme-group{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;width:100%;align-items:stretch}.theme-item{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid rgba(10,36,99,.12);border-radius:12px;background:#0a24630a;width:100%;min-width:0}.theme-icon{flex:0 0 auto}.theme-label{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.switch{flex:0 0 42px;margin-left:auto}.theme-icon{font-size:16px}.theme-label{font-size:12px;color:var(--color-text);opacity:.9}.switch{position:relative;width:42px;height:24px;border-radius:999px;border:1px solid rgba(10,36,99,.2);background:#0a246314;cursor:pointer}.switch:before{content:"";position:absolute;top:2px;left:2px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 2px 6px #00000026;transition:left .18s ease}.switch.on{background:var(--color-accent);border-color:var(--color-accent)}.switch.on:before{left:20px}.cards{display:flex;flex-direction:column;gap:20px;margin-top:24px}.card{display:grid;grid-template-columns:80px 1fr;gap:16px;padding:20px;border:1px solid var(--color-border);border-radius:16px;box-shadow:0 8px 24px var(--shadow);background:var(--color-surface);transition:transform .3s ease,box-shadow .3s ease}.card.card-full{grid-template-columns:1fr}.card:hover{transform:translateY(-4px);box-shadow:0 8px 30px #00ffff1a}.avatar-wrap{display:flex;align-items:center;justify-content:center}.avatar-ring{padding:3px;border-radius:50%;background:var(--level-gradient, var(--color-accent))}.avatar{width:60px;height:60px;border-radius:50%;object-fit:cover;border:0;background:var(--color-surface)}.content{display:flex;flex-direction:column;gap:10px}.top-row{display:flex;align-items:center;flex-wrap:wrap;gap:10px}.name{font-size:18px;font-weight:700;color:var(--color-title)}.badge{font-size:12px;font-weight:700;padding:6px 10px;border-radius:999px;background:#00ffff26;color:var(--badge-text);border:1px solid var(--color-accent)}.subtitle{font-size:14px;color:var(--text-muted)}.bio{font-size:14px;line-height:1.6;color:var(--color-text)}.tags{display:flex;flex-wrap:wrap;gap:8px}.tag{font-size:12px;padding:6px 10px;border-radius:999px;background:var(--btn-secondary-bg);border:1px solid var(--btn-secondary-border);color:var(--btn-secondary-text);transition:background .2s ease,border-color .2s ease,color .2s ease}.tag:hover{background:var(--muted-bg);border-color:var(--color-accent)}.actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:4px}.btn{padding:10px 14px;border-radius:12px;border:1px solid transparent;font-weight:700;font-size:14px;cursor:pointer;transition:transform .06s ease,background .2s ease,color .2s ease,border-color .2s ease}.btn:active{transform:translateY(1px)}.btn-primary{background:var(--btn-primary-bg);color:var(--btn-primary-text)}.btn-primary:hover{background:var(--btn-primary-hover)}.btn-secondary{background:var(--btn-secondary-bg);color:var(--btn-secondary-text);border-color:var(--btn-secondary-border)}.btn-secondary:hover{background:var(--muted-bg);border-color:var(--color-accent)}.virtue-indicator{display:grid;grid-template-columns:1fr;gap:8px;margin-top:8px}.virtue-indicator.compact{grid-template-columns:repeat(3,1fr)}.virtue-item{display:flex;flex-direction:column;gap:6px}.virtue-label{font-size:12px;color:var(--color-text);opacity:.8}.virtue-bar{height:8px;border-radius:999px;background:var(--muted-bg);border:1px solid var(--muted-border);overflow:hidden}.virtue-fill{height:100%;background:linear-gradient(90deg,var(--color-accent),var(--color-primary))}.virtue-name{font-size:12px;color:var(--color-text);opacity:.8}.virtue-bar-container{height:8px;border-radius:999px;background:var(--muted-bg);border:1px solid var(--muted-border);overflow:hidden}.virtue-bar-container .virtue-bar{height:100%}.virtue-value{font-size:12px;color:var(--text-muted)}.compat-badge{display:flex;align-items:center;gap:8px;margin-top:6px}.compat-bar{position:relative;height:8px;width:120px;border-radius:999px;background:var(--muted-bg);border:1px solid var(--muted-border);overflow:hidden}.compat-fill{position:absolute;left:0;top:0;bottom:0;background:linear-gradient(90deg,var(--color-accent),var(--color-primary))}.compat-text{font-size:12px;color:var(--color-text);opacity:.8}.bottom-nav{position:fixed;left:0;right:0;bottom:0;background:var(--nav-bg);border-top:1px solid var(--color-border);box-shadow:0 -8px 24px var(--shadow);display:grid;grid-template-columns:repeat(6,1fr);gap:8px;padding:10px 8px}.nav-item{display:flex;flex-direction:column;align-items:center;gap:4px;color:var(--color-text);font-size:12px}.nav-item .icon{font-size:20px}.nav-item.active,.nav-item.active .icon{color:var(--nav-active)}.challenge-card{border:1px solid rgba(0,255,255,.25)}.participants-badge{font-size:12px;font-weight:700;padding:10px 14px;border-radius:12px;background:var(--btn-secondary-bg);border:1px solid var(--btn-secondary-border);color:var(--btn-secondary-text);transition:background .2s ease,border-color .2s ease,color .2s ease}.participants-badge:hover{background:var(--muted-bg);border-color:var(--color-accent)}.completed-badge{background:#00ffff26;border:1px solid var(--color-accent);color:var(--badge-text)}.challenge-completed{animation:pulseSuccess 2s ease}@keyframes pulseSuccess{0%,to{opacity:1}50%{opacity:.7}}@media (max-width:640px){.card{grid-template-columns:64px 1fr}.card.card-full{grid-template-columns:1fr}.logo{height:56px}.feed-title{font-size:18px}.theme-group{grid-template-columns:1fr;gap:8px}.theme-selector{gap:8px}.user-level.large{width:44px;height:44px}}.switch{width:36px;flex-basis:36px}.switch:before{width:16px;height:16px}.switch.on:before{left:18px}.bottom-nav{gap:6px}.nav-item{font-size:11px}} @media (min-width:641px) and (max-width:768px){.theme-group{grid-template-columns:repeat(3,minmax(0,1fr))}}.virtue-header{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;width:100%;margin-top:10px}