/* Bu dosyanın kendi :root bloğu KALDIRILDI (Faz 5 / adım 2.2). Tanımladığı 9 token (--bg --surface --card --muted --text --brand --brand-2 --radius --shadow) artık assets/css/tokens.css'ten geliyor; değerleri BİREBİR aynıydı, bu yüzden hesaplanan değer değişmedi. Sayfa aldığı için anlamsal token'lar koyu değerlerine çözülür. tokens.css layout tarafından bu dosyadan ÖNCE yüklenir. TOKEN'LAMA KURALI (adım 2.1'den devralındı): sadece tokens.css'te BİREBİR AYNI değeri olan ham değerler var()'a çevrildi. Eşleşmeyenler (6/10/14/20px boşluklar, .78/.95/1.05rem, #d6e6ff/#e2f2ff/#dff7ff, rgba(102,227,208,*) vurguları, rgba(255,255,255,.05/.15), rgba(0,0,0,.55)) BİLEREK HAM bırakıldı — çevirmek piksel/renk kaydırırdı. Kısayol (shorthand) bildirimler ancak TÜM uzunluk bileşenleri eşleşiyorsa çevrildi; aksi halde bildirimin tamamı ham kaldı. ⚠️ Gövde fontu Georgia (--font-serif) ama sayfa Inter YÜKLÜYOR — mevcut tutarsızlık aynen korundu (bkz. tokens.css §6 notu). */ *{box-sizing:border-box} html,body{height:100%} body{margin:0; font-family:var(--font-serif); background:linear-gradient(180deg,var(--bg),var(--bg-2)); color:var(--text); line-height:var(--lh-body)} a{color:var(--link-color); text-decoration:none} a:hover{text-decoration:underline} .container{width:min(1100px,94%); margin:24px auto 64px;} .header{display:flex; align-items:center; gap:14px; padding:14px 18px; background:rgba(255,255,255,.03); border:1px solid var(--border-soft); border-radius:var(--r-xl); backdrop-filter:blur(8px); box-shadow:var(--shadow-lg)} .header img{height:28px} .header h1{margin:0; font-size:var(--fs-lg); letter-spacing:.3px; color:var(--text-soft); font-weight:600} .card{background:var(--card); border:1px solid var(--border-soft); border-radius:var(--r-xl); box-shadow:var(--shadow-lg); padding:18px} .muted{color:var(--text-muted)} .post{display:grid; gap:var(--sp-3)} .post-head{display:flex; gap:var(--sp-3); align-items:center; flex-wrap:wrap} .avatar{width:44px;height:44px;border-radius:var(--r-circle);overflow:hidden;background:var(--dk-avatar);display:grid;place-items:center;font-weight:800;font-size:18px;color:#dff7ff;border:2px solid var(--border-strong)} .avatar img{width:100%;height:100%;object-fit:cover} .userline{display:flex;flex-direction:column} .userline .name{font-weight:600; color:#e2f2ff} .userline .date{font-size:var(--fs-sm); color:var(--text-muted)} .post img.media{width:100%; border-radius:var(--r-lg); display:block; border:1px solid var(--border)} .link-preview{background:var(--dk-inset-2); border:1px solid var(--border); border-radius:var(--r-lg); padding:10px} @media(max-width:540px){ .link-preview{ grid-template-columns:1fr } } .link-preview img{width:100%; border-radius:10px} .quote-row{display:flex; gap:10px; flex-wrap:wrap} .quote-symbol{display:inline-block;padding:6px 10px;border-radius:var(--r-pill);background:rgba(102,227,208,.12);border:1px solid rgba(102,227,208,.35); font-size:var(--fs-md)} .actions{display:flex; gap:10px; flex-wrap:wrap} .actions button{border:1px solid var(--border-strong); background:var(--dk-fill); color:var(--text-soft);padding:var(--sp-2) var(--sp-3);border-radius:10px;cursor:pointer} .actions button.btn-success{background:rgba(102,227,208,.18); border-color:var(--brand); color:var(--brand)} .btn-primary{display:inline-flex;align-items:center;gap:var(--sp-2);padding:10px 14px;border-radius:var(--r-lg);background:linear-gradient(90deg,var(--brand),var(--accent-sky));color:var(--on-brand);font-weight:700;border:none;cursor:pointer; letter-spacing:.2px} .btn-link{background:transparent;border:none;color:var(--link-color);cursor:pointer;padding:0} .comments{display:grid; gap:var(--sp-3)} .comment{display:grid; gap:6px; padding:var(--sp-3); border:1px solid var(--border); border-radius:var(--r-lg); background:var(--inset)} .comment-head{display:flex; align-items:center; gap:10px} .comment .name{font-weight:600} .comment .date{font-size:var(--fs-sm); color:var(--text-muted)} .comment .actions button.liked{background:rgba(102,227,208,.18); border-color:var(--brand); color:var(--brand)} .comment .actions button.reported{opacity:.6; cursor:default} .report-modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.55);display:none;align-items:center;justify-content:center;z-index:var(--z-modal);padding:var(--sp-4)} .report-modal{background:var(--card);border:1px solid var(--border);border-radius:var(--r-xl);box-shadow:var(--shadow-lg);padding:20px;width:100%;max-width:380px;display:grid;gap:10px} .report-modal h3{margin:0;color:#d6e6ff;font-size:1.05rem} .report-modal label{font-size:var(--fs-sm);color:var(--text-muted)} .report-modal select,.report-modal textarea{width:100%;box-sizing:border-box;padding:8px 10px;border-radius:var(--r-md);border:1px solid rgba(255,255,255,.15);background:var(--inset);color:var(--text);font-family:inherit;font-size:.95rem} .report-modal select{appearance:auto} .report-modal textarea{resize:vertical} .report-modal-note-count{font-size:.78rem;color:var(--text-muted);text-align:right;margin-top:calc(-1 * var(--sp-1))} .report-modal-buttons{display:flex;justify-content:flex-end;gap:var(--sp-2);margin-top:var(--sp-1)} .report-modal-buttons button{border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.05);color:var(--text-soft);padding:8px 14px;border-radius:var(--r-md);cursor:pointer;font-size:var(--fs-md)} #reportSubmit{background:linear-gradient(90deg,var(--brand),var(--accent-sky));color:var(--on-brand);font-weight:700;border:none} .hr{height:1px; background:var(--border); border:none; margin:var(--sp-3) 0} .backrow{display:flex; align-items:center; justify-content:space-between; gap:var(--sp-3); flex-wrap:wrap} .home-page{cursor:pointer;position:fixed;bottom:20px;right:30px;width:30px;height:30px;z-index:var(--z-fab)} .home-page img{display:block;width:30px;height:30px} @media(max-width:768px){.home-page{display:flex;align-items:center;justify-content:center;width:44px;height:44px;right:15px;bottom:15px}.home-page img{width:30px;height:30px}}