/* myonlinelink: profil sayfasının küçük ölçekli kopyası (telefon önizlemesi).
   Ana sayfa kullanır. Değerler profil motorunun
   (server/server/index.ts) varsayılan görünümünden alındı; motor değişirse
   burası da güncellenmeli. */

.device{width:100%;max-width:320px;margin:0 auto;padding:9px;border:1px solid var(--border);
  border-radius:38px;background:var(--surface)}
.screen{position:relative;height:600px;border-radius:30px;overflow:hidden;background:#0a0a0c}

.pg{--a:#d9a441;--pbg:#0a0a0c;--fg:#f4f2ef;--fgs:rgba(244,242,239,.62);--cb:rgba(255,255,255,.06);
  --cl:rgba(255,255,255,.1);--r:12px;--pf:"Inter",-apple-system,"Segoe UI",sans-serif;
  color:var(--fg);font-family:var(--pf);font-size:14px;line-height:1.6}
.pg[data-theme="kagit"]{--a:#e0653a;--pbg:#f1e8d6;--fg:#17140f;--fgs:rgba(23,20,15,.62);
  --cb:rgba(0,0,0,.05);--cl:rgba(0,0,0,.1);--r:6px;--pf:"Playfair Display",Georgia,serif}
.pg[data-theme="orman"]{--a:#86be96;--pbg:#131a15;--r:20px;--pf:"Space Grotesk",-apple-system,sans-serif}
.pg[data-theme="foto"]{--a:#f0c268;--pbg:#2f3a42;--r:14px;--cb:rgba(255,255,255,.1);--cl:rgba(255,255,255,.16)}
.screen .pg{height:100%;display:flex;flex-direction:column;align-items:center;text-align:center;
  padding:46px 18px 20px;background-color:var(--pbg);overflow:hidden;
  transition:background-color .25s ease-out,color .25s ease-out}
.screen .pg>*{flex-shrink:0}
.screen .pg[data-theme="foto"]{background-size:cover;background-position:center;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 600' preserveAspectRatio='xMidYMid slice'%3E%3Crect width='300' height='600' fill='%237f8c96'/%3E%3Cpath d='M0 330 70 250 120 300 190 210 300 320V600H0z' fill='%235a6770'/%3E%3Cpath d='M0 400 90 320 160 380 230 330 300 380V600H0z' fill='%233e4a52'/%3E%3Cpath d='M0 470C80 430 190 440 300 470V600H0z' fill='%23262e34'/%3E%3Crect width='300' height='600' fill='%23000' fill-opacity='.38'/%3E%3C/svg%3E")}
.pg svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

.pg-av{flex:none;width:76px;height:76px;border-radius:50%;display:grid;place-items:center;
  background:color-mix(in srgb,var(--a) 18%,transparent);border:1px solid var(--cl);
  font-size:30px;font-weight:600;line-height:1;color:var(--a)}
.pg-name{max-width:100%;margin:14px 0 2px;font-size:19px;font-weight:600;line-height:1.3;letter-spacing:-.02em;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pg-handle{max-width:100%;font-size:12px;color:var(--fgs);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pg-bio{max-width:30ch;margin:10px 0 0;font-size:13px;line-height:1.5;color:var(--fgs)}
.pg-soc{display:flex;gap:8px;margin-top:16px}
.pg-soc i{width:34px;height:34px;border-radius:calc(var(--r) * .8);display:grid;place-items:center;
  background:var(--cb);border:1px solid var(--cl);color:var(--fgs)}
.pg-list{width:100%;display:flex;flex-direction:column;gap:9px;margin-top:22px}
.pg-lnk{display:flex;align-items:center;justify-content:center;gap:9px;min-height:46px;padding:10px 30px;
  border-radius:var(--r);background:var(--cb);border:1px solid var(--cl);font-size:13.5px;font-weight:500;line-height:1.35}
.pg-lnk-ico svg{width:17px;height:17px;color:var(--fgs)}
.pg-card{padding:12px 14px;border-radius:var(--r);background:var(--cb);border:1px solid var(--cl);text-align:left}
.pg-row{display:flex;align-items:center;justify-content:center;gap:11px;text-align:center}
.pg-row>span:last-child{min-width:0;text-align:left}
.pg-row b{display:block;font-size:13px;font-weight:600;line-height:1.35}
.pg-row i{display:block;font-style:normal;font-size:12px;line-height:1.35;color:var(--fgs)}
.pg-ico{flex:none;width:32px;height:32px;border-radius:10px;display:grid;place-items:center;
  background:color-mix(in srgb,var(--a) 14%,transparent);color:var(--a)}
.pg-foot{margin-top:auto;padding-top:20px;font-size:11px;color:var(--fgs)}

/* blok örnekleri */
.pg-txt{display:block;margin:0;font-size:13.5px;line-height:1.6}
.pg-socrow{display:flex;justify-content:center;gap:8px}
.pg-socrow i{width:32px;height:32px;border-radius:calc(var(--r) * .8);display:grid;place-items:center;
  background:var(--cb);border:1px solid var(--cl);color:var(--fgs)}
.pg-yt{padding:7px 7px 11px}
.pg-th{position:relative;display:block;aspect-ratio:16/9;border-radius:calc(var(--r) * .75);overflow:hidden}
.pg .pg-th>svg{width:100%;height:100%;display:block;stroke:none}
.pg-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:40px;height:40px;border-radius:50%;
  display:grid;place-items:center;color:#fff;background:rgba(0,0,0,.55)}
.pg .pg-play svg{width:16px;height:16px;margin-left:2px}
.pg-ytt{display:block;margin:9px 6px 0;text-align:center;font-size:13.5px;font-weight:600;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pg-gal{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.pg .pg-gal svg{width:100%;height:auto;aspect-ratio:1;display:block;border-radius:calc(var(--r) * .6);stroke:none}
.pg-cdbox{text-align:center}
.pg-lbl{display:block;margin-bottom:8px;font-size:12px;color:var(--fgs)}
.pg-cdbox .pg-lbl{margin-bottom:2px}
.pg-faq .pg-lbl{margin:10px 0 0}
.pg-cd{display:block;font-size:21px;font-weight:600;letter-spacing:-.02em;color:var(--a);font-variant-numeric:tabular-nums}
.pg-faq{padding:2px 14px}
.pg-faq details{padding:11px 0;border-top:1px solid var(--cl)}
.pg-faq details:first-child{border-top:0}
.pg-faq summary{display:flex;justify-content:space-between;gap:12px;cursor:pointer;list-style:none;font-size:13.5px;font-weight:500}
.pg-faq summary::-webkit-details-marker{display:none}
.pg-faq summary::after{content:"+";color:var(--fgs);font-weight:400}
.pg-faq details[open] summary::after{content:"\2212"}
.pg-faq summary:focus-visible{outline:2px solid var(--a);outline-offset:2px}
.pg-faq p{margin:6px 0 0;font-size:13px;color:var(--fgs)}


/* 2026-10-20: profil motorunun yeni görünümüne uyum. Düğmeler kalın ve hepsi aynı boyda;
   simge sol kenarda, yazı ortada. Simge kutusu yok. Başlangıç ekranının önizlemesi de kullanır. */
.pg-lnk{position:relative;font-weight:600}
.pg-lnk.lead{padding-left:44px;padding-right:44px}
.pg-gl{position:absolute;left:9px;top:50%;transform:translateY(-50%);width:28px;height:28px;display:grid;place-items:center;color:var(--fgs)}
.pg .pg-gl svg{width:16px;height:16px}
.pg-lt{display:flex;flex-direction:column;align-items:center;min-width:0}
.pg-sub{font-weight:400;font-size:12px;color:var(--fgs)}
.pg-ico{background:none;color:var(--fgs);width:auto;height:auto}
.pg-name.solo{margin-top:4px;font-size:23px}
.pg-list.grid2{display:grid;grid-template-columns:1fr 1fr}
.pg-list.grid2>.pg-full{grid-column:1/-1}
.pg-list.grid2>.pg-half{min-width:0;padding-left:12px;padding-right:12px}
/* Küçük önizlemede yarım hücre dar: simge yazının üstüne binmesin diye gizlenir. */
.pg-list.grid2>.pg-half .pg-gl{display:none}
.pg-list.grid2>.pg-half.lead{padding-left:12px}
.pg-plain{text-align:center;white-space:pre-line}
.pg-faq.pg-plain{text-align:left;padding:0}
.pg-th-e{background:color-mix(in srgb,var(--fg) 10%,transparent)}
.pg-foot b{font-weight:600;color:var(--fg)}
.pg-sl{color:#d9a441}
.pg-bico{position:absolute;left:9px;top:50%;transform:translateY(-50%);width:28px;height:28px;border-radius:calc(var(--r) * .5);object-fit:cover}
