:root{--bg:#06080f;--bg2:#0c1019;--card:#12172a;--card2:#1a2038;--card3:#222940;--green:#22c55e;--green2:rgba(34,197,94,.10);--red:#f43f5e;--red2:rgba(244,63,94,.10);--blue:#6366f1;--blue2:rgba(99,102,241,.12);--amber:#eab308;--purple:#a78bfa;--cyan:#22d3ee;--text:#eef2ff;--text2:#a5b4d4;--text3:#5b6a8a;--brd:rgba(255,255,255,.06);--brd2:rgba(255,255,255,.1);--glow:rgba(99,102,241,.2);--r:14px}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'DM Sans',sans-serif;background:var(--bg);color:var(--text);min-height:100vh;overflow-x:hidden}
body::after{content:'';position:fixed;inset:0;background:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.03'/%3E%3C/svg%3E");pointer-events:none;z-index:0}
.ambient{position:fixed;width:600px;height:600px;border-radius:50%;filter:blur(120px);opacity:.06;pointer-events:none;z-index:0}
.ambient-1{top:-200px;right:-100px;background:var(--blue)}.ambient-2{bottom:-200px;left:-100px;background:var(--purple)}
.app{position:relative;z-index:1}
.auth-screen{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px}
.auth-card{background:var(--card);border:1px solid var(--brd);border-radius:20px;padding:44px 36px;max-width:400px;width:100%;text-align:center;position:relative;overflow:hidden}
.auth-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--blue),var(--purple),var(--cyan))}
.auth-logo{width:52px;height:52px;background:linear-gradient(135deg,var(--blue),var(--purple));border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:24px;font-weight:800;margin:0 auto 18px;box-shadow:0 8px 25px var(--glow)}
.auth-card h1{font-size:24px;font-weight:700;margin-bottom:5px}.auth-card .sub{color:var(--text2);font-size:13px;margin-bottom:28px}
.auth-tabs{display:flex;background:var(--bg2);border-radius:9px;padding:3px;margin-bottom:22px}
.auth-tab{flex:1;padding:9px;border:none;background:none;color:var(--text3);font-family:'DM Sans';font-size:13px;font-weight:500;cursor:pointer;border-radius:7px;transition:.3s}
.auth-tab.active{background:var(--card2);color:var(--text);box-shadow:0 2px 8px rgba(0,0,0,.3)}
.auth-form{display:flex;flex-direction:column;gap:12px}.field{text-align:left}
.field label{display:block;font-size:11px;font-weight:600;color:var(--text2);margin-bottom:5px;letter-spacing:.3px}
.field input{width:100%;padding:11px 14px;background:var(--bg2);border:1px solid var(--brd);border-radius:9px;color:var(--text);font-family:'DM Sans';font-size:14px;transition:.3s}
.field input:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px var(--glow)}
.auth-btn{width:100%;padding:12px;background:linear-gradient(135deg,var(--blue),#8b5cf6);color:white;border:none;border-radius:9px;font-family:'DM Sans';font-size:14px;font-weight:600;cursor:pointer;transition:.3s;margin-top:6px}
.auth-btn:hover{transform:translateY(-1px);box-shadow:0 8px 20px var(--glow)}.auth-error{color:var(--red);font-size:12px;min-height:18px;margin-top:3px}
header{padding:12px 20px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--brd);background:rgba(6,8,15,.85);backdrop-filter:blur(24px);position:sticky;top:0;z-index:100;flex-wrap:wrap;gap:10px}
.logo{display:flex;align-items:center;gap:9px}
.logo-i{width:34px;height:34px;background:linear-gradient(135deg,var(--blue),var(--purple));border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:800;box-shadow:0 4px 10px var(--glow)}
.logo-t{font-size:16px;font-weight:700;background:linear-gradient(135deg,#eef2ff,#a5b4d4);-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.hdr-right{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.stats{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.st{display:flex;align-items:center;gap:5px;font-size:12px;color:var(--text2)}
.sv{font-family:'IBM Plex Mono';font-weight:600;font-size:13px}.sv.g{color:var(--green)}.sv.r{color:var(--red)}.sv.a{color:var(--amber)}
.xp-wrap{display:flex;align-items:center;gap:7px}.xp-bar{width:80px;height:5px;background:var(--card);border-radius:3px;overflow:hidden}
.xp-fill{height:100%;background:linear-gradient(90deg,var(--blue),var(--purple));border-radius:3px;transition:width .6s cubic-bezier(.34,1.56,.64,1)}
.lvl{background:linear-gradient(135deg,var(--blue),var(--purple));padding:3px 8px;border-radius:5px;font-size:10px;font-weight:700;letter-spacing:.5px}
.user-menu{position:relative;display:flex;align-items:center;gap:7px;background:var(--card);border:1px solid var(--brd);padding:5px 12px 5px 8px;border-radius:9px;cursor:pointer;transition:.3s;position:relative}
.user-menu:hover{background:var(--card2);border-color:var(--brd2)}
.avatar{width:26px;height:26px;background:linear-gradient(135deg,var(--blue),var(--cyan));border-radius:7px;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700}
.user-name{font-size:13px;font-weight:500}
.user-dd{position:absolute;top:calc(100% + 6px);right:0;background:var(--card2);border:1px solid var(--brd2);border-radius:9px;padding:5px;min-width:150px;display:none;z-index:200;box-shadow:0 10px 35px rgba(0,0,0,.5)}
.user-dd.open{display:block}.user-dd.show{display:block}.ddi{padding:8px 12px;font-size:13px;border-radius:6px;cursor:pointer;transition:.2s;color:var(--text2)}.ddi:hover{background:var(--card3);color:var(--text)}.ddi.dng{color:var(--red)}
.main{max-width:1080px;margin:0 auto;padding:24px 20px}.screen{display:none}.screen.active{display:block}
.dash-top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:28px;flex-wrap:wrap;gap:16px}
.dash-welcome h2{font-size:26px;font-weight:700;margin-bottom:5px}.dash-welcome p{color:var(--text2);font-size:14px}
.streak-card{background:var(--card);border:1px solid var(--brd);border-radius:var(--r);padding:16px 20px;display:flex;align-items:center;gap:12px}
.streak-num{font-family:'IBM Plex Mono';font-size:22px;font-weight:700;color:var(--amber)}.streak-label{font-size:11px;color:var(--text3)}
.stat-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin-bottom:24px}
.stat-card{background:var(--card);border:1px solid var(--brd);border-radius:var(--r);padding:16px;transition:.3s}.stat-card:hover{border-color:var(--brd2)}
.sc-label{font-size:11px;color:var(--text3);margin-bottom:6px}.sc-val{font-family:'IBM Plex Mono';font-size:20px;font-weight:700}
.section-title{font-size:15px;font-weight:600;margin-bottom:12px}
.diff-bar{display:flex;gap:7px;margin-bottom:18px}
.diff-btn{padding:7px 16px;border-radius:7px;border:1px solid var(--brd);background:var(--card);color:var(--text2);font-family:'DM Sans';font-size:13px;font-weight:500;cursor:pointer;transition:.3s}
.diff-btn.active{background:var(--blue2);border-color:rgba(99,102,241,.4);color:#a5b4fc}.diff-btn:hover:not(.active){background:var(--card2)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px;margin-bottom:24px}
.cat-card{background:var(--card);border:1px solid var(--brd);border-radius:var(--r);padding:18px;cursor:pointer;transition:.3s;position:relative;overflow:hidden}
.cat-card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--blue),var(--purple));opacity:0;transition:.3s}
.cat-card:hover{background:var(--card2);border-color:var(--brd2);transform:translateY(-2px);box-shadow:0 6px 20px rgba(0,0,0,.3)}.cat-card:hover::before{opacity:1}
.cat-code{font-family:'IBM Plex Mono';font-size:11px;color:var(--blue);margin-bottom:6px;font-weight:500}.cat-name{font-size:14px;font-weight:600;margin-bottom:3px}.cat-desc{font-size:11px;color:var(--text3)}
.code-search-area{margin-bottom:24px}
.code-search-input{width:100%;max-width:400px;padding:11px 16px;background:var(--bg2);border:1px solid var(--brd);border-radius:10px;color:var(--text);font-family:'DM Sans';font-size:14px;transition:.3s}
.code-search-input:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px var(--glow)}.code-search-input::placeholder{color:var(--text3)}
.code-results{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.code-tag{padding:6px 14px;background:var(--card);border:1px solid var(--brd);border-radius:8px;font-size:12px;cursor:pointer;transition:.3s;display:flex;align-items:center;gap:6px}
.code-tag:hover{background:var(--blue2);border-color:rgba(99,102,241,.3)}.code-tag .cc{font-family:'IBM Plex Mono';color:var(--blue);font-weight:600}
.start-btns{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:6px}
.btn{background:linear-gradient(135deg,var(--blue),#8b5cf6);color:#fff;border:none;padding:11px 24px;font-size:14px;font-weight:600;border-radius:10px;cursor:pointer;font-family:'DM Sans';transition:.3s;box-shadow:0 4px 12px var(--glow);display:inline-flex;align-items:center;gap:6px}
.btn:hover{transform:translateY(-2px);box-shadow:0 8px 20px var(--glow)}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}
.btn.ai-btn{background:linear-gradient(135deg,#22d3ee,#6366f1)}
.btn2{background:var(--card);color:var(--text);border:1px solid var(--brd);padding:9px 18px;font-size:13px;font-weight:500;border-radius:9px;cursor:pointer;font-family:'DM Sans';transition:.3s}.btn2:hover{background:var(--card2);border-color:var(--brd2)}
.game-hdr{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;flex-wrap:wrap;gap:8px}
.q-cnt{font-family:'IBM Plex Mono';font-size:12px;color:var(--text3)}
.sc-card{background:var(--card);border:1px solid var(--brd);border-radius:var(--r);padding:24px;margin-bottom:18px;position:relative}
.sc-badge{display:inline-flex;align-items:center;gap:5px;background:var(--blue2);border:1px solid rgba(99,102,241,.2);padding:4px 10px;border-radius:6px;font-size:11px;color:#a5b4fc;font-weight:500;margin-bottom:12px}
.ai-badge{display:inline-flex;align-items:center;gap:4px;background:rgba(34,211,238,.08);border:1px solid rgba(34,211,238,.2);padding:3px 9px;border-radius:5px;font-size:10px;color:var(--cyan);font-weight:600;margin-left:6px}
.sc-text{font-size:16px;line-height:1.75;margin-bottom:12px}
.sc-hint{display:inline-flex;align-items:center;gap:5px;font-size:12px;color:var(--text3);background:rgba(255,255,255,.02);padding:6px 10px;border-radius:6px;cursor:pointer;transition:.3s;user-select:none}.sc-hint:hover{background:rgba(255,255,255,.05);color:var(--text2)}
.hint-box{display:none;margin-top:10px;padding:12px;background:rgba(167,139,250,.06);border:1px solid rgba(167,139,250,.12);border-radius:8px;font-size:12px;color:var(--text2);line-height:1.6}.hint-box.show{display:block}
.journal{background:var(--card);border:1px solid var(--brd);border-radius:var(--r);padding:20px;margin-bottom:18px}
.j-title{font-size:14px;font-weight:600;margin-bottom:14px}
table{width:100%;border-collapse:separate;border-spacing:0}
th{text-align:left;padding:7px 9px;font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.8px;color:var(--text3);border-bottom:1px solid var(--brd)}
td{padding:4px 7px;vertical-align:middle}.entry-row td{border-bottom:1px solid rgba(255,255,255,.02)}
.sel-wrap{position:relative}.sel-input{width:100%;background:var(--bg2);border:1px solid var(--brd);color:var(--text);padding:8px 10px;border-radius:7px;font-family:'DM Sans';font-size:12px;transition:.3s}
.sel-input:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px var(--glow)}.sel-input::placeholder{color:var(--text3)}
.dd{position:absolute;top:100%;left:0;right:0;max-height:170px;overflow-y:auto;background:var(--card2);border:1px solid var(--brd2);border-radius:7px;margin-top:3px;z-index:50;display:none}
.dd.open{display:block}.dd-item{padding:6px 10px;font-size:11px;cursor:pointer;transition:.15s;display:flex;gap:7px}.dd-item:hover{background:var(--card3)}.dd-item .c{font-family:'IBM Plex Mono';color:#a5b4fc;min-width:32px;font-size:10px}
.amt{width:100%;background:var(--bg2);border:1px solid var(--brd);color:var(--text);padding:8px 10px;border-radius:7px;font-family:'IBM Plex Mono';font-size:12px;text-align:right;transition:.3s}
.amt:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px var(--glow)}.amt::placeholder{color:var(--text3);font-family:'DM Sans'}
.rm-btn{background:none;border:none;color:var(--text3);cursor:pointer;font-size:15px;padding:2px 5px;border-radius:4px;transition:.2s}.rm-btn:hover{color:var(--red);background:var(--red2)}
.add-btn{display:inline-flex;align-items:center;gap:4px;background:rgba(99,102,241,.06);border:1px dashed rgba(99,102,241,.25);color:#a5b4fc;padding:6px 12px;border-radius:6px;font-size:11px;font-weight:500;cursor:pointer;font-family:'DM Sans';margin-top:8px;transition:.3s}.add-btn:hover{background:rgba(99,102,241,.12);border-color:rgba(99,102,241,.4)}
.totals{display:flex;justify-content:flex-end;gap:28px;margin-top:12px;padding-top:12px;border-top:2px solid var(--brd)}
.tot{text-align:right}.tot-label{font-size:10px;color:var(--text3);text-transform:uppercase;letter-spacing:.5px;margin-bottom:2px}
.tot-val{font-family:'IBM Plex Mono';font-size:17px;font-weight:600}.tot-val.ok{color:var(--green)}.tot-val.no{color:var(--red)}
.actions{display:flex;gap:10px;justify-content:center;margin-bottom:18px}
.ai-loading{display:flex;align-items:center;gap:10px;justify-content:center;padding:18px;color:var(--text2);font-size:13px}
.ai-dots span{display:inline-block;width:7px;height:7px;background:var(--blue);border-radius:50%;margin:0 2px;animation:bounce .8s infinite}
.ai-dots span:nth-child(2){animation-delay:.15s}.ai-dots span:nth-child(3){animation-delay:.3s}
@keyframes bounce{0%,100%{transform:translateY(0);opacity:.4}50%{transform:translateY(-7px);opacity:1}}
.fb{border-radius:var(--r);padding:22px;margin-bottom:18px;display:none;animation:slideUp .4s cubic-bezier(.34,1.56,.64,1)}
@keyframes slideUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
.fb.ok{display:block;background:var(--green2);border:1px solid rgba(34,197,94,.2)}.fb.no{display:block;background:var(--red2);border:1px solid rgba(244,63,94,.2)}
.fb-hdr{display:flex;align-items:center;gap:9px;margin-bottom:10px}
.fb-icon{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:700}
.ok .fb-icon{background:rgba(34,197,94,.15);color:var(--green)}.no .fb-icon{background:rgba(244,63,94,.15);color:var(--red)}
.fb-title{font-size:16px;font-weight:700}.ok .fb-title{color:var(--green)}.no .fb-title{color:var(--red)}
.fb-body{font-size:13px;line-height:1.9;color:var(--text2)}.fb-body strong{color:var(--text);font-weight:600}
.correct-tbl{background:rgba(0,0,0,.2);border-radius:8px;padding:12px;margin-top:12px;font-family:'IBM Plex Mono';font-size:12px}
.correct-tbl .line{display:flex;justify-content:space-between;padding:2px 0;gap:12px}.correct-tbl .acc{flex:2}.correct-tbl .b{flex:1;text-align:right;color:#818cf8}.correct-tbl .al{flex:1;text-align:right;color:var(--amber)}
.ai-fb{margin-top:14px;padding:16px;background:rgba(34,211,238,.04);border:1px solid rgba(34,211,238,.08);border-radius:9px;font-size:13px;line-height:1.9;color:var(--text2)}
.ai-tag{font-size:11px;font-weight:600;color:var(--cyan);margin-bottom:8px;letter-spacing:.3px}
.result-card{background:var(--card);border:1px solid var(--brd);border-radius:16px;padding:36px;text-align:center;max-width:460px;margin:40px auto}
.result-card h2{font-size:24px;font-weight:800;margin-bottom:6px}
.score-big{font-family:'IBM Plex Mono';font-size:52px;font-weight:700;background:linear-gradient(135deg,var(--green),var(--blue));-webkit-background-clip:text;-webkit-text-fill-color:transparent;margin:16px 0}
.r-stats{display:flex;justify-content:center;gap:22px;margin:18px 0}
.lb-card{background:var(--card);border:1px solid var(--brd);border-radius:var(--r);padding:18px;margin-bottom:18px}
.lb-card h3{font-size:14px;font-weight:600;margin-bottom:12px}
.lb-row{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.03)}.lb-row:last-child{border-bottom:none}
.lb-rank{font-family:'IBM Plex Mono';font-size:13px;font-weight:600;color:var(--text3);min-width:26px}.lb-rank.gold{color:var(--amber)}.lb-rank.silver{color:#94a3b8}.lb-rank.bronze{color:#cd7c2f}
.lb-name{flex:1;font-size:13px}.lb-score{font-family:'IBM Plex Mono';font-size:13px;font-weight:600;color:var(--blue)}
.confetti{position:fixed;inset:0;pointer-events:none;z-index:1000;overflow:hidden}
.conf-piece{position:absolute;width:8px;height:8px;top:-10px;animation:cfall 3s ease-in forwards}
@keyframes cfall{0%{transform:translateY(0) rotate(0);opacity:1}100%{transform:translateY(100vh) rotate(720deg);opacity:0}}
@keyframes shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}.shake{animation:shake .4s ease}
@keyframes pulseG{0%,100%{box-shadow:0 0 0 0 var(--glow)}50%{box-shadow:0 0 14px 4px var(--glow)}}.new-q{animation:pulseG .8s ease}
::-webkit-scrollbar{width:5px}::-webkit-scrollbar-track{background:var(--bg)}::-webkit-scrollbar-thumb{background:var(--brd2);border-radius:3px}
@media(max-width:768px){.dash-welcome h2{font-size:20px}.grid{grid-template-columns:1fr}.stat-cards{grid-template-columns:repeat(2,1fr)}.sc-text{font-size:14px}.actions{flex-direction:column;align-items:stretch}.auth-card{padding:28px 20px}}
.tab-bar { display: flex; gap: 4px; background: var(--bg2); padding: 4px; border-radius: 10px; margin-bottom: 24px; }
.main-tab { flex: 1; padding: 10px 16px; border: none; background: none; color: var(--text3); font-family: 'DM Sans'; font-size: 14px; font-weight: 500; cursor: pointer; border-radius: 8px; transition: .3s; }
.main-tab.active { background: var(--card); color: var(--text); box-shadow: 0 2px 8px rgba(0,0,0,.3); }
.main-tab:hover:not(.active) { color: var(--text2); }
.hp-header { margin-bottom: 20px; }
.hp-header h2 { font-size: 22px; font-weight: 700; margin-bottom: 6px; }
.hp-header p { color: var(--text2); font-size: 13px; line-height: 1.6; }
.hp-filters { margin-bottom: 20px; }
.hp-group-bar { display: flex; gap: 5px; margin-top: 10px; flex-wrap: wrap; }
.hp-grp-btn { padding: 5px 12px; border-radius: 6px; border: 1px solid var(--brd); background: var(--card); color: var(--text3); font-family: 'DM Sans'; font-size: 11px; font-weight: 500; cursor: pointer; transition: .3s; white-space: nowrap; }
.hp-grp-btn.active { background: var(--blue2); border-color: rgba(99,102,241,.4); color: #a5b4fc; }
.hp-grp-btn:hover:not(.active) { background: var(--card2); }
.hp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 10px; }
.hp-card { background: var(--card); border: 1px solid var(--brd); border-radius: 12px; padding: 16px; cursor: pointer; transition: .3s; }
.hp-card:hover { background: var(--card2); border-color: var(--brd2); transform: translateY(-1px); box-shadow: 0 4px 15px rgba(0,0,0,.2); }
.hp-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.hp-code { font-family: 'IBM Plex Mono'; font-size: 16px; font-weight: 700; color: var(--blue); }
.hp-tip { font-size: 10px; font-weight: 600; padding: 3px 8px; border-radius: 5px; border: 1px solid; letter-spacing: .3px; }
.hp-name { font-size: 14px; font-weight: 600; margin-bottom: 6px; }
.hp-desc { font-size: 12px; color: var(--text3); line-height: 1.6; margin-bottom: 8px; }
.hp-side { font-size: 11px; font-weight: 600; }
@media(max-width: 768px) { .hp-grid { grid-template-columns: 1fr; } .hp-group-bar { gap: 3px; } .hp-grp-btn { font-size: 10px; padding: 4px 8px; } }
.tab-bar{display:flex;gap:4px;background:var(--bg2);padding:4px;border-radius:10px;margin-bottom:24px}
.main-tab{flex:1;padding:10px 16px;border:none;background:none;color:var(--text3);font-family:'DM Sans';font-size:13px;font-weight:500;cursor:pointer;border-radius:8px;transition:.3s}
.main-tab.active{background:var(--card);color:var(--text);box-shadow:0 2px 8px rgba(0,0,0,.3)}
.hp-header{margin-bottom:20px}.hp-header h2{font-size:22px;font-weight:700;margin-bottom:6px}.hp-header p{color:var(--text2);font-size:13px}
.hp-filters{margin-bottom:20px}.hp-group-bar{display:flex;gap:5px;margin-top:10px;flex-wrap:wrap}
.hp-grp-btn{padding:5px 12px;border-radius:6px;border:1px solid var(--brd);background:var(--card);color:var(--text3);font-family:'DM Sans';font-size:11px;font-weight:500;cursor:pointer;transition:.3s;white-space:nowrap}
.hp-grp-btn.active{background:var(--blue2);border-color:rgba(99,102,241,.4);color:#a5b4fc}
.hp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:10px}
.hp-card{background:var(--card);border:1px solid var(--brd);border-radius:12px;padding:16px;cursor:pointer;transition:.3s}
.hp-card:hover{background:var(--card2);border-color:var(--brd2);transform:translateY(-1px)}
.hp-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.hp-code{font-family:'IBM Plex Mono';font-size:16px;font-weight:700;color:var(--blue)}
.hp-tip{font-size:10px;font-weight:600;padding:3px 8px;border-radius:5px;border:1px solid}
.hp-name{font-size:14px;font-weight:600;margin-bottom:6px}.hp-desc{font-size:12px;color:var(--text3);line-height:1.6;margin-bottom:8px}
.hp-side{font-size:11px;font-weight:600}
.mode-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px;margin-bottom:24px}
.mode-card{background:var(--card);border:1px solid var(--brd);border-radius:var(--r);padding:18px;cursor:pointer;transition:.3s;display:flex;flex-direction:column;gap:4px;position:relative;overflow:hidden}
.mode-card:hover{background:var(--card2);border-color:var(--brd2);transform:translateY(-2px);box-shadow:0 6px 20px rgba(0,0,0,.3)}
.mode-card:active{transform:translateY(0)}
.mode-icon{font-size:28px;margin-bottom:6px}
.mode-name{font-size:14px;font-weight:700;color:var(--text);margin-bottom:4px}
.mode-desc{font-size:12px;color:var(--text3);line-height:1.5;flex:1}
.mode-tag{display:inline-block;font-size:10px;font-weight:700;padding:3px 8px;border-radius:20px;margin-top:8px;letter-spacing:.3px}
.tag-base{background:rgba(99,102,241,.15);color:#818cf8}
.tag-fun{background:rgba(251,191,36,.15);color:#fbbf24}
.tag-new{background:rgba(34,211,238,.15);color:#22d3ee}
.tag-premium{background:rgba(139,92,246,.15);color:#a78bfa}
.tag-personal{background:rgba(239,68,68,.15);color:#f87171}
.rev-journal{background:var(--card);border:1px solid var(--brd);border-radius:10px;padding:16px;margin-bottom:18px;font-family:'IBM Plex Mono';font-size:13px}
.rev-hdr{display:flex;gap:10px;padding-bottom:8px;border-bottom:1px solid var(--brd);font-weight:600;color:var(--text3);font-size:11px;text-transform:uppercase}
.rev-row{display:flex;gap:10px;padding:5px 0;border-bottom:1px solid rgba(255,255,255,.02)}
.rev-col{flex:2}.rev-col.r{flex:1;text-align:right}
.rev-q{font-size:15px;font-weight:600;margin:16px 0;text-align:center}
.rev-opts{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:16px}
.rev-opt{padding:12px 16px;background:var(--card);border:1px solid var(--brd);border-radius:9px;color:var(--text);font-family:'DM Sans';font-size:13px;cursor:pointer;transition:.3s;text-align:left}
.rev-opt:hover:not(.locked){background:var(--card2);border-color:var(--brd2)}
.rev-opt.correct{background:var(--green2);border-color:var(--green);color:var(--green)}
.rev-opt.wrong{background:var(--red2);border-color:var(--red);color:var(--red)}
.rev-opt.locked{cursor:default}
.rev-fb-box{background:rgba(34,211,238,.04);border:1px solid rgba(34,211,238,.08);border-radius:9px;padding:14px;font-size:13px;line-height:1.8;color:var(--text2);margin-top:12px}
.speed-hdr{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}
.speed-timer{font-family:'IBM Plex Mono';font-size:32px;font-weight:700;color:var(--green);transition:.3s}
.speed-timer.urgent{color:var(--red);animation:pulse 1s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.5}}
.speed-score-box{text-align:center}.speed-score-label{font-size:11px;color:var(--text3)}.speed-score-val{font-family:'IBM Plex Mono';font-size:24px;font-weight:700;color:var(--amber)}
.speed-ok{background:var(--green2);border:1px solid rgba(34,197,94,.2);border-radius:8px;padding:10px;text-align:center;color:var(--green);font-weight:600;animation:slideUp .3s}
.speed-no{background:var(--red2);border:1px solid rgba(244,63,94,.2);border-radius:8px;padding:10px;text-align:center;color:var(--red);font-weight:600;animation:slideUp .3s}
.sort-card{background:var(--card);border:1px solid var(--brd);border-radius:var(--r);padding:30px;text-align:center;max-width:500px;margin:20px auto}
.sort-code{font-family:'IBM Plex Mono';font-size:36px;font-weight:700;color:var(--blue);margin-bottom:6px}
.sort-name{font-size:18px;font-weight:600;margin-bottom:16px}
.sort-q{color:var(--text2);font-size:14px;margin-bottom:20px}
.sort-btns{display:flex;gap:12px;justify-content:center}
.sort-btn{padding:14px 36px;border:2px solid var(--brd);border-radius:10px;font-family:'DM Sans';font-size:16px;font-weight:700;cursor:pointer;transition:.3s;background:var(--card2);color:var(--text)}
.sort-btn.borc{border-color:rgba(99,102,241,.3)}.sort-btn.borc:hover:not(.locked){background:var(--blue2);border-color:var(--blue)}
.sort-btn.alacak{border-color:rgba(234,179,8,.3)}.sort-btn.alacak:hover:not(.locked){background:var(--amber);color:var(--bg);border-color:var(--amber)}
.sort-btn.locked{cursor:default;opacity:.6}
.sort-fb{margin-top:16px;padding:12px;border-radius:8px;font-size:13px;line-height:1.6}
.sort-fb.ok{background:var(--green2);border:1px solid rgba(34,197,94,.2);color:var(--text2)}
.sort-fb.no{background:var(--red2);border:1px solid rgba(244,63,94,.2);color:var(--text2)}
.bal-card{background:var(--card);border:1px solid var(--brd);border-radius:var(--r);padding:24px;max-width:600px;margin:0 auto}
.bal-q{font-size:15px;line-height:1.8;margin-bottom:18px}
.lesson-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px;margin-bottom:24px}
.lesson-card{background:var(--card);border:1px solid var(--brd);border-radius:var(--r);padding:18px;cursor:pointer;transition:.3s}
.lesson-card:hover{background:var(--card2);border-color:var(--brd2);transform:translateY(-2px)}
.lesson-title{font-size:14px;font-weight:600;margin-bottom:4px}.lesson-count{font-size:11px;color:var(--text3)}
.flash-card{background:var(--card);border:1px solid var(--brd);border-radius:var(--r);padding:28px;max-width:600px;margin:20px auto;text-align:center}
.flash-q{font-size:18px;font-weight:600;margin-bottom:18px;line-height:1.6}
.flash-a{font-size:14px;color:var(--text2);line-height:1.9;margin-bottom:18px;padding:16px;background:rgba(34,211,238,.04);border:1px solid rgba(34,211,238,.08);border-radius:9px;text-align:left}
.flash-btns{display:flex;gap:10px;justify-content:center}
.map-container{margin-bottom:24px}
.map-title{font-size:16px;font-weight:600;margin-bottom:14px}
.map-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px;margin-bottom:18px}
.map-box{border-radius:10px;padding:16px;border:1px solid}
.map-box.aktif{background:rgba(99,102,241,.06);border-color:rgba(99,102,241,.2)}
.map-box.pasif{background:rgba(244,63,94,.06);border-color:rgba(244,63,94,.2)}
.map-box.ozkaynak{background:rgba(167,139,250,.06);border-color:rgba(167,139,250,.2)}
.map-box.gelir{background:rgba(34,197,94,.06);border-color:rgba(34,197,94,.2)}
.map-box.gider{background:rgba(234,179,8,.06);border-color:rgba(234,179,8,.2)}
.map-box-title{font-size:13px;font-weight:700;margin-bottom:5px}
.map-box-desc{font-size:11px;color:var(--text3);margin-bottom:8px;line-height:1.5}
.map-rule{display:flex;gap:10px;font-size:11px;font-weight:600}
.map-borc{color:var(--blue);background:var(--blue2);padding:3px 8px;border-radius:4px}
.map-alacak{color:var(--amber);background:rgba(234,179,8,.1);padding:3px 8px;border-radius:4px}
.map-formula{background:var(--card);border:2px solid var(--brd2);border-radius:12px;padding:20px;text-align:center}
.map-formula-title{font-size:12px;font-weight:600;color:var(--text3);margin-bottom:6px}
.map-formula-text{font-family:'IBM Plex Mono';font-size:20px;font-weight:700;color:var(--blue);margin-bottom:4px}
.map-formula-sub{font-size:12px;color:var(--text2)}
.err-card{background:var(--card);border:1px solid var(--brd);border-radius:var(--r);padding:20px}
.err-card h3{font-size:14px;font-weight:600;margin-bottom:12px}
.err-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:14px}
.err-advice{font-size:13px;color:var(--text2);line-height:1.7;padding:12px;background:rgba(99,102,241,.05);border-radius:8px}
.err-tips{margin-top:10px;display:flex;flex-direction:column;gap:6px}
.err-tip{font-size:12px;color:var(--text2);padding:10px 14px;background:var(--card2);border-radius:8px;border-left:3px solid var(--blue);line-height:1.5}
@media(max-width:768px){.hp-grid{grid-template-columns:1fr}.mode-grid{grid-template-columns:1fr}.rev-opts{grid-template-columns:1fr}.map-grid{grid-template-columns:1fr}.err-stats{grid-template-columns:repeat(2,1fr)}}
.quota-bar{margin-bottom:16px}
.quota-badge{display:inline-flex;align-items:center;padding:5px 14px;border-radius:20px;font-size:12px;font-weight:600}
.quota-badge.prem{background:linear-gradient(135deg,rgba(99,102,241,.15),rgba(139,92,246,.15));color:#a78bfa;border:1px solid rgba(139,92,246,.2)}
.quota-badge.free{background:rgba(234,179,8,.08);color:var(--amber);border:1px solid rgba(234,179,8,.15)}
.hp-example{font-size:11px;color:var(--text3);padding:8px 10px;background:rgba(99,102,241,.04);border-radius:6px;margin:6px 0 8px;line-height:1.6;border-left:2px solid var(--blue)}
.hp-ex-label{font-weight:600;color:var(--text2)}
.hp-bottom{margin-top:6px;padding-top:8px;border-top:1px solid var(--brd)}
.hp-side{display:flex;align-items:center;gap:6px;font-size:11px;font-weight:600}
.hp-side-icon{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:4px;font-size:10px;font-weight:700}
.prog-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:20px}
.prog-section{background:var(--card);border:1px solid var(--brd);border-radius:var(--r);padding:18px;margin-bottom:14px}
.prog-title{font-size:14px;font-weight:600;margin-bottom:12px}
.prog-title.bad-title{color:var(--red)}.prog-title.good-title{color:var(--green)}
.prog-row{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.03)}
.prog-row:last-child{border:none}
.prog-info{min-width:140px;display:flex;gap:6px;align-items:center}
.prog-code{font-family:'IBM Plex Mono';font-size:12px;font-weight:600;color:var(--blue);min-width:32px}
.prog-name{font-size:12px;color:var(--text2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.prog-bar-wrap{flex:1;display:flex;align-items:center;gap:6px}
.prog-bar-bg{flex:1;height:6px;background:var(--bg2);border-radius:3px;overflow:hidden}
.prog-bar-fill{height:100%;border-radius:3px;transition:.5s}
.prog-bar-fill.good{background:var(--green)}.prog-bar-fill.bad{background:var(--red)}
.prog-pct{font-family:'IBM Plex Mono';font-size:11px;font-weight:600;min-width:32px;text-align:right}
.prog-cnt{font-size:10px;color:var(--text3);min-width:60px;text-align:right}
.adm-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:20px}
.adm-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.adm-table{width:100%;border-collapse:collapse;font-size:12px}
.adm-table th{text-align:left;padding:8px;background:var(--card);color:var(--text3);font-size:10px;text-transform:uppercase;letter-spacing:.5px;border-bottom:1px solid var(--brd)}
.adm-table td{padding:8px;border-bottom:1px solid rgba(255,255,255,.03)}
.adm-badge{font-size:10px;padding:2px 8px;border-radius:10px;font-weight:600}
.adm-badge.prem{background:rgba(139,92,246,.15);color:#a78bfa}
.adm-badge.admin{background:rgba(244,63,94,.15);color:#f43f5e}
.adm-badge.free{background:rgba(255,255,255,.05);color:var(--text3)}
.adm-actions{display:flex;gap:4px;flex-wrap:wrap}
.adm-btn{padding:3px 8px;border-radius:5px;border:1px solid var(--brd);background:var(--card);color:var(--text2);font-family:'DM Sans';font-size:10px;cursor:pointer;transition:.2s}
.adm-btn:hover{background:var(--card2)}.adm-btn.red{border-color:rgba(244,63,94,.2);color:var(--red)}
.limit-modal{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.7);z-index:1000;align-items:center;justify-content:center;padding:20px}
.limit-box{background:var(--card);border:1px solid var(--brd);border-radius:16px;padding:28px;max-width:400px;width:100%;text-align:center}
.limit-title{font-size:18px;font-weight:700;margin-bottom:10px}
.limit-desc{font-size:13px;color:var(--text2);line-height:1.7;margin-bottom:18px}
.limit-btns{display:flex;gap:8px;justify-content:center}
.sound-toggle{padding:4px 10px;border-radius:6px;border:1px solid var(--brd);background:var(--card);color:var(--text3);font-family:'DM Sans';font-size:10px;cursor:pointer}
@media(max-width:768px){
  header{flex-direction:column;gap:8px;padding:12px 16px}
  .logo-t{font-size:14px}
  .stats{gap:8px;font-size:11px}
  .xp-wrap{display:none}
  .user-menu{position:relative;position:absolute;top:12px;right:16px}
  .user-name{display:none}
  .main{padding:0 12px 20px}
  .tab-bar{gap:2px}.main-tab{font-size:11px;padding:8px 6px}
  .sc-text{font-size:13px}
  .journal table{font-size:11px}
  .journal th,.journal td{padding:6px 4px}
  .sel-input{font-size:12px;padding:6px 8px}
  .amt{font-size:12px;padding:6px;width:70px}
  .hp-grid{grid-template-columns:1fr}
  .mode-grid{grid-template-columns:repeat(2,1fr)}
  .prog-summary{grid-template-columns:repeat(2,1fr)}
  .prog-row{flex-wrap:wrap}
  .prog-info{min-width:100%;margin-bottom:4px}
  .adm-stats{grid-template-columns:1fr}
  .stat-cards{grid-template-columns:repeat(2,1fr)}
  .rev-opts{grid-template-columns:1fr}
  .map-grid{grid-template-columns:1fr}
  .err-stats{grid-template-columns:repeat(2,1fr)}
  .dash-top{flex-direction:column;gap:10px}
  .sort-btn{padding:12px 24px;font-size:14px}
}
@media(max-width:380px){
  .mode-grid{grid-template-columns:1fr}
  .stat-cards{grid-template-columns:1fr}
  .diff-bar{flex-direction:column}
  .limit-btns{flex-direction:column}
}
.hp-group-info{background:linear-gradient(135deg,rgba(99,102,241,.08),rgba(139,92,246,.08));border:1px solid rgba(99,102,241,.15);border-radius:12px;padding:16px;margin-bottom:16px}
.hp-gi-title{font-size:16px;font-weight:700;color:var(--blue);margin-bottom:4px}
.hp-gi-desc{font-size:13px;color:var(--text2);line-height:1.7}
.hp-card-main{cursor:pointer}
.hp-expand{font-size:11px;color:var(--blue);font-weight:600;margin-left:auto}
.hp-card.expanded{border-color:var(--blue);box-shadow:0 4px 20px rgba(99,102,241,.15)}
.hp-detail{padding:14px 0 0;border-top:1px solid var(--brd);margin-top:12px}
.hp-tur-box{font-size:12px;line-height:1.8;color:var(--text2);padding:10px 12px;background:var(--bg2);border-radius:8px;margin-bottom:12px}
.hp-ba-visual{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px}
.hp-ba-side{padding:12px;border-radius:8px;text-align:center}
.hp-ba-side.borc-side{background:rgba(99,102,241,.06);border:1px solid rgba(99,102,241,.15)}
.hp-ba-side.alacak-side{background:rgba(234,179,8,.06);border:1px solid rgba(234,179,8,.15)}
.hp-ba-title{font-size:13px;font-weight:700;margin-bottom:4px}
.borc-side .hp-ba-title{color:var(--blue)}
.alacak-side .hp-ba-title{color:var(--amber)}
.hp-ba-rule{font-size:11px;color:var(--text2)}
.hp-detail-desc{font-size:13px;color:var(--text2);line-height:1.8;margin-bottom:8px}
.hp-detail-ornek{font-size:12px;color:var(--text3);line-height:1.7;padding:8px 10px;background:rgba(99,102,241,.04);border-radius:6px;margin-bottom:8px;border-left:2px solid var(--blue)}
.hp-detail-group{font-size:11px;color:var(--text3)}
.adm-login-modal{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.8);z-index:1000;align-items:center;justify-content:center;padding:20px}
.adm-login-box{background:var(--card);border:1px solid var(--brd);border-radius:16px;padding:28px;max-width:360px;width:100%}
.adm-login-box h2{font-size:18px;font-weight:700;margin-bottom:16px;text-align:center}
.adm-quick{background:var(--card);border:1px solid var(--brd);border-radius:var(--r);padding:16px;margin-bottom:16px}
.adm-quick h3{font-size:13px;font-weight:600;margin-bottom:10px}
.adm-btn.green{border-color:rgba(34,197,94,.2);color:var(--green)}
@media(max-width:768px){
  .hp-ba-visual{grid-template-columns:1fr}
}
.mode-card.new{border-color:rgba(34,211,238,.2);background:linear-gradient(135deg,var(--card),rgba(34,211,238,.05))}
.mode-card.story{border-color:rgba(139,92,246,.2);background:linear-gradient(135deg,var(--card),rgba(139,92,246,.05))}
.mode-card.ai{border-color:rgba(34,197,94,.15);background:linear-gradient(135deg,var(--card),rgba(34,197,94,.03))}
.quest-card{background:var(--card);border:1px solid var(--brd);border-radius:var(--r);padding:16px;margin-bottom:18px}
.quest-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.quest-title{font-size:14px;font-weight:600}
.streak-fire{display:flex;align-items:center;gap:4px;padding:4px 10px;border-radius:12px;font-size:12px;font-weight:600;background:rgba(234,179,8,.08);color:var(--amber)}
.streak-fire.fire-mid{background:rgba(234,179,8,.15);animation:glow 2s infinite}
.streak-fire.fire-max{background:linear-gradient(135deg,rgba(244,63,94,.15),rgba(234,179,8,.15));color:#f43f5e;animation:glow 1s infinite}
@keyframes glow{0%,100%{box-shadow:0 0 4px rgba(234,179,8,.2)}50%{box-shadow:0 0 12px rgba(234,179,8,.4)}}
.fire-icon{font-size:16px}
.quest-row{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.03)}
.quest-row:last-child{border:none}.quest-row.done{opacity:.6}
.quest-check{width:20px;height:20px;border-radius:50%;border:2px solid var(--brd);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:var(--green);flex-shrink:0}
.quest-row.done .quest-check{background:var(--green);color:var(--bg);border-color:var(--green)}
.quest-info{flex:1;min-width:0}.quest-text{font-size:12px;margin-bottom:4px}
.quest-bar{height:4px;background:var(--bg2);border-radius:2px;overflow:hidden}
.quest-fill{height:100%;background:var(--green);border-radius:2px;transition:.5s}
.quest-pct{font-family:'IBM Plex Mono';font-size:11px;color:var(--text3);min-width:35px;text-align:right}
.quest-bonus{text-align:center;padding:10px;margin-top:8px;background:linear-gradient(135deg,rgba(34,197,94,.08),rgba(99,102,241,.08));border-radius:8px;font-size:12px;font-weight:600;color:var(--green)}
.badge-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(90px,1fr));gap:8px;margin-bottom:20px}
.badge-item{background:var(--card);border:1px solid var(--brd);border-radius:10px;padding:10px;text-align:center;opacity:.35;transition:.3s}
.badge-item.earned{opacity:1;border-color:var(--amber);box-shadow:0 2px 10px rgba(234,179,8,.1)}
.badge-icon{font-size:20px;font-weight:700;color:var(--amber);margin-bottom:4px;font-family:'IBM Plex Mono'}
.badge-name{font-size:10px;font-weight:600;margin-bottom:2px}.badge-desc{font-size:9px;color:var(--text3)}
.tf-timer{font-family:'IBM Plex Mono';font-size:48px;font-weight:700;text-align:center;color:var(--green);margin:10px 0;transition:.3s}
.tf-timer.urgent{color:var(--red);animation:pulse 0.5s infinite}
.tf-card{background:var(--card);border:1px solid var(--brd);border-radius:var(--r);padding:20px;margin-bottom:16px;text-align:center}
.tf-islem{font-size:13px;color:var(--text3);margin-bottom:8px}.tf-kayit{font-family:'IBM Plex Mono';font-size:13px;line-height:1.8}
.tf-btns{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}
.tf-btn{padding:16px;border-radius:10px;font-family:'DM Sans';font-size:16px;font-weight:700;cursor:pointer;border:2px solid;transition:.3s}
.tf-btn.dogru{background:rgba(34,197,94,.06);border-color:rgba(34,197,94,.3);color:var(--green)}
.tf-btn.yanlis{background:rgba(244,63,94,.06);border-color:rgba(244,63,94,.3);color:var(--red)}
.tf-btn:hover:not(.locked){transform:scale(1.02)}.tf-btn.locked{opacity:.5;cursor:default}
.missing-row{color:var(--amber);font-weight:600;background:rgba(234,179,8,.04)}
.missing-input{display:flex;gap:8px;align-items:end;flex-wrap:wrap;margin-top:14px}
.missing-input .field{min-width:120px;flex:1}
.missing-input .amt{width:100%}
.story-header{background:linear-gradient(135deg,rgba(139,92,246,.08),rgba(99,102,241,.08));border:1px solid rgba(139,92,246,.15);border-radius:12px;padding:14px;margin-bottom:14px;text-align:center}
.story-chapter{font-size:16px;font-weight:700;color:var(--purple)}.story-desc{font-size:12px;color:var(--text2);margin-top:4px}
.company-header{background:linear-gradient(135deg,rgba(34,211,238,.08),rgba(99,102,241,.08));border:1px solid rgba(34,211,238,.15);border-radius:12px;padding:14px;margin-bottom:14px;display:flex;justify-content:space-between;align-items:center}
.company-name{font-size:16px;font-weight:700;color:var(--blue)}.company-month{font-size:13px;color:var(--text2)}
.chat-container{display:flex;flex-direction:column;height:calc(100vh - 180px);max-height:600px}
.chat-messages{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:10px}
.chat-msg{display:flex}.ai-msg{justify-content:flex-start}.user-msg{justify-content:flex-end}
.chat-bubble{max-width:85%;padding:12px 16px;border-radius:14px;font-size:13px;line-height:1.8}
.ai-msg .chat-bubble{background:var(--card);border:1px solid var(--brd);border-bottom-left-radius:4px}
.user-msg .chat-bubble{background:var(--blue2);border:1px solid rgba(99,102,241,.2);border-bottom-right-radius:4px;color:var(--text)}
.chat-input-bar{display:flex;gap:8px;padding:12px;background:var(--card);border-top:1px solid var(--brd);border-radius:0 0 12px 12px}
.chat-input{flex:1;padding:10px 14px;background:var(--bg2);border:1px solid var(--brd);border-radius:9px;color:var(--text);font-family:'DM Sans';font-size:13px}
.chat-input:focus{outline:none;border-color:var(--blue)}
.prem-modal{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.8);z-index:1000;align-items:center;justify-content:center;padding:20px}
.prem-box{background:var(--card);border:1px solid var(--brd);border-radius:16px;padding:28px;max-width:440px;width:100%;position:relative;max-height:90vh;overflow-y:auto}
.prem-close{position:absolute;top:12px;right:12px;background:none;border:none;color:var(--text3);font-size:18px;cursor:pointer;padding:4px 8px}
.prem-header{text-align:center;margin-bottom:18px}
.prem-header h2{font-size:20px;font-weight:700;background:linear-gradient(135deg,var(--blue),var(--purple));-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.prem-header p{font-size:13px;color:var(--text2);margin-top:6px}
.prem-features{display:flex;flex-direction:column;gap:6px;margin-bottom:18px}
.prem-feat{font-size:12px;color:var(--text2);padding:6px 10px;background:rgba(99,102,241,.04);border-radius:6px;border-left:2px solid var(--blue)}
.prem-plans{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:14px}
.prem-plan{background:var(--bg2);border:2px solid var(--brd);border-radius:10px;padding:14px 10px;text-align:center;cursor:pointer;transition:.3s;position:relative}
.prem-plan:hover{border-color:var(--blue);transform:translateY(-2px)}
.prem-plan.popular{border-color:var(--purple);background:rgba(139,92,246,.06)}
.prem-popular{position:absolute;top:-10px;left:50%;transform:translateX(-50%);background:var(--purple);color:white;font-size:9px;font-weight:700;padding:2px 8px;border-radius:8px;white-space:nowrap}
.prem-plan-name{font-size:12px;font-weight:600;margin-bottom:6px}
.prem-plan-price{font-size:16px;font-weight:700;color:var(--blue)}
.prem-plan-save{font-size:10px;color:var(--green);margin-top:4px;font-weight:600}
.prem-note{font-size:11px;color:var(--text3);text-align:center;line-height:1.6}
.prem-active{text-align:center;padding:20px 0}
.prem-active-icon{font-size:40px;color:var(--purple);margin-bottom:10px}
.prem-active h3{font-size:18px;font-weight:700;color:var(--purple)}
.prem-active p{font-size:13px;color:var(--text2);margin-top:6px}
.story-progress{height:4px;background:var(--bg2);border-radius:2px;margin-top:10px;overflow:hidden}
.story-progress-fill{height:100%;background:linear-gradient(90deg,var(--blue),var(--purple));border-radius:2px;transition:.5s}
@media(max-width:768px){.prem-plans{grid-template-columns:1fr}}
.pm-header{padding:20px;background:var(--card);border-radius:16px;margin-bottom:20px;border:1px solid var(--border);display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.pm-title{font-size:18px;font-weight:700;flex:1}
.pm-overall{display:flex;align-items:center;gap:12px}
.pm-overall-ring{position:relative;width:60px;height:60px}
.pm-overall-ring svg{width:60px;height:60px;transform:rotate(-90deg)}
.pm-ring-bg{fill:none;stroke:#1e2030;stroke-width:3}
.pm-ring-fill{fill:none;stroke:var(--indigo);stroke-width:3;stroke-linecap:round;transition:.5s}
.pm-ring-pct{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700}
.pm-overall-label{font-weight:600;font-size:14px}
.pm-overall-sub{font-size:12px;color:var(--text3);margin-top:2px}
.pm-groups{display:flex;flex-direction:column;gap:20px}
.pm-group{background:var(--card);border:1px solid var(--border);border-radius:14px;overflow:hidden}
.pm-group-title{padding:12px 16px;font-size:13px;font-weight:700;color:var(--text2);background:var(--bg2);border-bottom:1px solid var(--border)}
.pm-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px;padding:14px}
.pm-card{background:var(--bg2);border:1px solid var(--border);border-radius:12px;padding:14px;cursor:pointer;transition:.2s}
.pm-card:hover{border-color:rgba(99,102,241,.4);transform:translateY(-2px)}
.pm-card-icon{font-size:24px;margin-bottom:8px}
.pm-card-name{font-size:12px;font-weight:600;margin-bottom:8px;line-height:1.3}
.pm-card-bar{height:4px;background:#1e2030;border-radius:2px;margin-bottom:6px;overflow:hidden}
.pm-card-fill{height:100%;border-radius:2px;transition:.5s}
.pm-card-stats{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}
.pm-card-pct{font-size:13px;font-weight:700}
.pm-card-lvl{font-size:10px;color:var(--text3)}
.pm-card-count{font-size:10px;color:var(--text3)}
.pm-card-not-started{opacity:.6}
.pm-suggestion{background:linear-gradient(135deg,rgba(99,102,241,.15),rgba(139,92,246,.1));border:1px solid rgba(99,102,241,.3);border-radius:14px;padding:16px;margin-top:16px;display:flex;align-items:center;gap:12px;cursor:pointer;transition:.2s}
.pm-suggestion:hover{border-color:var(--indigo)}
.pm-sug-icon{font-size:24px;flex-shrink:0}
.pm-sug-text{flex:1;font-size:13px;color:var(--text2)}
.pm-sug-btn{font-size:13px;font-weight:600;color:var(--indigo);flex-shrink:0}
.pm-modal{position:fixed;inset:0;background:rgba(0,0,0,.7);z-index:1000;display:none;align-items:flex-end;justify-content:center}
@media(min-width:600px){.pm-modal{align-items:center}}
.pm-modal-box{background:var(--bg2);border:1px solid var(--border);border-radius:16px 16px 0 0;width:100%;max-width:560px;max-height:80vh;overflow:hidden;display:flex;flex-direction:column}
@media(min-width:600px){.pm-modal-box{border-radius:16px}}
.pm-modal-hdr{padding:16px 20px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--border);font-weight:700}
.pm-modal-hdr button{background:none;border:none;color:var(--text3);font-size:18px;cursor:pointer;padding:4px 8px}
.pm-modal-sub{padding:10px 20px 0;font-size:12px;color:var(--text3)}
.pm-dd-list{overflow-y:auto;flex:1;padding:8px 0}
.pm-dd-row{display:grid;grid-template-columns:48px 1fr 80px 44px 60px;align-items:center;gap:8px;padding:10px 20px;cursor:pointer;transition:.15s}
.pm-dd-row:hover{background:var(--bg3)}
.pm-dd-code{font-size:12px;font-weight:700;color:var(--indigo)}
.pm-dd-name{font-size:12px;color:var(--text2)}
.pm-dd-bar{height:3px;background:#1e2030;border-radius:2px;overflow:hidden}
.pm-dd-fill{height:100%;border-radius:2px}
.pm-dd-stat{font-size:12px;font-weight:600;text-align:right}
.pm-dd-cnt{font-size:10px;color:var(--text3);text-align:right}
.pm-modal-start{margin:12px 20px 16px;padding:12px;background:var(--indigo);border:none;border-radius:10px;color:#fff;font-size:14px;font-weight:700;cursor:pointer;transition:.2s}
.pm-modal-start:hover{background:var(--indigo2)}
.sm-screen{max-width:720px;margin:0 auto;padding:16px}
.sm-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.sm-title{font-size:17px;font-weight:800;color:var(--text)}
.sm-subtitle{text-align:center;color:var(--text3);font-size:13px;margin-bottom:24px}
.sm-topics-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px}
.sm-topic-card{background:var(--card2);border:1px solid var(--brd);border-radius:14px;padding:16px;cursor:pointer;transition:.2s;position:relative}
.sm-topic-card:hover{background:var(--card3);border-color:rgba(99,102,241,.4);transform:translateY(-2px)}
.sm-topic-card:active{transform:translateY(0)}
.sm-tc-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.sm-tc-icon{font-size:24px}
.sm-tc-pct{font-size:11px;font-weight:700;background:rgba(99,102,241,.15);color:#818cf8;padding:2px 8px;border-radius:20px}
.sm-tc-pct.all{background:rgba(245,158,11,.15);color:#fbbf24}
.sm-tc-label{font-size:13px;font-weight:700;color:var(--text);margin-bottom:4px}
.sm-tc-desc{font-size:11px;color:var(--text3);line-height:1.5}
.sm-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:300px;gap:16px}
.sm-loading-spinner{width:40px;height:40px;border:3px solid var(--brd2);border-top-color:#818cf8;border-radius:50%;animation:spin .8s linear infinite}
.sm-exam{max-width:680px;margin:0 auto}
.sm-exam-hdr{display:flex;align-items:center;gap:12px;margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid var(--brd)}
.sm-progress{flex:1}
.sm-q-count{font-size:12px;color:var(--text3);margin-bottom:4px}
.sm-prog-bar{height:4px;background:var(--brd2);border-radius:4px;overflow:hidden}
.sm-prog-fill{height:100%;background:linear-gradient(90deg,#6366f1,#818cf8);transition:.3s}
.sm-timer{font-size:16px;font-weight:700;color:#10b981;font-family:'IBM Plex Mono',monospace;min-width:52px;text-align:right}
.sm-topic-badge{display:inline-block;padding:4px 12px;background:rgba(99,102,241,.1);border:1px solid rgba(99,102,241,.2);border-radius:100px;font-size:11px;color:#818cf8;margin-bottom:14px}
.sm-question-card{background:var(--card2);border:1px solid var(--brd2);border-radius:14px;padding:20px;margin-bottom:14px}
.sm-q-num{font-size:11px;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px}
.sm-q-text{font-size:15px;color:var(--text);line-height:1.7;font-weight:500}
.sm-choices{display:flex;flex-direction:column;gap:8px;margin-bottom:14px}
.sm-choice{display:flex;align-items:flex-start;gap:12px;padding:13px 16px;background:var(--card);border:1px solid var(--brd);border-radius:12px;cursor:pointer;transition:.15s}
.sm-choice:hover:not(.sm-answered){background:rgba(99,102,241,.06);border-color:rgba(99,102,241,.3)}
.sm-choice-key{width:26px;height:26px;border-radius:50%;background:var(--card3);border:1px solid var(--brd2);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:var(--text2);flex-shrink:0}
.sm-choice-text{font-size:13px;color:var(--text);line-height:1.5;padding-top:3px}
.sm-correct{background:rgba(16,185,129,.1)!important;border-color:#10b981!important}
.sm-correct .sm-choice-key{background:#10b981;color:#fff;border-color:#10b981}
.sm-wrong{background:rgba(239,68,68,.08)!important;border-color:#ef4444!important}
.sm-wrong .sm-choice-key{background:#ef4444;color:#fff;border-color:#ef4444}
.sm-feedback{border-radius:12px;padding:14px 16px;margin-bottom:12px;font-size:13px;line-height:1.6}
.sm-fb-ok{background:rgba(16,185,129,.1);border:1px solid rgba(16,185,129,.25);color:var(--text)}
.sm-fb-no{background:rgba(239,68,68,.08);border:1px solid rgba(239,68,68,.2);color:var(--text)}
.sm-fb-exp{margin-top:6px;color:var(--text2);font-size:12px;line-height:1.6}
.sm-next-btn{width:100%;padding:14px;background:linear-gradient(135deg,#4f46e5,#818cf8);border:none;color:#fff;border-radius:12px;font-size:14px;font-weight:700;cursor:pointer;transition:.2s}
.sm-next-btn:hover{opacity:.9;transform:translateY(-1px)}
.sm-result{max-width:600px;margin:0 auto;padding:20px 16px;text-align:center}
.sm-result-icon{font-size:56px;margin-bottom:12px}
.sm-result-title{font-size:18px;font-weight:700;color:var(--text);margin-bottom:4px}
.sm-result-score{font-size:42px;font-weight:800;margin:8px 0 0}
.sm-result-pct{font-size:20px;font-weight:700;margin-bottom:8px}
.sm-result-grade{font-size:14px;color:var(--text2);margin-bottom:6px}
.sm-result-meta{font-size:12px;color:var(--text3);margin-bottom:16px}
.sm-result-bar{height:8px;background:var(--brd2);border-radius:8px;overflow:hidden;margin-bottom:20px}
.sm-result-fill{height:100%;transition:.8s;border-radius:8px}
.sm-wrong-list{text-align:left;margin-bottom:20px}
.sm-wrong-title{font-size:13px;font-weight:700;color:var(--text);margin-bottom:12px;padding-bottom:8px;border-bottom:1px solid var(--brd)}
.sm-wrong-item{background:var(--card2);border:1px solid var(--brd);border-radius:12px;padding:14px;margin-bottom:10px;border-left:3px solid #ef4444}
.sm-wi-q{font-size:13px;color:var(--text);line-height:1.5;margin-bottom:6px;display:block}
.sm-wi-ans{font-size:12px;margin-bottom:6px;display:block}
.sm-wi-exp{font-size:12px;color:var(--text2);line-height:1.6;background:rgba(16,185,129,.06);padding:8px 10px;border-radius:8px;display:block}
.sm-perfect{background:rgba(16,185,129,.1);border:1px solid rgba(16,185,129,.25);border-radius:12px;padding:16px;font-size:14px;color:#10b981;margin-bottom:20px}
.sm-result-btns{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.sm-section-title{font-size:12px;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:.5px;margin-bottom:10px}
.sm-hist-list{display:flex;flex-direction:column;gap:6px}
.sm-hist-item{display:flex;align-items:center;gap:10px;background:var(--card2);border:1px solid var(--brd);border-radius:10px;padding:10px 14px;font-size:12px}
.sm-hi-icon{font-size:18px;flex-shrink:0}
.sm-hi-topic{flex:1;color:var(--text);font-weight:600}
.sm-hi-score{font-weight:700;font-size:13px}
.sm-hi-date{color:var(--text3)}
.sm-error{text-align:center;padding:32px 16px;color:var(--text2)}
.det-senaryo{background:var(--card2);border:1px solid var(--brd2);border-radius:12px;padding:16px;margin-bottom:16px}
.det-badge{display:inline-block;background:rgba(99,102,241,.15);color:#818cf8;border:1px solid rgba(99,102,241,.3);border-radius:6px;padding:4px 10px;font-size:11px;font-weight:700;margin-bottom:8px}
.det-text{color:var(--text);font-size:15px;line-height:1.5}
.det-table{background:var(--card2);border:1px solid var(--brd2);border-radius:12px;overflow:hidden;margin-bottom:12px}
.det-hdr{display:grid;grid-template-columns:1fr 90px 90px 40px;padding:10px 14px;background:var(--card3);font-size:12px;font-weight:600;color:var(--text3)}
.det-row{display:grid;grid-template-columns:1fr 90px 90px 40px;padding:14px;border-top:1px solid var(--brd);cursor:pointer;transition:.2s;align-items:center}
.det-row:hover:not(.locked){background:rgba(99,102,241,.08);transform:scale(1.005)}
.det-row.locked{cursor:default}
.det-hesap{font-size:13px;color:var(--text)}
.det-code{font-family:'IBM Plex Mono',monospace;font-size:12px;background:var(--card3);padding:2px 6px;border-radius:4px;margin-right:6px}
.det-amt{font-family:'IBM Plex Mono',monospace;font-size:13px;text-align:right}
.det-amt.borc{color:#10b981}
.det-amt.alacak{color:#818cf8}
.det-sel{text-align:center;font-size:18px;color:var(--text3)}
.det-wrong-found{background:rgba(239,68,68,.12)!important;border-left:3px solid #ef4444}
.det-wrong-found .det-sel::after{content:'❌'}
.det-wrong-pick{background:rgba(251,191,36,.08)!important}
.det-hint{text-align:center;font-size:13px;color:var(--text3);margin:8px 0 12px;animation:pulse 2s infinite}
@keyframes pulse{0%,100%{opacity:.7}50%{opacity:1}}
.det-fb{margin-top:12px;border-radius:12px;overflow:hidden}
.det-fb.ok{background:rgba(16,185,129,.1);border:1px solid rgba(16,185,129,.3);padding:16px;display:flex;gap:12px;align-items:flex-start}
.det-fb.no{background:rgba(239,68,68,.1);border:1px solid rgba(239,68,68,.3);padding:16px;display:flex;gap:12px;align-items:flex-start}
.det-fb-icon{font-size:28px;flex-shrink:0}
.det-fb-text{font-size:13px;color:var(--text);line-height:1.6}
.weak-header{background:linear-gradient(135deg,rgba(239,68,68,.1),rgba(251,191,36,.1));border:1px solid rgba(239,68,68,.2);border-radius:12px;padding:16px;margin-bottom:16px}
.weak-title{font-size:15px;font-weight:700;color:var(--text);margin-bottom:4px}
.weak-stat{font-size:12px;color:#ef4444}
.diff-select{text-align:center;padding:20px}
.diff-choice{display:flex;align-items:center;gap:16px;width:100%;padding:18px 20px;border:none;border-radius:14px;cursor:pointer;color:#fff;transition:.2s;text-align:left}
.diff-choice:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,.4)}
.diff-choice:active{transform:translateY(0)}
.diff-opt{background:var(--card2);border:1px solid var(--brd2);border-radius:12px;padding:18px 20px;cursor:pointer;display:flex;align-items:center;justify-content:space-between;transition:.2s;user-select:none}
.diff-opt:hover{background:var(--card3);transform:translateX(4px)}
.diff-opt:active{transform:translateX(2px);opacity:.9}
.diff-opt-left{display:flex;align-items:center;gap:14px}
.diff-opt-score{font-size:14px;font-weight:700;color:#fbbf24;min-width:48px;text-align:right}
@media(max-width:600px){
  .journal table, .journal thead { display:none }
  .journal tbody { display:flex; flex-direction:column; gap:8px }
  .journal tbody tr.entry-row {
    display:grid;
    grid-template-columns:1fr auto;
    grid-template-rows:auto auto;
    background:var(--card2);
    border:1px solid var(--brd2);
    border-radius:10px;
    padding:10px;
    gap:6px;
  }
  .journal tbody tr.entry-row td:nth-child(1) {
    grid-column:1/3;
    grid-row:1;
  }
  .journal tbody tr.entry-row td:nth-child(2) {
    grid-column:1;
    grid-row:2;
    position:relative;
  }
  .journal tbody tr.entry-row td:nth-child(2)::before {
    content:'Borç';
    display:block;
    font-size:9px;
    font-weight:700;
    color:#10b981;
    text-transform:uppercase;
    letter-spacing:.5px;
    margin-bottom:2px;
  }
  .journal tbody tr.entry-row td:nth-child(3) {
    grid-column:2;
    grid-row:2;
    position:relative;
  }
  .journal tbody tr.entry-row td:nth-child(3)::before {
    content:'Alacak';
    display:block;
    font-size:9px;
    font-weight:700;
    color:#f59e0b;
    text-transform:uppercase;
    letter-spacing:.5px;
    margin-bottom:2px;
  }
  .journal tbody tr.entry-row td:nth-child(4) {
    grid-column:2;
    grid-row:1;
    display:flex;
    align-items:flex-start;
    justify-content:flex-end;
  }
  .amt { width:100%; min-width:80px; font-size:14px; padding:10px 8px }
  .sel-input { font-size:14px; padding:10px 10px }
  .add-btn { width:100%; justify-content:center; padding:12px; font-size:13px; margin-top:4px }
  .totals { gap:16px; font-size:14px }
  .tot-val { font-size:20px }
  .actions { padding:0 }
  .actions .btn { padding:15px; font-size:15px; border-radius:12px }
  .mode-grid { grid-template-columns:1fr !important }
  .mode-card { padding:18px 16px; flex-direction:row; align-items:center; gap:14px }
  .mode-icon { font-size:28px; flex-shrink:0 }
  .mode-name { font-size:14px }
  .mode-desc { font-size:12px }
  .mode-tag { align-self:flex-start; margin-top:4px }
  .main { padding:0 10px 80px }
  header { padding:10px 12px }
  .logo-t { font-size:13px }
  .tab-bar { position:fixed; bottom:0; left:0; right:0; background:var(--card); border-top:1px solid var(--brd); padding:6px 4px; z-index:100; display:flex; justify-content:space-around; gap:2px }
  .main-tab { flex:1; padding:8px 4px; font-size:10px; border-radius:8px; text-align:center; min-height:44px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px }
  .speed-timer { font-size:52px }
  .sc-card { padding:16px 14px }
  .sc-text { font-size:14px; line-height:1.7 }
  .sc-title { font-size:11px }
  .fb-box { font-size:13px; padding:14px }
  .sm-topics-grid { grid-template-columns:1fr !important }
  .sm-topic-card { padding:14px }
  .det-table { font-size:12px }
  .det-hesap { font-size:12px; max-width:140px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
  .det-amt { font-size:12px }
  .result-card { padding:20px 14px; margin:10px 0 }
  .bal-card { padding:14px }
  .bal-sides { flex-direction:column }
  .diff-opt { padding:14px 16px }
  .fb-correct, .fb-wrong { font-size:13px; padding:12px 14px }
}
@media(max-width:480px){
  .game-hdr { padding:10px 12px }
  .game-hdr .btn2 { font-size:12px; padding:6px 12px }
  .game-hdr span { font-size:13px }
  .sm-q-text { font-size:14px }
  .sm-choice-text { font-size:12px }
  .det-table th, .det-table td { padding:8px 6px }
  .diff-select h2 { font-size:18px }
  .diff-opt { gap:10px }
}
@media(hover:none) and (pointer:coarse){
  button, .btn, .btn2, .sm-choice, .mode-card, .diff-opt { min-height:44px }
  .dd-item { padding:10px 12px; font-size:13px }
  .rm-btn { width:36px; height:36px; display:flex; align-items:center; justify-content:center }
  .mode-card:hover { transform:none }
  .sm-topic-card:hover { transform:none }
}
#notifBanner { animation: slideUp .3s ease; }
@keyframes slideUp { from { transform: translateX(-50%) translateY(20px); opacity:0; } to { transform: translateX(-50%) translateY(0); opacity:1; } }
.streak-reminder { animation: fadeIn .3s ease; }
.flash-card { background: var(--card); border-radius: 14px; padding: 24px; max-width: 600px; margin: 20px auto; }
#lessonContent { max-width: 640px; margin: 0 auto; }
.flash-q { font-size: 16px; font-weight: 600; color: var(--text1); margin-bottom: 16px; line-height: 1.6; }
.flash-a { font-size: 13px; color: var(--text2); line-height: 1.8; margin-bottom: 16px; font-family: inherit; white-space: normal; word-break: break-word; }
.flash-btns { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
.flash-btns .btn { flex: 1; min-width: 100px; }
.speed-ok { color: #10b981; font-weight: 700; padding: 6px 0; font-size: 14px; }
.speed-no { color: #ef4444; font-weight: 700; padding: 6px 0; font-size: 14px; }