
:root {
  --font-sans: "Segoe UI Variable", "Inter", ui-sans-serif, system-ui, sans-serif;
  --background: #050508;
  --foreground: #f7f7fb;
  --card: rgba(13, 13, 19, 0.72);
  --card-foreground: #f7f7fb;
  --popover: #111118;
  --popover-foreground: #f7f7fb;
  --primary: #b66cff;
  --primary-foreground: #08050c;
  --secondary: #15151d;
  --secondary-foreground: #f7f7fb;
  --muted: #16161f;
  --muted-foreground: #9998a6;
  --accent: #242030;
  --accent-foreground: #ffffff;
  --destructive: #ff475d;
  --border: rgba(255,255,255,.1);
  --input: rgba(255,255,255,.12);
  --ring: #b66cff;
  --radius: 1rem;
}

* { box-sizing: border-box; }
html { min-width: 320px; background: #050508; }
body { margin: 0; background: var(--background); color: var(--foreground); font-family: var(--font-sans); }
button, input, textarea { font: inherit; }

.profile-shell {
  position: relative;
  min-height: 100svh;
  display: grid;
  place-items: center;
  overflow: hidden;
  padding: 54px 20px 72px;
  isolation: isolate;
}
.profile-background { position: fixed; inset: -4%; z-index: -4; background: url('/default-background.png') center/cover no-repeat; animation: background-breathe 16s ease-in-out infinite alternate; }
.profile-vignette { position: fixed; inset: 0; z-index: -3; background: radial-gradient(circle at 50% 44%, rgba(10,10,18,.12) 0 26%, rgba(3,3,7,.72) 78%, #020204 110%), linear-gradient(180deg, rgba(2,2,6,.12), rgba(2,2,6,.6)); }
.profile-noise { position: fixed; inset: 0; z-index: -2; opacity: .045; pointer-events: none; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.92' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.9'/%3E%3C/svg%3E"); }

.profile-card {
  position: relative;
  width: min(100%, 470px);
  padding: 32px;
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 30px;
  background: linear-gradient(145deg, rgba(18,18,27,.82), rgba(8,8,13,.68));
  box-shadow: 0 32px 100px rgba(0,0,0,.65), inset 0 1px rgba(255,255,255,.08), 0 0 0 1px rgba(108,46,162,.06);
  backdrop-filter: blur(24px) saturate(135%);
  animation: card-enter .85s cubic-bezier(.2,.8,.2,1) both;
}
.profile-glow { position: absolute; inset: -1px; z-index: -1; border-radius: inherit; overflow: hidden; opacity: .65; background: radial-gradient(circle at 16% 0, rgba(91,179,255,.16), transparent 28%), radial-gradient(circle at 86% 4%, rgba(223,74,255,.17), transparent 27%); }
.avatar-wrap { position: relative; width: 98px; margin: -4px auto 18px; }
.avatar-ring { width: 98px; height: 98px; padding: 3px; border-radius: 28px; background: linear-gradient(135deg,#68c8ff,#b86bff 52%,#ff4fa7); box-shadow: 0 0 34px rgba(170,88,255,.28); transform: rotate(3deg); }
.avatar-fallback { width: 100%; height: 100%; display: grid; place-items: center; border-radius: 25px; background: linear-gradient(145deg,#15131f,#08080d); color: white; font-size: 2.8rem; font-weight: 750; transform: rotate(-3deg); text-shadow: 0 0 22px rgba(190,115,255,.75); }
.presence-dot { position: absolute; right: -2px; bottom: -1px; width: 18px; height: 18px; border: 4px solid #0d0d14; border-radius: 50%; background: #55e58e; box-shadow: 0 0 15px rgba(85,229,142,.7); }
.profile-copy { text-align: center; }
.name-row { display: flex; justify-content: center; align-items: center; gap: 7px; }
.name-row h1 { margin: 0; font-size: clamp(1.75rem,6vw,2.05rem); line-height: 1.1; letter-spacing: -.055em; }
.name-row svg { color: #a968ff; filter: drop-shadow(0 0 7px rgba(169,104,255,.52)); }
.profile-copy p { max-width: 340px; margin: 10px auto 24px; color: #aaa8b6; font-size: .94rem; line-height: 1.58; }
.link-stack { display: grid; gap: 10px; }
.social-link { --link-tone: #fff; display: grid; grid-template-columns: 46px 1fr auto; align-items: center; gap: 12px; min-height: 64px; padding: 8px 15px 8px 9px; border: 1px solid rgba(255,255,255,.075); border-radius: 18px; color: #fff; text-decoration: none; background: rgba(255,255,255,.043); box-shadow: inset 0 1px rgba(255,255,255,.04); transition: transform .24s ease, border-color .24s ease, background .24s ease, box-shadow .24s ease; animation: link-enter .6s cubic-bezier(.2,.8,.2,1) both; animation-delay: calc(280ms + var(--delay)); }
.social-link:hover { transform: translateY(-2px) scale(1.012); border-color: color-mix(in srgb,var(--link-tone) 44%,transparent); background: color-mix(in srgb,var(--link-tone) 8%,rgba(255,255,255,.05)); box-shadow: 0 10px 26px rgba(0,0,0,.25), 0 0 20px color-mix(in srgb,var(--link-tone) 10%,transparent); }
.social-link:focus-visible,.sound-control:focus-visible { outline: 2px solid #b66cff; outline-offset: 3px; }
.link-icon { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 14px; color: var(--link-tone); background: color-mix(in srgb,var(--link-tone) 13%,#0c0c12); box-shadow: inset 0 0 0 1px color-mix(in srgb,var(--link-tone) 18%,transparent); }
.link-label { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.link-label strong { font-size: .94rem; font-weight: 650; letter-spacing: -.015em; }
.link-label small { color: #858491; font-size: .76rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.link-arrow { color: #5e5c69; font-size: 1.1rem; transition: color .2s ease, transform .2s ease; }
.social-link:hover .link-arrow { color: var(--link-tone); transform: translate(2px,-2px); }
.profile-footer { display: flex; justify-content: space-between; margin-top: 21px; color: #686673; font-size: .7rem; letter-spacing: .03em; }
.profile-footer span:first-child { display: flex; align-items: center; gap: 6px; }
.profile-footer i { width: 5px; height: 5px; border-radius: 50%; background: #a968ff; box-shadow: 0 0 8px #a968ff; }
.profile-footer button { border:0; padding:0 5px; color:#898494; background:transparent; cursor:pointer; font:inherit; }
.profile-footer button:hover { color:var(--profile-accent); }
.sound-control { position: fixed; right: 22px; bottom: 22px; z-index: 5; display: flex; align-items: center; gap: 8px; min-height: 43px; padding: 0 14px; border: 1px solid rgba(255,255,255,.12); border-radius: 999px; color: #dad9e1; background: rgba(8,8,13,.72); box-shadow: 0 12px 34px rgba(0,0,0,.34), inset 0 1px rgba(255,255,255,.06); backdrop-filter: blur(16px); cursor: pointer; transition: transform .2s ease, background .2s ease; }
.sound-control:hover { transform: translateY(-2px); background: rgba(18,17,25,.86); }
.sound-control > span:last-child { font-size: .76rem; }
.sound-bars { display: flex; align-items: center; gap: 2px; height: 12px; }
.sound-bars i { display: block; width: 2px; border-radius: 2px; background: #af6dff; animation: equalize .8s ease-in-out infinite alternate; }
.sound-bars i:nth-child(1) { height: 6px; }.sound-bars i:nth-child(2) { height: 12px; animation-delay: -.25s; }.sound-bars i:nth-child(3) { height: 8px; animation-delay: -.45s; }
.sound-bars.muted i { animation: none; height: 3px; background: #696772; }
@keyframes card-enter { from { opacity: 0; transform: translateY(18px) scale(.975); } to { opacity: 1; transform: none; } }
@keyframes link-enter { from { opacity: 0; transform: translateY(9px); } to { opacity: 1; transform: none; } }
@keyframes background-breathe { from { transform: scale(1.02); filter: saturate(.85); } to { transform: scale(1.065); filter: saturate(1.08); } }
@keyframes equalize { to { height: 3px; } }
@media (max-width: 560px) { .profile-shell { place-items: center; padding: 34px 14px 78px; } .profile-card { padding: 25px 17px 22px; border-radius: 25px; } .avatar-wrap,.avatar-ring { width: 86px; } .avatar-ring { height: 86px; border-radius: 25px; } .avatar-fallback { border-radius: 22px; font-size: 2.35rem; } .social-link { min-height: 60px; border-radius: 16px; } .sound-control { right: 14px; bottom: 14px; } }
@media (prefers-reduced-motion: reduce) { *,*::before,*::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; } }

.media-background { width: 108%; height: 108%; object-fit: cover; }
.profile-avatar { width: 100%; height: 100%; display: block; border-radius: 25px; object-fit: cover; transform: rotate(-3deg); background: #0d0d14; }
.brand-glyph { font-size: .87rem; font-weight: 800; letter-spacing: -.05em; }
.brand-glyph svg,.platform-button svg,.active-link-icon svg { display: block; filter: drop-shadow(0 0 9px color-mix(in srgb,currentColor 55%,transparent)); }
.sound-control:disabled { opacity: .58; cursor: default; transform: none; }

.admin-loading,.admin-login-shell,.admin-shell { min-height: 100svh; background: #070709; color: #f5f5f7; }
.admin-loading { display: grid; place-items: center; }
.admin-spinner { display: inline-block; width: 28px; height: 28px; border: 2px solid rgba(255,255,255,.12); border-top-color: #b66cff; border-radius: 50%; animation: spin .75s linear infinite; }
.admin-spinner.small { width: 14px; height: 14px; }
@keyframes spin { to { transform: rotate(360deg); } }

.admin-login-shell { position: relative; display: grid; place-items: center; overflow: hidden; padding: 24px; isolation: isolate; }
.admin-login-shell::before { content: ""; position: fixed; inset: 0; z-index: -3; background: radial-gradient(circle at 50% 20%,#181020 0,transparent 35%),#060608; }
.login-orb { position: fixed; z-index: -2; width: 340px; height: 340px; border-radius: 50%; filter: blur(110px); opacity: .17; }
.login-orb-one { left: 10%; top: 8%; background: #379cff; }.login-orb-two { right: 8%; bottom: 6%; background: #dd48ff; }
.login-card { width: min(100%,410px); padding: 38px; border: 1px solid rgba(255,255,255,.1); border-radius: 28px; background: rgba(14,14,19,.78); box-shadow: 0 40px 110px rgba(0,0,0,.62),inset 0 1px rgba(255,255,255,.06); backdrop-filter: blur(28px); animation: card-enter .55s ease both; }
.login-mark { width: 54px; height: 54px; display: grid; place-items: center; margin-bottom: 24px; border: 1px solid rgba(182,108,255,.35); border-radius: 16px; color: #c17dff; background: rgba(182,108,255,.1); box-shadow: 0 0 30px rgba(182,108,255,.12); }
.eyebrow { margin: 0 0 8px; color: #a965ef !important; font-size: .72rem !important; font-weight: 760; letter-spacing: .14em; text-transform: uppercase; }
.login-card h1 { margin: 0; font-size: 2rem; letter-spacing: -.045em; }.login-intro { margin: 10px 0 27px; color: #8f8e9a; font-size: .94rem; line-height: 1.55; }
.login-card label,.field-grid label,.dialog-fields label { display: grid; gap: 8px; color: #b9b8c2; font-size: .8rem; font-weight: 650; }
.login-card input,.field-grid input,.field-grid textarea,.dialog-fields input { width: 100%; border: 1px solid rgba(255,255,255,.095); border-radius: 13px; outline: none; color: #f8f7fb; background: rgba(255,255,255,.045); transition: border-color .2s,box-shadow .2s; }
.login-card input { height: 52px; padding: 0 15px; font-size: 1rem; }
.login-card input:focus,.field-grid input:focus,.field-grid textarea:focus,.dialog-fields input:focus { border-color: rgba(182,108,255,.7); box-shadow: 0 0 0 3px rgba(182,108,255,.12); }
.login-card > button { width: 100%; height: 50px; display: flex; justify-content: center; align-items: center; gap: 12px; margin-top: 16px; border: 0; border-radius: 13px; color: #100a16; background: linear-gradient(135deg,#d0a1ff,#a860ec); font-weight: 780; cursor: pointer; box-shadow: 0 14px 36px rgba(166,82,235,.22); transition: transform .2s,filter .2s; }
.login-card > button:hover { transform: translateY(-2px); filter: brightness(1.06); }.login-card > button span { font-size: 1.15rem; }
.login-card small { display: block; margin-top: 18px; color: #62616b; font-size: .7rem; text-align: center; }.login-error { margin: 11px 0 0; color: #ff687b; font-size: .78rem; }

.admin-shell { background: radial-gradient(circle at 7% 2%,rgba(91,54,128,.12),transparent 26%),#070709; }
.admin-topbar { position: sticky; top: 0; z-index: 30; height: 74px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 20px; padding: 0 max(24px,calc((100vw - 1360px)/2)); border-bottom: 1px solid rgba(255,255,255,.075); background: rgba(7,7,9,.78); backdrop-filter: blur(22px); }
.admin-brand { display: flex; align-items: center; gap: 11px; }.admin-brand > span { width: 36px; height: 36px; display: grid; place-items: center; border: 1px solid rgba(182,108,255,.38); border-radius: 11px; color: #d0a1ff; background: rgba(182,108,255,.11); font-size: 1rem; font-weight: 850; }
.admin-brand div { display: grid; gap: 1px; }.admin-brand strong { font-size: .88rem; letter-spacing: -.01em; }.admin-brand small { color: #6e6d77; font-size: .68rem; }
.save-state { display: flex; align-items: center; gap: 7px; color: #817f8b; font-size: .73rem; }.save-state svg { color: #59d98c; }
.ghost-button { justify-self: end; display: flex; align-items: center; gap: 7px; min-height: 38px; padding: 0 13px; border: 1px solid rgba(255,255,255,.09); border-radius: 10px; color: #aaa9b2; background: rgba(255,255,255,.035); cursor: pointer; }
.admin-container { width: min(100% - 38px,1360px); margin: 0 auto; padding: 44px 0 88px; }
.admin-hero { display: flex; justify-content: space-between; align-items: end; gap: 30px; margin-bottom: 28px; padding: 12px 4px; }.admin-hero h1 { max-width: 720px; margin: 0; font-size: clamp(2rem,5vw,3.65rem); line-height: 1; letter-spacing: -.06em; }.admin-hero p:not(.eyebrow) { margin: 13px 0 0; color: #85838f; font-size: .95rem; }.admin-hero > a { flex: 0 0 auto; display: flex; align-items: center; gap: 9px; padding: 11px 15px; border: 1px solid rgba(255,255,255,.1); border-radius: 12px; color: #d8d7df; text-decoration: none; background: rgba(255,255,255,.035); font-size: .8rem; }
.admin-panel { margin-top: 16px; padding: 26px; border: 1px solid rgba(255,255,255,.075); border-radius: 24px; background: rgba(16,16,20,.76); box-shadow: inset 0 1px rgba(255,255,255,.025); }
.section-heading { display: flex; align-items: center; gap: 13px; margin-bottom: 23px; }.section-icon { width: 39px; height: 39px; display: grid; place-items: center; border: 1px solid rgba(182,108,255,.2); border-radius: 12px; color: #b873f7; background: rgba(182,108,255,.075); }.section-heading h2,.active-heading h2 { margin: 0; font-size: 1.12rem; letter-spacing: -.025em; }.section-heading p,.active-heading p { margin: 4px 0 0; color: #777681; font-size: .78rem; }
.field-grid { display: grid; grid-template-columns: minmax(220px,.72fr) 1.5fr; gap: 14px; }.field-grid input { height: 46px; padding: 0 14px; }.field-grid textarea { min-height: 92px; resize: vertical; padding: 12px 42px 12px 14px; line-height: 1.5; }.bio-field { position: relative; }.bio-field > span { position: absolute; right: 11px; bottom: 10px; color: #5f5e69; font-size: .66rem; }
.media-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; }.media-card { min-width: 0; }.media-card-head { display: flex; justify-content: space-between; align-items: start; min-height: 43px; margin-bottom: 10px; }.media-card-head > div { display: grid; gap: 3px; }.media-card-head strong { font-size: .88rem; }.media-card-head small { color: #696872; font-size: .67rem; }.media-card-head button { width: 30px; height: 30px; display: grid; place-items: center; border: 0; border-radius: 9px; color: #ff6475; background: rgba(255,74,93,.08); cursor: pointer; }
.media-preview { position: relative; min-height: 178px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; overflow: hidden; border: 1px dashed rgba(255,255,255,.12); border-radius: 17px; color: #696773; background: rgba(4,4,7,.48); }.media-preview > svg { color: #aaa8b4; }.media-preview > span { font-size: .75rem; }.media-preview img,.media-preview video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }.media-preview audio { width: calc(100% - 24px); position: relative; z-index: 2; }.media-preview.has-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg,transparent 54%,rgba(0,0,0,.66)); pointer-events: none; }
.media-upload { position: absolute; left: 10px; right: 10px; bottom: 10px; z-index: 3; display: flex; justify-content: center; }.media-upload input { position: absolute; opacity: 0; pointer-events: none; }.media-upload span { min-height: 35px; display: flex; align-items: center; justify-content: center; gap: 7px; padding: 0 12px; border: 1px solid rgba(255,255,255,.11); border-radius: 10px; color: #d8d7df; background: rgba(10,10,14,.72); backdrop-filter: blur(12px); font-size: .73rem; cursor: pointer; }
.platform-grid { display: grid; grid-template-columns: repeat(10,minmax(54px,1fr)); gap: 10px; }.platform-button { min-width: 0; min-height: 62px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.065); border-radius: 16px; color: white; background: rgba(255,255,255,.025); cursor: pointer; transition: transform .18s,border-color .18s,background .18s; }.platform-button:hover { transform: translateY(-2px); border-color: rgba(182,108,255,.32); background: rgba(182,108,255,.055); }.platform-button > span { font-size: 1rem; font-weight: 850; letter-spacing: -.07em; text-shadow: 0 0 18px currentColor; }.custom-platform { grid-column: span 3; grid-template-columns: 48px 1fr; justify-items: start; padding: 0 17px; text-align: left; }.custom-platform > div { display: grid; gap: 4px; }.custom-platform strong { color: #e9e8ee; font-size: .78rem; }.custom-platform small { color: #6d6c76; font-size: .66rem; }
.active-links-section { margin-top: 34px; }.active-heading { display: flex; justify-content: space-between; align-items: end; gap: 16px; margin: 0 4px 16px; }.primary-button { display: flex; align-items: center; gap: 7px; min-height: 39px; padding: 0 14px; border: 1px solid rgba(182,108,255,.35); border-radius: 11px; color: #e4c7ff; background: rgba(182,108,255,.1); cursor: pointer; }.active-links-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }.active-link-card { position: relative; display: grid; grid-template-columns: 38px minmax(0,1fr) auto; align-items: center; gap: 12px; padding: 16px; border: 1px solid rgba(255,255,255,.075); border-radius: 18px; background: rgba(16,16,20,.76); transition: opacity .2s,border-color .2s; }.active-link-card.is-hidden { opacity: .54; }.sort-buttons { display: grid; gap: 3px; }.sort-buttons button,.link-actions button { display: grid; place-items: center; border: 0; border-radius: 8px; color: #73727c; background: rgba(255,255,255,.045); cursor: pointer; }.sort-buttons button { width: 28px; height: 22px; }.sort-buttons button:disabled { opacity: .2; cursor: default; }.active-link-content { min-width: 0; display: flex; align-items: center; gap: 11px; }.active-link-icon { flex: 0 0 42px; width: 42px; height: 42px; display: grid; place-items: center; border-radius: 12px; background: rgba(255,255,255,.045); font-size: .77rem; font-weight: 850; }.active-link-content div { min-width: 0; display: grid; gap: 5px; }.active-link-content strong { font-size: .84rem; }.active-link-content small { overflow: hidden; color: #73717d; font-size: .68rem; text-overflow: ellipsis; white-space: nowrap; }.link-actions { display: flex; gap: 5px; }.link-actions button { width: 30px; height: 30px; }.link-actions button:hover { color: #d9d7e0; background: rgba(255,255,255,.075); }.link-actions .danger-action { color: #d85769; }.visibility-row { grid-column: 2 / 4; display: flex; justify-content: space-between; align-items: center; padding-top: 9px; border-top: 1px solid rgba(255,255,255,.05); color: #666570; font-size: .66rem; }.empty-links { min-height: 180px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; border: 1px dashed rgba(255,255,255,.1); border-radius: 18px; color: #6d6c76; }.empty-links strong { color: #aaa9b3; font-size: .88rem; }.empty-links span { font-size: .73rem; }
.dashboard-skeleton { display: grid; gap: 15px; }.dashboard-skeleton span { height: 180px; border-radius: 24px; background: linear-gradient(100deg,#101014 20%,#17171c 40%,#101014 60%); background-size: 220% 100%; animation: shimmer 1.3s infinite; }.dashboard-skeleton span:nth-child(2) { height: 260px; }.dashboard-skeleton span:nth-child(3) { height: 220px; }@keyframes shimmer { to { background-position: -220% 0; } }
.link-dialog { border-color: rgba(255,255,255,.1) !important; border-radius: 21px !important; color: #f5f4f8; background: #111116 !important; box-shadow: 0 30px 100px rgba(0,0,0,.72) !important; }.link-dialog form { display: grid; gap: 22px; }.link-dialog [data-slot="dialog-description"] { color: #767580; line-height: 1.5; }.dialog-fields { display: grid; gap: 13px; }.dialog-fields input { height: 44px; padding: 0 12px; }.dialog-primary,.dialog-secondary { min-height: 40px; display: flex; align-items: center; justify-content: center; gap: 7px; padding: 0 14px; border-radius: 10px; cursor: pointer; }.dialog-primary { border: 0; color: #120a18; background: #bd7bf6; font-weight: 750; }.dialog-secondary { border: 1px solid rgba(255,255,255,.09); color: #aaa8b3; background: rgba(255,255,255,.035); }

@media (max-width: 1060px) { .platform-grid { grid-template-columns: repeat(7,minmax(54px,1fr)); }.custom-platform { grid-column: span 3; }.media-grid { grid-template-columns: 1fr 1fr; }.media-card:last-child { grid-column: 1 / -1; }.active-links-grid { grid-template-columns: 1fr; } }
@media (max-width: 720px) { .admin-topbar { grid-template-columns: 1fr auto; padding: 0 16px; }.save-state { position: fixed; left: 50%; bottom: 14px; z-index: 40; transform: translateX(-50%); padding: 9px 13px; border: 1px solid rgba(255,255,255,.09); border-radius: 999px; background: rgba(10,10,13,.86); backdrop-filter: blur(15px); white-space: nowrap; }.admin-brand small,.ghost-button { font-size: 0; }.ghost-button { width: 38px; padding: 0; justify-content: center; }.admin-container { width: min(100% - 24px,1360px); padding-top: 28px; }.admin-hero { align-items: start; flex-direction: column; }.admin-hero h1 { font-size: 2.25rem; }.admin-panel { padding: 18px; border-radius: 19px; }.field-grid,.media-grid { grid-template-columns: 1fr; }.media-card:last-child { grid-column: auto; }.media-preview { min-height: 160px; }.platform-grid { grid-template-columns: repeat(5,minmax(48px,1fr)); gap: 8px; }.custom-platform { grid-column: span 5; }.active-heading { align-items: start; }.active-link-card { grid-template-columns: 34px minmax(0,1fr); }.link-actions { grid-column: 1 / -1; justify-content: flex-end; }.visibility-row { grid-column: 1 / -1; }.login-card { padding: 29px 23px; } }


/* cPanel PHP arayüzü */
[hidden] { display: none !important; }
.link-icon img,.platform-button img,.active-link-icon img { display: block; object-fit: contain; filter: drop-shadow(0 0 9px color-mix(in srgb,currentColor 55%,transparent)); }
.sound-symbol { width: 18px; color: #b66cff; font-size: 1.15rem; text-align: center; }
.media-content { display: contents; }
.media-card-head button { font-size: 1.25rem; line-height: 1; }
.platform-button { font-family: var(--font-sans); }
.platform-button > span { display: grid; place-items: center; }
.visibility-toggle { position: relative; width: 36px; height: 20px; padding: 0; border: 0; border-radius: 999px; background: #282730; cursor: pointer; transition: background .2s; }
.visibility-toggle::after { content: ""; position: absolute; left: 3px; top: 3px; width: 14px; height: 14px; border-radius: 50%; background: #777681; transition: transform .2s,background .2s; }
.visibility-toggle.is-on { background: rgba(182,108,255,.35); }
.visibility-toggle.is-on::after { transform: translateX(16px); background: #c88dff; }
.link-modal { width: min(calc(100% - 28px),500px); padding: 0; border: 1px solid rgba(255,255,255,.1); border-radius: 21px; color: #f5f4f8; background: #111116; box-shadow: 0 30px 100px rgba(0,0,0,.72); }
.link-modal::backdrop { background: rgba(0,0,0,.72); backdrop-filter: blur(5px); }
.link-modal form { display: grid; gap: 22px; padding: 25px; }
.modal-heading { display: flex; justify-content: space-between; gap: 20px; }
.modal-heading h2 { margin: 0; font-size: 1.18rem; }
.modal-heading p { margin: 6px 0 0; color: #767580; font-size: .78rem; line-height: 1.5; }
.modal-close { flex: 0 0 32px; width: 32px; height: 32px; border: 0; border-radius: 9px; color: #aaa8b3; background: rgba(255,255,255,.05); font-size: 1.2rem; cursor: pointer; }
.modal-actions { display: flex; justify-content: flex-end; gap: 8px; }
.toast { position: fixed; right: 18px; bottom: 18px; z-index: 100; max-width: min(360px,calc(100% - 36px)); padding: 12px 16px; border: 1px solid rgba(89,217,140,.25); border-radius: 12px; color: #c8f4d9; background: rgba(13,26,19,.94); box-shadow: 0 16px 45px rgba(0,0,0,.45); font-size: .8rem; }
.toast.is-error { border-color: rgba(255,100,117,.3); color: #ffc2ca; background: rgba(34,13,17,.95); }
@media (max-width:560px) { .modal-actions { display: grid; grid-template-columns: 1fr 1fr; } }

/* v3: canlı durum, paylaşım, tema ve giriş hareketi */
:root { --profile-accent: #b66cff; --profile-glow: #ff4fa7; --profile-card-alpha: .82; }
.profile-card { background: linear-gradient(145deg,rgba(18,18,27,var(--profile-card-alpha)),rgba(8,8,13,var(--profile-card-alpha))); border-color: color-mix(in srgb,var(--profile-accent) 18%,rgba(255,255,255,.11)); box-shadow: 0 32px 100px rgba(0,0,0,.65),inset 0 1px rgba(255,255,255,.08),0 0 42px color-mix(in srgb,var(--profile-glow) 8%,transparent); }
.profile-glow { background: radial-gradient(circle at 16% 0,color-mix(in srgb,var(--profile-accent) 22%,transparent),transparent 29%),radial-gradient(circle at 86% 4%,color-mix(in srgb,var(--profile-glow) 24%,transparent),transparent 28%); }
.avatar-ring { background: linear-gradient(135deg,#68c8ff,var(--profile-accent) 52%,var(--profile-glow)); box-shadow: 0 0 34px color-mix(in srgb,var(--profile-accent) 32%,transparent); }
.avatar-fallback { text-shadow: 0 0 22px color-mix(in srgb,var(--profile-accent) 72%,transparent); }
.name-row svg,.sound-symbol { color: var(--profile-accent); filter: drop-shadow(0 0 7px color-mix(in srgb,var(--profile-accent) 52%,transparent)); }
.profile-footer i,.sound-bars i { background: var(--profile-accent); box-shadow: 0 0 8px var(--profile-accent); }
.social-link:focus-visible,.sound-control:focus-visible,.profile-actions button:focus-visible,.qr-dialog button:focus-visible { outline: 2px solid var(--profile-accent); outline-offset: 3px; }
.presence-dot[data-status="idle"],#discord-status-dot[data-status="idle"] { background:#f0b94b; box-shadow:0 0 13px rgba(240,185,75,.62); }
.presence-dot[data-status="dnd"],#discord-status-dot[data-status="dnd"] { background:#ef4d62; box-shadow:0 0 13px rgba(239,77,98,.62); }
.presence-dot[data-status="offline"],#discord-status-dot[data-status="offline"] { background:#777985; box-shadow:none; }

.intro-screen { position:fixed; inset:0; z-index:999; display:grid; place-content:center; gap:18px; background:#050508; pointer-events:none; }
.intro-screen::before { content:""; position:absolute; inset:0; opacity:.8; background:radial-gradient(circle at 50% 50%,color-mix(in srgb,var(--profile-accent) 16%,transparent),transparent 30%); }
.intro-mark { position:relative; display:grid; place-items:center; width:78px; height:78px; margin:auto; border:1px solid color-mix(in srgb,var(--profile-accent) 45%,transparent); border-radius:25px; color:#fff; background:rgba(255,255,255,.035); box-shadow:0 0 46px color-mix(in srgb,var(--profile-accent) 23%,transparent),inset 0 1px rgba(255,255,255,.08); font-size:2.25rem; font-weight:800; opacity:0; transform:scale(.78) rotate(-8deg); }
.intro-line { position:relative; display:block; width:92px; height:2px; overflow:hidden; border-radius:99px; background:rgba(255,255,255,.09); }
.intro-line::after { content:""; display:block; width:100%; height:100%; background:linear-gradient(90deg,var(--profile-accent),var(--profile-glow)); transform:translateX(-102%); }
.intro-screen.is-playing .intro-mark { animation:intro-mark 1.15s cubic-bezier(.2,.8,.2,1) both; }
.intro-screen.is-playing .intro-line::after { animation:intro-line 1s .12s cubic-bezier(.2,.8,.2,1) both; }
.intro-screen.is-playing { animation:intro-exit .34s 1.1s ease both; }
.intro-screen ~ .profile-shell .profile-card { opacity:0; animation:none; }
@keyframes intro-mark { 0%{opacity:0;transform:scale(.78) rotate(-8deg)} 38%,75%{opacity:1;transform:scale(1) rotate(0)} 100%{opacity:0;transform:scale(1.08)} }
@keyframes intro-line { 0%{transform:translateX(-102%)} 60%{transform:translateX(0)} 100%{transform:translateX(102%)} }
@keyframes intro-exit { to{opacity:0;visibility:hidden} }

.live-status-stack { display:grid; gap:9px; margin:0 0 12px; }
.discord-status-card,.spotify-now-card { border:1px solid rgba(255,255,255,.075); border-radius:17px; background:rgba(255,255,255,.045); box-shadow:inset 0 1px rgba(255,255,255,.04); }
.discord-status-card { display:flex; align-items:center; gap:11px; min-height:56px; padding:8px 12px; color:#f6f5f8; text-decoration:none; transition:transform .2s,border-color .2s,background .2s; }
.discord-status-card[href]:hover { transform:translateY(-2px); border-color:rgba(113,135,255,.35); background:rgba(113,135,255,.09); }
.discord-status-card[href]:focus-visible { outline:2px solid var(--profile-accent); outline-offset:3px; }
.discord-external { margin-left:auto; color:#a9afff; font-size:1.1rem; }
.discord-status-card:not([href]) .discord-external { display:none; }
.discord-brand { display:grid; place-items:center; width:38px; height:38px; border-radius:12px; background:rgba(88,101,242,.13); box-shadow:inset 0 0 0 1px rgba(113,135,255,.18); }
.discord-status-card > div { display:grid; gap:4px; min-width:0; }
.discord-status-card strong { overflow:hidden; color:#f6f5f8; font-size:.85rem; text-overflow:ellipsis; white-space:nowrap; }
.discord-status-card div span { display:flex; align-items:center; gap:6px; color:#898895; font-size:.72rem; }
.discord-status-card .discord-activity { display:block; max-width:100%; overflow:hidden; color:#c8c5d1; font-size:.68rem; text-overflow:ellipsis; white-space:nowrap; }
#discord-status-dot { width:7px; height:7px; border-radius:50%; background:#55e58e; box-shadow:0 0 13px rgba(85,229,142,.7); }
.spotify-now-card { position:relative; display:grid; grid-template-columns:54px minmax(0,1fr) 22px; align-items:center; gap:11px; min-height:72px; padding:9px; color:#fff; text-decoration:none; transition:transform .22s,border-color .22s,background .22s; }
.spotify-now-card:hover { transform:translateY(-2px); border-color:rgba(49,223,119,.32); background:rgba(49,223,119,.065); }
.spotify-album { width:54px; height:54px; border-radius:12px; object-fit:cover; background:#0c0c10; }
.spotify-copy { display:grid; min-width:0; }
.spotify-kicker { display:flex; align-items:center; gap:5px; margin-bottom:2px; color:#31df77; font-size:.64rem; font-weight:700; text-transform:uppercase; letter-spacing:.055em; }
.spotify-copy strong,.spotify-copy small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.spotify-copy strong { font-size:.82rem; }
.spotify-copy small { margin-top:2px; color:#8d8c98; font-size:.69rem; }
.spotify-progress { height:3px; margin-top:8px; overflow:hidden; border-radius:99px; background:rgba(255,255,255,.1); }
.spotify-progress i { display:block; width:0; height:100%; border-radius:inherit; background:#31df77; transition:width 1s linear; }
.spotify-equalizer { display:flex; align-items:end; justify-content:center; gap:2px; height:18px; }
.spotify-equalizer i { width:2px; border-radius:2px; background:#31df77; animation:equalize .66s ease-in-out infinite alternate; }
.spotify-equalizer i:nth-child(1){height:8px}.spotify-equalizer i:nth-child(2){height:16px;animation-delay:-.23s}.spotify-equalizer i:nth-child(3){height:11px;animation-delay:-.41s}

.profile-actions { display:grid; grid-template-columns:1fr 1fr; gap:9px; margin-top:12px; }
.profile-actions button { display:flex; align-items:center; justify-content:center; gap:8px; min-height:42px; border:1px solid rgba(255,255,255,.08); border-radius:13px; color:#b9b8c3; background:rgba(255,255,255,.035); cursor:pointer; font-size:.75rem; font-weight:650; transition:transform .2s,border-color .2s,color .2s,background .2s; }
.profile-actions button:hover { transform:translateY(-1px); border-color:color-mix(in srgb,var(--profile-accent) 36%,transparent); color:#fff; background:color-mix(in srgb,var(--profile-accent) 8%,rgba(255,255,255,.04)); }
.profile-actions button svg { width:18px; height:18px; flex:none; color:var(--profile-accent); transition:transform .2s,color .2s; }
.profile-actions button:hover svg { transform:scale(1.09); color:var(--profile-glow); }
.qr-mini { width:13px; height:13px; background:linear-gradient(90deg,currentColor 33%,transparent 33% 66%,currentColor 66%),linear-gradient(currentColor 33%,transparent 33% 66%,currentColor 66%); opacity:.9; }
.qr-dialog { width:min(calc(100% - 30px),380px); padding:30px; border:1px solid color-mix(in srgb,var(--profile-accent) 25%,rgba(255,255,255,.1)); border-radius:25px; color:#f7f6fa; background:rgba(13,13,19,.96); box-shadow:0 28px 100px rgba(0,0,0,.75),0 0 50px color-mix(in srgb,var(--profile-accent) 12%,transparent); text-align:center; backdrop-filter:blur(22px); }
.qr-dialog::backdrop { background:rgba(0,0,0,.75); backdrop-filter:blur(6px); }
.qr-dialog h2 { margin:9px 0 5px; font-size:1.35rem; }
.qr-dialog p { margin:0 0 20px; color:#92919d; font-size:.82rem; line-height:1.5; }
.qr-badge { color:var(--profile-accent); font-size:.68rem; font-weight:750; text-transform:uppercase; letter-spacing:.1em; }
.qr-close { position:absolute; top:13px; right:13px; width:34px; height:34px; border:0; border-radius:10px; color:#a2a1aa; background:rgba(255,255,255,.05); cursor:pointer; font-size:1.25rem; }
.qr-canvas { width:228px; min-height:228px; display:grid; place-items:center; margin:auto; padding:10px; border-radius:17px; background:#fff; box-shadow:0 0 28px rgba(255,255,255,.12); }
.qr-canvas img,.qr-canvas canvas { display:block; max-width:100%; height:auto!important; }
.qr-copy { width:100%; min-height:44px; margin-top:18px; border:0; border-radius:13px; color:#08050c; background:linear-gradient(135deg,var(--profile-accent),var(--profile-glow)); cursor:pointer; font-weight:750; }

.appearance-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.appearance-grid > label { display:grid; gap:9px; color:#b9b8c2; font-size:.8rem; font-weight:650; }
.color-field > span { display:flex; align-items:center; gap:10px; min-height:48px; padding:7px 12px; border:1px solid rgba(255,255,255,.085); border-radius:13px; background:rgba(255,255,255,.035); }
.color-field input { width:33px; height:33px; padding:0; border:0; border-radius:9px; overflow:hidden; background:transparent; cursor:pointer; }
.color-field input::-webkit-color-swatch-wrapper { padding:0; }.color-field input::-webkit-color-swatch { border:0;border-radius:8px; }
.color-field output { color:#e4e3e9; font-size:.78rem; text-transform:uppercase; }
.range-field input { width:100%; accent-color:var(--profile-accent); }
.range-field output { justify-self:end; margin-top:-24px; color:var(--profile-accent); }
.discord-id-field { grid-column:1/-1; }
.discord-id-field input { width:100%; height:46px; padding:0 14px; border:1px solid rgba(255,255,255,.095); border-radius:13px; outline:none; color:#f8f7fb; background:rgba(255,255,255,.045); }
.discord-id-field input:focus { border-color:color-mix(in srgb,var(--profile-accent) 70%,transparent); box-shadow:0 0 0 3px color-mix(in srgb,var(--profile-accent) 12%,transparent); }
.discord-id-field small { color:#74737d; font-size:.7rem; font-weight:450; line-height:1.5; }.discord-id-field a { color:var(--profile-accent); }
.option-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-top:16px; }
.switch-option { position:relative; display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:86px; padding:15px; border:1px solid rgba(255,255,255,.07); border-radius:15px; background:rgba(255,255,255,.025); cursor:pointer; }
.switch-option > span { display:grid; gap:5px; }.switch-option strong { color:#e6e5ea; font-size:.78rem; }.switch-option small { color:#73727c; font-size:.68rem; line-height:1.45; }
.switch-option input { position:absolute; opacity:0; pointer-events:none; }
.switch-option > i { position:relative; flex:0 0 38px; width:38px; height:22px; border-radius:99px; background:#292832; transition:background .2s; }
.switch-option > i::after { content:""; position:absolute; left:3px; top:3px; width:16px; height:16px; border-radius:50%; background:#777681; transition:transform .2s,background .2s; }
.switch-option input:checked + i { background:color-mix(in srgb,var(--profile-accent) 38%,#1a1820); }.switch-option input:checked + i::after { transform:translateX(16px); background:var(--profile-accent); }
.switch-option:focus-within { outline:2px solid var(--profile-accent); outline-offset:2px; }

@media (max-width:850px) { .option-grid { grid-template-columns:1fr; }.switch-option { min-height:72px; } }
@media (max-width:560px) { .appearance-grid { grid-template-columns:1fr; }.discord-id-field { grid-column:auto; }.spotify-now-card { grid-template-columns:48px minmax(0,1fr) 20px; }.spotify-album { width:48px;height:48px;}.profile-actions { gap:7px; } }
@media (prefers-reduced-motion:reduce) { .intro-screen { display:none; }.intro-screen ~ .profile-shell .profile-card { opacity:1;animation:none; }.spotify-equalizer i { animation:none; } }

/* v4: yalnızca admin panelinde görünen istatistikler ve güvenlik */
.analytics-heading { display:grid; align-items:center; grid-template-columns:auto minmax(0,1fr) auto; }
.analytics-refresh { min-height:38px; padding:0 13px; border:1px solid rgba(255,255,255,.08); border-radius:11px; color:#aaa9b4; background:rgba(255,255,255,.035); cursor:pointer; font-size:.73rem; font-weight:650; transition:border-color .2s,color .2s,background .2s; }
.analytics-refresh:hover { border-color:color-mix(in srgb,var(--profile-accent) 38%,transparent); color:#fff; background:color-mix(in srgb,var(--profile-accent) 8%,rgba(255,255,255,.035)); }
.analytics-summary { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:11px; }
.analytics-summary article { position:relative; min-height:124px; display:flex; flex-direction:column; justify-content:center; padding:18px; overflow:hidden; border:1px solid rgba(255,255,255,.07); border-radius:17px; background:linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.018)); }
.analytics-summary article::after { content:""; position:absolute; right:-26px; bottom:-36px; width:92px; height:92px; border-radius:50%; background:var(--profile-accent); opacity:.09; filter:blur(12px); }
.analytics-summary span { color:#85848f; font-size:.7rem; font-weight:650; }
.analytics-summary strong { margin:8px 0 5px; color:#f7f6fa; font-size:clamp(1.55rem,3vw,2.1rem); line-height:1; letter-spacing:-.045em; }
.analytics-summary small { color:#676671; font-size:.65rem; }
.analytics-content { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(280px,.75fr); gap:12px; margin-top:12px; }
.chart-card,.top-links-card { min-width:0; padding:18px; border:1px solid rgba(255,255,255,.07); border-radius:17px; background:rgba(255,255,255,.025); }
.chart-head { display:flex; align-items:center; justify-content:space-between; gap:14px; }
.chart-head > div:first-child { display:grid; gap:4px; }.chart-head strong { color:#e9e8ed; font-size:.79rem; }.chart-head small { color:#666570; font-size:.65rem; }
.chart-tabs { display:flex; gap:3px; padding:3px; border-radius:10px; background:rgba(255,255,255,.035); }
.chart-tabs button { min-height:29px; padding:0 9px; border:0; border-radius:8px; color:#777681; background:transparent; cursor:pointer; font-size:.65rem; }
.chart-tabs button.is-active { color:#fff; background:color-mix(in srgb,var(--profile-accent) 18%,rgba(255,255,255,.04)); box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--profile-accent) 18%,transparent); }
.analytics-chart { height:220px; display:flex; align-items:stretch; gap:6px; margin-top:18px; padding-top:9px; border-bottom:1px solid rgba(255,255,255,.07); background:repeating-linear-gradient(to top,transparent 0 54px,rgba(255,255,255,.035) 54px 55px); }
.chart-column { flex:1; min-width:0; display:grid; grid-template-rows:1fr 25px; gap:7px; align-items:end; }
.chart-bars { height:100%; display:flex; align-items:end; justify-content:center; gap:2px; }
.chart-bars i { width:min(11px,42%); height:var(--bar); min-height:0; display:block; border-radius:5px 5px 1px 1px; transition:height .45s cubic-bezier(.2,.8,.2,1); }
.chart-bars .views { background:linear-gradient(to top,color-mix(in srgb,var(--profile-accent) 60%,#311d52),var(--profile-accent)); box-shadow:0 0 13px color-mix(in srgb,var(--profile-accent) 16%,transparent); }
.chart-bars .unique { background:linear-gradient(to top,#265f62,#58d6c8); }
.chart-column > span { overflow:hidden; color:#5e5d67; font-size:.55rem; text-align:center; text-overflow:clip; white-space:nowrap; transform:rotate(-30deg); transform-origin:center; }
.chart-legend { display:flex; gap:16px; margin-top:14px; color:#767580; font-size:.64rem; }.chart-legend span { display:flex; align-items:center; gap:6px; }.chart-legend i { width:7px;height:7px;border-radius:2px; }.chart-legend .views { background:var(--profile-accent); }.chart-legend .unique { background:#58d6c8; }
.top-links-list { display:grid; gap:7px; margin-top:18px; }
.top-link-row { display:grid; grid-template-columns:25px minmax(0,1fr) auto; align-items:center; gap:9px; min-height:37px; }
.top-link-rank { color:#585761; font-size:.61rem; font-variant-numeric:tabular-nums; }
.top-link-row > div { display:grid; gap:6px; min-width:0; }.top-link-row strong { overflow:hidden; color:#d8d7de; font-size:.71rem; text-overflow:ellipsis; white-space:nowrap; }.top-link-row i { display:block; height:3px; border-radius:99px; background:linear-gradient(90deg,var(--profile-accent),var(--profile-glow)); }
.top-link-row b { color:#aaa9b3; font-size:.68rem; font-variant-numeric:tabular-nums; }
.analytics-empty { min-height:120px; display:grid; place-items:center; color:#666570; font-size:.72rem; text-align:center; }

.security-grid { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(270px,.7fr); gap:12px; }
.password-form,.sessions-card { padding:18px; border:1px solid rgba(255,255,255,.07); border-radius:17px; background:rgba(255,255,255,.025); }
.password-form { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)) auto; align-items:end; gap:10px; }
.password-form > div { grid-column:1/-1; display:grid; gap:5px; margin-bottom:3px; }.password-form strong,.sessions-card strong { color:#e8e7ec; font-size:.82rem; }.password-form small,.sessions-card small { color:#72717c; font-size:.68rem; line-height:1.5; }
.password-form label { display:grid; gap:7px; color:#aaa9b3; font-size:.71rem; font-weight:650; }
.password-form input { width:100%; height:43px; padding:0 12px; border:1px solid rgba(255,255,255,.09); border-radius:11px; outline:none; color:#f7f6fa; background:rgba(255,255,255,.04); }
.password-form input:focus { border-color:color-mix(in srgb,var(--profile-accent) 68%,transparent); box-shadow:0 0 0 3px color-mix(in srgb,var(--profile-accent) 11%,transparent); }
.password-form button { min-height:43px; white-space:nowrap; }
.sessions-card { display:flex; flex-direction:column; justify-content:space-between; gap:22px; }.sessions-card > div { display:grid; gap:6px; }
.sessions-card button { min-height:43px; border:1px solid rgba(255,75,98,.2); border-radius:11px; color:#ff8b9a; background:rgba(255,56,82,.07); cursor:pointer; font-size:.72rem; font-weight:700; transition:border-color .2s,background .2s; }.sessions-card button:hover { border-color:rgba(255,75,98,.4); background:rgba(255,56,82,.12); }

@media (max-width:1050px) { .analytics-summary { grid-template-columns:1fr 1fr; }.analytics-content,.security-grid { grid-template-columns:1fr; }.password-form { grid-template-columns:repeat(3,minmax(0,1fr)); }.password-form button { grid-column:1/-1; } }
@media (max-width:650px) { .analytics-heading { grid-template-columns:auto minmax(0,1fr); }.analytics-refresh { grid-column:1/-1; width:100%; }.analytics-summary { grid-template-columns:1fr 1fr; }.analytics-summary article { min-height:108px;padding:14px; }.analytics-content { margin-top:10px; }.analytics-chart { height:180px;gap:3px; }.chart-column > span { font-size:.5rem; }.password-form { grid-template-columns:1fr; }.password-form > div,.password-form button { grid-column:auto; } }
@media (max-width:420px) { .analytics-summary { grid-template-columns:1fr; }.chart-card,.top-links-card { padding:14px; }.chart-tabs button { padding:0 7px; }.analytics-chart { height:165px; } }

/* V7: solda yönetim kategorileri ve yalnızca adminin gördüğü ziyaretçi kayıtları. */
.admin-workspace { width:min(calc(100% - 38px),1600px); display:grid; grid-template-columns:218px minmax(0,1fr); gap:22px; margin:0 auto; }
.admin-workspace .admin-container { width:100%; min-width:0; margin:0; }
.admin-sidebar { position:sticky; top:96px; align-self:start; margin-top:44px; padding:18px 10px 16px; border:1px solid rgba(255,255,255,.075); border-radius:21px; background:rgba(16,16,20,.79); box-shadow:inset 0 1px rgba(255,255,255,.03); backdrop-filter:blur(18px); max-height:calc(100dvh - 110px); overflow-y:auto; }
.sidebar-title { padding:0 12px 12px; color:#65646e; font-size:.65rem; font-weight:750; letter-spacing:.16em; }
.sidebar-nav { display:grid; gap:4px; }
.sidebar-nav a { display:flex; align-items:center; gap:12px; min-height:42px; padding:0 12px; border:1px solid transparent; border-radius:12px; color:#9b9aa5; text-decoration:none; font-size:.77rem; font-weight:650; white-space:nowrap; transition:color .18s,background .18s,border-color .18s; }
.sidebar-nav a span { width:19px; color:#77717f; font-size:1rem; text-align:center; }
.sidebar-nav a:hover,.sidebar-nav a.is-active { color:#f4e9ff; border-color:color-mix(in srgb,var(--profile-accent) 22%,transparent); background:color-mix(in srgb,var(--profile-accent) 11%,rgba(255,255,255,.02)); }
.sidebar-nav a.is-active span { color:var(--profile-accent); }
.sidebar-note { margin:16px 12px 0; padding-top:14px; border-top:1px solid rgba(255,255,255,.06); color:#65646e; font-size:.66rem; line-height:1.5; }
.admin-workspace [id$="-section"] { scroll-margin-top:94px; }
.visitor-toolbar { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:14px; }
.visitor-count { color:#9694a0; font-size:.76rem; }
.visitor-toolbar input { width:min(100%,320px); height:40px; padding:0 13px; border:1px solid rgba(255,255,255,.1); border-radius:11px; outline:none; color:#f4f3f8; background:rgba(255,255,255,.04); font:inherit; font-size:.74rem; }
.visitor-toolbar input:focus { border-color:var(--profile-accent); }
.visitor-list { display:grid; gap:10px; }
.visitor-card { padding:16px 18px; border:1px solid rgba(255,255,255,.07); border-radius:16px; background:rgba(255,255,255,.025); }
.visitor-card-head { display:flex; align-items:start; justify-content:space-between; gap:16px; }
.visitor-card-head strong { color:#f2edf8; font-size:.86rem; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.visitor-card-head time { color:#777581; font-size:.68rem; white-space:nowrap; }
.visitor-location { display:block; margin-top:4px; color:#bd98ed; font-size:.72rem; }
.visitor-meta { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px 20px; margin-top:14px; }
.visitor-meta > span { display:grid; gap:4px; min-width:0; color:#b4b1be; font-size:.72rem; overflow-wrap:anywhere; }
.visitor-meta small { color:#686672; font-size:.65rem; }
.visitor-clicks { display:flex; flex-wrap:wrap; align-items:center; gap:7px; margin-top:13px; padding-top:12px; border-top:1px solid rgba(255,255,255,.055); }
.visitor-clicks small { margin-right:3px; color:#686672; font-size:.67rem; }
.visitor-clicks b { padding:5px 8px; border:1px solid rgba(182,108,255,.17); border-radius:8px; color:#dbc0fb; background:rgba(182,108,255,.06); font-size:.66rem; font-weight:650; }
.visitor-clicks em { color:#65646e; font-size:.68rem; font-style:normal; }
.visitor-empty { margin:0; padding:33px 15px; border:1px dashed rgba(255,255,255,.08); border-radius:14px; color:#777580; font-size:.75rem; text-align:center; }
.visitor-privacy-note { margin:14px 2px 0; color:#73717c; font-size:.68rem; line-height:1.55; }
.privacy-choice { position:fixed; left:18px; bottom:18px; z-index:70; width:min(430px,calc(100vw - 36px)); padding:20px; border:1px solid color-mix(in srgb,var(--profile-accent) 26%,rgba(255,255,255,.12)); border-radius:19px; color:#f1eef6; background:rgba(16,15,22,.96); box-shadow:0 22px 68px rgba(0,0,0,.6),0 0 30px color-mix(in srgb,var(--profile-accent) 9%,transparent); backdrop-filter:blur(22px); }
.privacy-choice strong { font-size:.9rem; }
.privacy-choice p { margin:9px 0 17px; color:#aaa6b4; font-size:.75rem; line-height:1.55; }
.privacy-actions { display:grid; grid-template-columns:1fr 1fr; gap:9px; }
.privacy-actions button { min-height:39px; border:1px solid rgba(255,255,255,.13); border-radius:10px; color:#f0eaf7; background:rgba(255,255,255,.065); cursor:pointer; font-size:.75rem; font-weight:700; }
.privacy-actions button:hover { border-color:var(--profile-accent); }
.privacy-actions button:last-child { background:color-mix(in srgb,var(--profile-accent) 32%,#19131e); }
@media (max-width:1080px) {
  .admin-workspace { display:block; }
  .admin-sidebar { position:sticky; top:74px; z-index:25; margin-top:0; padding:7px; border-radius:0 0 15px 15px; overflow:auto hidden; }
  .sidebar-title,.sidebar-note { display:none; }
  .sidebar-nav { display:flex; width:max-content; gap:5px; }
  .sidebar-nav a { min-height:36px; padding:0 10px; font-size:.7rem; }
  .admin-workspace .admin-container { padding-top:22px; }
  .admin-workspace [id$="-section"] { scroll-margin-top:130px; }
}
@media (max-width:650px) {
  .visitor-toolbar { align-items:stretch; flex-direction:column; }
  .visitor-toolbar input { width:100%; }
  .visitor-meta { grid-template-columns:1fr; }
  .visitor-card-head { flex-direction:column; gap:6px; }
}

/* V8 — profile badges, private guestbook and settings backups. */
.profile-badges { display:flex; flex-wrap:wrap; justify-content:center; gap:6px; margin:-9px 0 23px; }
.profile-badge { display:inline-flex; align-items:center; gap:5px; padding:6px 9px; border:1px solid color-mix(in srgb,var(--badge-tone) 23%,transparent); border-radius:999px; color:var(--badge-tone); background:color-mix(in srgb,var(--badge-tone) 7%,transparent); font-size:.64rem; font-weight:650; line-height:1.2; white-space:nowrap; }
.profile-badge svg { width:15px; height:15px; }
.badge-verified { --badge-tone:var(--profile-accent); }
.badge-discord { --badge-tone:#a5adff; }
.badge-spotify { --badge-tone:#53df8b; }
.guestbook { margin-top:16px; }
.guestbook-toggle { display:grid; grid-template-columns:40px minmax(0,1fr) auto; width:100%; align-items:center; gap:12px; padding:12px; border:1px solid rgba(255,255,255,.085); border-radius:16px; color:#eee9f5; background:rgba(255,255,255,.035); text-align:left; cursor:pointer; transition:border-color .2s,background .2s; }
.guestbook-toggle:hover { border-color:color-mix(in srgb,var(--profile-accent) 36%,transparent); background:color-mix(in srgb,var(--profile-accent) 8%,rgba(255,255,255,.04)); }
.guestbook-toggle > span:nth-child(2) { display:grid; gap:4px; min-width:0; }.guestbook-toggle strong { font-size:.85rem; }.guestbook-toggle small { color:#908c9c; font-size:.68rem; }.guestbook-toggle-arrow { color:var(--profile-accent); font-size:1.2rem; transition:transform .2s; }.guestbook-toggle[aria-expanded="true"] .guestbook-toggle-arrow { transform:rotate(180deg); }
.guestbook-panel { margin-top:12px; padding:16px; border:1px solid rgba(255,255,255,.075); border-radius:16px; background:rgba(8,8,12,.2); }
.guestbook-icon { display:grid; flex:0 0 40px; place-items:center; width:40px; height:40px; border:1px solid color-mix(in srgb,var(--profile-accent) 22%,transparent); border-radius:13px; color:var(--profile-accent); background:color-mix(in srgb,var(--profile-accent) 8%,transparent); }
.guestbook-icon svg { width:21px; height:21px; }
.guestbook form { position:relative; display:grid; gap:13px; }
.guestbook label { display:grid; gap:7px; color:#ccc6d6; font-size:.73rem; font-weight:600; }
.guestbook input,.guestbook textarea { width:100%; min-width:0; padding:12px 13px; border:1px solid rgba(255,255,255,.1); border-radius:12px; outline:none; background:rgba(255,255,255,.025); color:#f3eff9; font-size:.8rem; font-weight:400; line-height:1.5; transition:border-color .2s,box-shadow .2s; }
.guestbook input::placeholder,.guestbook textarea::placeholder { color:#65616e; }
.guestbook textarea { resize:vertical; min-height:94px; max-height:300px; }
.guestbook input:focus,.guestbook textarea:focus { border-color:color-mix(in srgb,var(--profile-accent) 65%,transparent); box-shadow:0 0 0 3px color-mix(in srgb,var(--profile-accent) 9%,transparent); }
.guestbook-bottom { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.guestbook-bottom > span { color:#706b7c; font-size:.65rem; font-variant-numeric:tabular-nums; }
.guestbook-bottom button { display:flex; align-items:center; gap:16px; min-height:40px; padding:0 15px; border:1px solid color-mix(in srgb,var(--profile-accent) 36%,transparent); border-radius:11px; color:#f5eaff; background:color-mix(in srgb,var(--profile-accent) 18%,#141018); font-size:.74rem; font-weight:650; cursor:pointer; transition:background .2s; }
.guestbook-bottom button:hover { background:color-mix(in srgb,var(--profile-accent) 30%,#141018); }
.guestbook-bottom button:disabled { opacity:.55; cursor:wait; }
.guestbook-result { margin:0; color:#85e9ad; font-size:.75rem; line-height:1.5; }
.guestbook-result.is-error,.backup-status.is-error { color:#ff939d; }
.guestbook-trap { position:absolute; width:1px; height:1px; overflow:hidden; opacity:0; pointer-events:none; left:-10000px; }
.nav-count { margin-left:auto; padding:2px 6px; border-radius:6px; color:#e3c8ff; background:rgba(182,108,255,.18); font-size:.64rem; }
.inbox-summary { margin:0 0 16px; color:#a6a0b1; font-size:.77rem; }
.inbox-list { display:grid; gap:12px; }
.inbox-card { padding:18px; border:1px solid rgba(255,255,255,.07); border-radius:16px; background:rgba(255,255,255,.025); }
.inbox-card.is-unread { border-color:color-mix(in srgb,var(--profile-accent) 25%,transparent); background:color-mix(in srgb,var(--profile-accent) 4%,#101015); }
.inbox-head { display:flex; align-items:center; justify-content:space-between; gap:15px; }
.inbox-head strong { color:#eee9f5; font-size:.87rem; overflow-wrap:anywhere; }
.inbox-head time { flex-shrink:0; color:#7c7589; font-size:.69rem; }
.inbox-message { margin:14px 0 17px; color:#bcb5c9; font-size:.82rem; line-height:1.7; white-space:pre-wrap; overflow-wrap:anywhere; }
.inbox-actions { display:flex; align-items:center; gap:8px; padding-top:12px; border-top:1px solid rgba(255,255,255,.05); }
.inbox-actions > span { margin-right:auto; color:#777180; font-size:.66rem; }
.is-unread .inbox-actions > span { color:var(--profile-accent); }
.inbox-actions button,.inbox-pagination button { min-height:32px; padding:5px 10px; border:1px solid rgba(255,255,255,.08); border-radius:8px; color:#c4bdcf; background:rgba(255,255,255,.04); cursor:pointer; font-size:.69rem; }
.inbox-actions .inbox-delete { color:#ee8895; }
.inbox-actions button:disabled,.inbox-pagination button:disabled { opacity:.4; cursor:default; }
.inbox-pagination { display:flex; align-items:center; justify-content:flex-end; gap:12px; margin-top:16px; color:#8c829a; font-size:.7rem; }
.backup-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.backup-card { padding:23px; border:1px solid rgba(255,255,255,.075); border-radius:16px; background:rgba(255,255,255,.025); }
.backup-symbol { display:grid; place-items:center; width:39px; height:39px; border-radius:12px; color:var(--profile-accent); background:color-mix(in srgb,var(--profile-accent) 10%,transparent); font-size:1.4rem; }
.backup-card h3 { margin:17px 0 8px; font-size:.95rem; }
.backup-card p { min-height:40px; margin:0 0 20px; color:#9990a6; font-size:.77rem; line-height:1.6; }
.backup-note { margin:16px 2px 0; color:#817a8d; font-size:.72rem; line-height:1.6; }
.backup-status { margin:15px 2px 0; color:#8ae6b0; font-size:.78rem; }
.guestbook button:focus-visible,.inbox-actions button:focus-visible,.inbox-pagination button:focus-visible,.backup-card button:focus-visible { outline:2px solid var(--profile-accent); outline-offset:3px; }
@media (max-width:650px) {
  .backup-grid { grid-template-columns:1fr; }
  .inbox-head { align-items:flex-start; flex-direction:column; gap:6px; }
  .inbox-actions { flex-wrap:wrap; }
  .inbox-actions > span { flex-basis:100%; }
}

/* ── Discord Webhook Form ── */
.webhook-form { display:grid; gap:14px; padding:18px; border:1px solid rgba(255,255,255,.07); border-radius:18px; background:rgba(255,255,255,.022); }
.webhook-form > div { display:grid; gap:3px; }
.webhook-form strong { font-size:.86rem; }
.webhook-form small { color:#6e6d78; font-size:.71rem; }
.webhook-actions { display:flex; gap:10px; }

/* Duyuru, galeri ve bağlantı efektleri. Özel imleç V13'te kaldırıldı. */
.social-link { position:relative; isolation:isolate; overflow:hidden; }
.social-link::before { content:""; position:absolute; inset:0; z-index:0; opacity:0; background:linear-gradient(105deg,transparent 8%,color-mix(in srgb,var(--link-tone) 20%,transparent) 48%,transparent 90%); transform:translateX(-70%); transition:transform .55s ease,opacity .3s ease; }
.social-link::after { content:""; position:absolute; right:-24px; top:50%; z-index:0; width:90px; height:90px; border-radius:50%; opacity:0; background:var(--link-tone); filter:blur(26px); transform:translateY(-50%); transition:opacity .28s ease; }
.social-link > * { position:relative; z-index:1; }
.social-link:hover::before { opacity:1; transform:translateX(70%); }.social-link:hover::after { opacity:.16; }
.social-link:hover .link-icon { transform:rotate(-5deg) scale(1.05); box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--link-tone) 45%,transparent),0 0 20px color-mix(in srgb,var(--link-tone) 18%,transparent); }
.link-icon { transition:transform .24s ease,box-shadow .24s ease; }

.profile-announcement { display:grid; grid-template-columns:34px minmax(0,1fr) auto; align-items:center; gap:10px; margin:0 0 12px; padding:11px; border:1px solid color-mix(in srgb,var(--profile-accent) 24%,rgba(255,255,255,.08)); border-radius:16px; background:linear-gradient(100deg,color-mix(in srgb,var(--profile-accent) 10%,rgba(255,255,255,.03)),rgba(255,255,255,.025)); box-shadow:inset 0 1px rgba(255,255,255,.045); animation:link-enter .5s ease both; }
.announcement-icon { display:grid; place-items:center; width:34px; height:34px; border-radius:11px; color:var(--profile-accent); background:color-mix(in srgb,var(--profile-accent) 14%,transparent); box-shadow:0 0 18px color-mix(in srgb,var(--profile-accent) 16%,transparent); }
.profile-announcement > div { min-width:0; display:grid; gap:3px; }.profile-announcement strong { overflow:hidden; color:#f1edf7; font-size:.76rem; text-overflow:ellipsis; white-space:nowrap; }.profile-announcement p { margin:0; overflow:hidden; color:#9d98a8; font-size:.67rem; line-height:1.35; text-overflow:ellipsis; white-space:nowrap; }.profile-announcement a { color:var(--profile-accent); font-size:.68rem; font-weight:700; text-decoration:none; white-space:nowrap; }

.profile-gallery { margin-top:19px; padding-top:18px; border-top:1px solid rgba(255,255,255,.075); }
.gallery-heading { display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; color:#b4adbf; font-size:.68rem; font-weight:650; text-transform:uppercase; letter-spacing:.07em; }.gallery-heading span { display:flex; align-items:center; gap:6px; }.gallery-heading i { width:5px; height:5px; border-radius:50%; background:var(--profile-accent); box-shadow:0 0 9px var(--profile-accent); }.gallery-heading small { color:#696575; font-size:.62rem; letter-spacing:0; text-transform:none; }
.gallery-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }.gallery-item { position:relative; aspect-ratio:1 / .82; display:block; min-width:0; overflow:hidden; padding:0; border:1px solid rgba(255,255,255,.09); border-radius:13px; background:#0d0d13; cursor:pointer; isolation:isolate; animation:link-enter .42s ease both; animation-delay:var(--gallery-delay); }.gallery-item img,.gallery-item video { width:100%; height:100%; display:block; object-fit:cover; transition:transform .38s ease,filter .38s ease; }.gallery-item::after { content:""; position:absolute; inset:0; border:1px solid transparent; border-radius:inherit; background:linear-gradient(135deg,color-mix(in srgb,var(--profile-accent) 40%,transparent),transparent 55%) border-box; opacity:0; pointer-events:none; transition:opacity .25s; }.gallery-item:hover img,.gallery-item:hover video { transform:scale(1.09); filter:saturate(1.18); }.gallery-item:hover::after { opacity:1; }.gallery-video-mark { position:absolute; left:7px; bottom:7px; z-index:1; padding:4px 6px; border-radius:7px; color:#fff; background:rgba(6,6,10,.7); backdrop-filter:blur(8px); font-size:.56rem; font-weight:700; }
.gallery-dialog { width:min(calc(100% - 30px),820px); max-height:90svh; padding:12px; overflow:visible; border:1px solid rgba(255,255,255,.12); border-radius:20px; background:rgba(8,8,12,.96); box-shadow:0 30px 110px rgba(0,0,0,.8); }.gallery-dialog::backdrop { background:rgba(0,0,0,.8); backdrop-filter:blur(7px); }.gallery-dialog img,.gallery-dialog video { display:block; max-width:100%; max-height:calc(90svh - 24px); margin:auto; border-radius:12px; }.gallery-dialog video { width:100%; background:#000; }.gallery-dialog-close { position:absolute; right:-10px; top:-10px; z-index:2; width:35px; height:35px; border:1px solid rgba(255,255,255,.15); border-radius:50%; color:#fff; background:#17171f; cursor:pointer; font-size:1.25rem; }


.announcement-admin-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:13px; }.announcement-admin-grid > label:not(.announcement-switch) { display:grid; gap:8px; color:#b9b8c2; font-size:.78rem; font-weight:650; }.announcement-admin-grid input:not([type=checkbox]),.announcement-admin-grid textarea { width:100%; min-width:0; padding:11px 12px; border:1px solid rgba(255,255,255,.09); border-radius:12px; outline:0; color:#f6f3fa; background:rgba(255,255,255,.035); font:inherit; }.announcement-admin-grid textarea { resize:vertical; }.announcement-admin-grid input:focus,.announcement-admin-grid textarea:focus { border-color:color-mix(in srgb,var(--profile-accent) 55%,transparent); box-shadow:0 0 0 3px color-mix(in srgb,var(--profile-accent) 10%,transparent); }.announcement-full { grid-column:1/-1; }.announcement-switch { display:flex; align-items:center; gap:11px; grid-column:1/-1; min-height:58px; padding:12px; border:1px solid rgba(255,255,255,.07); border-radius:13px; cursor:pointer; background:rgba(255,255,255,.025); }.announcement-switch input { position:absolute; opacity:0; pointer-events:none; }.announcement-switch i { position:relative; flex:0 0 36px; width:36px; height:21px; border-radius:99px; background:#292832; }.announcement-switch i::after { content:""; position:absolute; left:3px; top:3px; width:15px; height:15px; border-radius:50%; background:#777681; transition:transform .2s,background .2s; }.announcement-switch input:checked + i { background:color-mix(in srgb,var(--profile-accent) 38%,#1a1820); }.announcement-switch input:checked + i::after { transform:translateX(15px); background:var(--profile-accent); }.announcement-switch span { display:grid; gap:3px; }.announcement-switch strong { color:#e9e6ee; font-size:.78rem; }.announcement-switch small { color:#76727e; font-size:.68rem; }
.gallery-upload-row { display:flex; align-items:center; flex-wrap:wrap; gap:12px; margin-bottom:18px; }.gallery-upload-row small { color:#77737f; font-size:.7rem; }.admin-gallery-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:11px; }.admin-gallery-item { position:relative; aspect-ratio:1 / .8; overflow:hidden; border:1px solid rgba(255,255,255,.08); border-radius:14px; background:#0c0c11; }.admin-gallery-item img,.admin-gallery-item video { width:100%; height:100%; object-fit:cover; display:block; }.admin-gallery-item button { position:absolute; right:7px; top:7px; width:30px; height:30px; border:0; border-radius:9px; color:#ff9fac; background:rgba(12,10,15,.78); backdrop-filter:blur(8px); cursor:pointer; font-size:1.1rem; }.admin-gallery-empty { grid-column:1/-1; margin:0; padding:18px; border:1px dashed rgba(255,255,255,.1); border-radius:13px; color:#77737f; text-align:center; font-size:.75rem; }
@media (max-width:650px) { .announcement-admin-grid { grid-template-columns:1fr; }.admin-gallery-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.gallery-upload-row { align-items:flex-start; flex-direction:column; }.profile-announcement { grid-template-columns:34px minmax(0,1fr); }.profile-announcement a { grid-column:2; justify-self:start; }.gallery-grid { gap:7px; } }
.webhook-hint { margin:0; color:#5e5d68; font-size:.69rem; line-height:1.5; }
.webhook-status { margin:0; font-size:.78rem; padding:9px 13px; border-radius:10px; }
.webhook-status.is-ok  { background:rgba(89,217,140,.1); color:#59d98c; }
.webhook-status.is-error { background:rgba(255,71,93,.1); color:#ff7585; }
.background-only .profile-card,.background-only .music-player,.background-only .profile-vignette,.background-only .profile-noise,.background-only .intro-screen { display:none!important; }
.background-only .profile-shell { padding:0; }
.background-only .profile-background { inset:0;animation:none; }
