@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap";
@import "https://cdn.jsdelivr.net/npm/remixicon@3.5.0/fonts/remixicon.css";
:root{--bg:#000;--bg2:#08080a;--bg3:#0f0f12;--bg4:#161619;--bg5:#1c1c20;--border:#ffffff0f;--border2:#ffffff1a;--text:#f0f0f0;--text2:#ffffff80;--text3:#ffffff40;--accent:#00e676;--accent2:#69f0ae;--accent-dim:#00e6761f;--accent-glow:#00e67640;--danger:#ff5252;--warn:#ffd740;--info:#40c4ff;--radius:20px;--radius-sm:14px;--radius-xs:10px;--shadow:0 2px 12px #0006;--glass:#ffffff08;--transition:cubic-bezier(.4, 0, .2, 1)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;margin:0;padding:0}html{height:100%}body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,-apple-system,SF Pro Display,sans-serif;line-height:1.5}::-webkit-scrollbar{width:0;display:none}::selection{background:var(--accent-dim);color:var(--accent)}input,textarea,select{background:var(--bg3);border:1.5px solid var(--border2);color:var(--text);border-radius:var(--radius-sm);-webkit-appearance:none;width:100%;transition:border-color .2s var(--transition), box-shadow .2s var(--transition);outline:none;padding:14px 18px;font-family:inherit;font-size:15px}input:focus,textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-dim)}input::placeholder,textarea::placeholder{color:var(--text3)}textarea{resize:none}button{background:var(--accent);color:#000;border-radius:var(--radius-sm);cursor:pointer;transition:all .2s var(--transition);-webkit-appearance:none;letter-spacing:-.01em;border:none;padding:14px 28px;font-family:inherit;font-size:15px;font-weight:700;position:relative;overflow:hidden}button:hover{box-shadow:0 4px 20px var(--accent-glow);transform:translateY(-1px)}button:active{transform:translateY(0)scale(.98)}button:disabled{opacity:.4;cursor:not-allowed;box-shadow:none;transform:none}button.ghost{color:var(--accent);background:0 0;border:1.5px solid #00e67633}button.ghost:hover{background:var(--accent-dim);border-color:var(--accent);box-shadow:none}button.sm{border-radius:var(--radius-xs);padding:10px 18px;font-size:13px}button.mini{border-radius:8px;padding:7px 14px;font-size:12px;font-weight:600}button.danger{background:var(--danger)}button.danger:hover{box-shadow:0 4px 20px #ff52524d}.tag{background:var(--accent-dim);color:var(--accent);letter-spacing:.01em;transition:all .15s var(--transition);cursor:default;border-radius:20px;align-items:center;padding:5px 12px;font-size:12px;font-weight:600;display:inline-flex}.tag:hover{background:#00e67633}.badge{letter-spacing:.02em;border-radius:20px;padding:3px 10px;font-size:11px;font-weight:700;display:inline-flex}.badge.green{background:var(--accent-dim);color:var(--accent)}.badge.orange{color:var(--warn);background:#ffd7401f}.badge.red{color:var(--danger);background:#ff52521f}.avatar{background:linear-gradient(135deg, var(--bg4), var(--bg5));width:44px;height:44px;color:var(--accent);border:2px solid var(--border);transition:border-color .2s var(--transition);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:16px;font-weight:700;display:flex;overflow:hidden}.avatar:hover{border-color:var(--accent)}.avatar img{object-fit:cover;width:100%;height:100%}.avatar.sm{border-width:1.5px;width:36px;height:36px;font-size:14px}.avatar.lg{border-width:2.5px;width:60px;height:60px;font-size:24px}.avatar.xl{border-width:3px;width:88px;height:88px;font-size:34px}.card{background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius);transition:border-color .2s var(--transition), transform .15s var(--transition), box-shadow .2s var(--transition);margin-bottom:12px;padding:18px}.card:hover{border-color:var(--border2)}.card:active{transform:scale(.995)}.card-header{align-items:center;gap:12px;margin-bottom:12px;display:flex}.card-body{letter-spacing:-.01em;font-size:15px;line-height:1.7}.card-footer{border-top:1px solid var(--border);gap:0;margin-top:14px;padding-top:14px;display:flex}.card-footer .action{color:var(--text3);cursor:pointer;transition:all .15s var(--transition);border-radius:var(--radius-xs);flex:1;justify-content:center;align-items:center;gap:6px;padding:8px 0;font-size:13px;font-weight:500;display:flex}.card-footer .action:hover{color:var(--text2);background:var(--glass)}.card-footer .action:active{transform:scale(.95)}.card-footer .action.liked{color:var(--accent)}.tabs{border-bottom:1px solid var(--border);scrollbar-width:none;gap:0;margin-bottom:16px;display:flex;overflow-x:auto}.tabs::-webkit-scrollbar{display:none}.tab{color:var(--text3);cursor:pointer;transition:all .2s var(--transition);white-space:nowrap;border-bottom:2.5px solid #0000;flex-shrink:0;padding:12px 18px;font-size:14px;font-weight:600;position:relative}.tab:hover{color:var(--text2)}.tab.active{color:var(--accent);border-bottom-color:var(--accent)}.level-bar{background:var(--bg5);border-radius:2px;height:4px;overflow:hidden}.level-bar .fill{background:linear-gradient(90deg, var(--accent), var(--accent2));height:100%;transition:width .6s var(--transition);border-radius:2px}.search{margin-bottom:16px;position:relative}.search input{background:var(--bg3);border-color:#0000;border-radius:24px;padding:14px 18px 14px 44px;font-size:15px}.search input:focus{border-color:var(--accent);background:var(--bg4)}.search i{color:var(--text3);font-size:18px;position:absolute;top:50%;left:16px;transform:translateY(-50%)}.checkin{text-align:center;border-radius:var(--radius);background:linear-gradient(135deg,#00e6760f 0%,#0000 60%);border:1px solid #00e6761f;margin-bottom:16px;padding:24px 16px}.checkin .streak{color:var(--accent);text-shadow:0 0 40px var(--accent-glow);font-size:48px;font-weight:900;line-height:1}.lb{border-bottom:1px solid var(--border);align-items:center;gap:12px;padding:12px 0;display:flex}.lb:last-child{border:none}.lb .rank{background:var(--bg4);width:28px;height:28px;color:var(--text3);border-radius:50%;justify-content:center;align-items:center;font-size:12px;font-weight:800;display:flex}.lb .rank.r1{color:#000;background:linear-gradient(135deg,gold,#ffa000);box-shadow:0 2px 12px #ffd7004d}.lb .rank.r2{color:#000;background:linear-gradient(135deg,#e0e0e0,#9e9e9e)}.lb .rank.r3{color:#fff;background:linear-gradient(135deg,#cd7f32,sienna)}.chat-bubble{word-break:break-all;border-radius:20px;max-width:78%;padding:12px 16px;font-size:15px;line-height:1.5;display:inline-block}.chat-bubble.me{background:var(--accent);color:#000;border-bottom-right-radius:6px;font-weight:500}.chat-bubble.them{background:var(--bg4);color:var(--text);border-bottom-left-radius:6px}.empty{text-align:center;color:var(--text3);padding:60px 24px}.empty i{opacity:.5;margin-bottom:12px;font-size:48px;display:block}.empty .empty-text{font-size:15px;font-weight:500}.profile-cover{border-radius:var(--radius) var(--radius) 0 0;background:linear-gradient(135deg,#0a1a0f 0%,#0a0f1a 50%,#0f0a1a 100%);height:140px;position:relative;overflow:hidden}.profile-cover:after{content:"";background:linear-gradient(to top, var(--bg2) 0%, transparent 40%);position:absolute;inset:0}.profile-stats{background:var(--bg3);border-radius:var(--radius-sm);border:1px solid var(--border);gap:0;margin-top:16px;display:flex;overflow:hidden}.profile-stats .stat{text-align:center;flex:1;padding:14px 0}.profile-stats .stat:not(:last-child){border-right:1px solid var(--border)}.profile-stats .num{letter-spacing:-.02em;font-size:18px;font-weight:800}.profile-stats .label{color:var(--text3);text-transform:uppercase;letter-spacing:.05em;margin-top:2px;font-size:11px;font-weight:500}.toast{background:var(--bg4);border:1px solid var(--border2);border-radius:var(--radius-sm);z-index:2000;animation:toastIn .35s var(--transition);white-space:nowrap;-webkit-backdrop-filter:blur(20px);padding:14px 24px;font-size:14px;font-weight:600;position:fixed;top:70px;left:50%;transform:translate(-50%);box-shadow:0 8px 32px #00000080}.toast.success{color:var(--accent);border-color:#00e6764d}.toast.error{color:var(--danger);border-color:#ff52524d}@keyframes toastIn{0%{opacity:0;transform:translate(-50%)translateY(-16px)scale(.95)}to{opacity:1;transform:translate(-50%)translateY(0)scale(1)}}.modal-overlay{-webkit-backdrop-filter:blur(8px);z-index:1000;animation:fadeIn .2s var(--transition);background:#000000bf;justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}.modal{background:var(--bg2);border:1px solid var(--border2);border-radius:var(--radius) var(--radius) 0 0;width:100%;max-width:520px;max-height:85vh;padding:24px 20px calc(24px + env(safe-area-inset-bottom));animation:slideUp .35s var(--transition);overflow-y:auto;box-shadow:0 -8px 40px #00000080}.modal h3{letter-spacing:-.02em;margin-bottom:20px;font-size:18px;font-weight:800}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.skeleton{background:linear-gradient(90deg, var(--bg3) 25%, var(--bg4) 50%, var(--bg3) 75%);border-radius:var(--radius-xs);background-size:200% 100%;animation:1.5s infinite shimmer}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.page-enter{animation:pageIn .3s var(--transition)}@keyframes pageIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@media (min-width:768px){.card{padding:24px}}