/* Yukarı Göklü — Sitene Ekle Studio 1.42.1 */
.ygn-embed-builder{background:#07101f;padding:34px 0 44px;color:#f8fafc}
.ygn-embed-builder .ygn-container{max-width:1500px}
.ygn-embed-builder *{box-sizing:border-box}
.ygn-embed-builder button,.ygn-embed-builder input,.ygn-embed-builder select{font:inherit}
.ygn-embed-builder__hero{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(520px,.95fr);gap:34px;align-items:center;padding:34px;border:1px solid #1e293b;border-radius:22px;background:radial-gradient(circle at 75% 15%,rgba(239,35,60,.14),transparent 35%),linear-gradient(135deg,#0b1322,#0a101c);box-shadow:0 24px 60px rgba(0,0,0,.22)}
.ygn-embed-builder__hero-copy>span,.ygn-embed-builder__features strong{color:var(--ygn-embed-accent,#e30613)}
.ygn-embed-builder__hero-copy>span{font-size:11px;letter-spacing:.16em;font-weight:900}
.ygn-embed-builder__hero h1{margin:12px 0 14px;font-size:clamp(32px,4vw,58px);line-height:1.04;color:#fff}
.ygn-embed-builder__hero h1 em{font-style:normal;color:var(--ygn-embed-accent,#e30613)}
.ygn-embed-builder__hero p{max-width:720px;margin:0;color:#aeb8c8;font-size:16px;line-height:1.75}
.ygn-embed-builder__features{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.ygn-embed-builder__features>div{display:grid;grid-template-columns:42px 1fr;grid-template-rows:auto auto;column-gap:12px;align-items:center;padding:15px;border:1px solid #1f2b3e;border-radius:16px;background:rgba(13,21,34,.78)}
.ygn-embed-builder__features b{grid-row:1/3;width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:color-mix(in srgb,var(--ygn-embed-accent,#e30613) 12%,transparent);color:var(--ygn-embed-accent,#e30613);font-size:17px}
.ygn-embed-builder__features strong{font-size:13px;color:#fff}
.ygn-embed-builder__features span{font-size:11px;color:#8f9aad;line-height:1.45}

.ygn-embed-studio{display:grid;grid-template-columns:390px minmax(0,1fr);gap:18px;margin-top:18px}
.ygn-embed-controls,.ygn-embed-workspace{border:1px solid #1e293b;border-radius:20px;background:#0a1220}
.ygn-embed-controls{padding:20px;height:max-content;position:sticky;top:20px}
.ygn-embed-step{padding-bottom:22px;margin-bottom:22px;border-bottom:1px solid #1d293b}
.ygn-embed-step:last-of-type{margin-bottom:16px}
.ygn-embed-step header{display:flex;gap:10px;align-items:flex-start;margin-bottom:16px}
.ygn-embed-step header i{flex:0 0 28px;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--ygn-embed-accent,#e30613);color:#fff;font-style:normal;font-size:12px;font-weight:900}
.ygn-embed-step h2,.ygn-embed-preview-head h2,.ygn-embed-codebox h2{margin:0;color:#fff;font-size:15px}
.ygn-embed-step header p,.ygn-embed-preview-head p,.ygn-embed-codebox header p{margin:4px 0 0;color:#738096;font-size:11px;line-height:1.45}
.ygn-embed-types{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
.ygn-embed-types button{min-height:74px;padding:10px 6px;border:1px solid #1d2938;border-radius:12px;background:#111b2a;color:#c9d2df;display:grid;place-items:center;gap:5px;cursor:pointer;transition:.18s}
.ygn-embed-types button b{font-size:19px;color:#91a0b5}
.ygn-embed-types button span{font-size:11px;font-weight:800}
.ygn-embed-types button:hover,.ygn-embed-types button.is-active{border-color:var(--ygn-embed-accent,#e30613);background:linear-gradient(180deg,color-mix(in srgb,var(--ygn-embed-accent,#e30613) 13%,transparent),color-mix(in srgb,var(--ygn-embed-accent,#e30613) 4%,transparent));color:#fff;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ygn-embed-accent,#e30613) 15%,transparent)}
.ygn-embed-types button.is-active b{color:var(--ygn-embed-accent,#e30613)}
.ygn-embed-label{display:block;margin:14px 0 8px;color:#c9d2df;font-size:11px;font-weight:700}
.ygn-embed-segmented{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}
.ygn-embed-segmented button{padding:10px;border:1px solid #1d2938;border-radius:9px;background:#111b2a;color:#9ca8ba;font-size:11px;font-weight:700;cursor:pointer}
.ygn-embed-segmented button.is-active{border-color:var(--ygn-embed-accent,#e30613);color:#fff;background:color-mix(in srgb,var(--ygn-embed-accent,#e30613) 12%,transparent)}
.ygn-embed-colors{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.ygn-embed-colors>button,.ygn-embed-color-custom{width:30px;height:30px;border-radius:50%;border:2px solid #243247;background:var(--swatch);display:grid;place-items:center;cursor:pointer}
.ygn-embed-colors>button.is-active{box-shadow:0 0 0 2px #07101f,0 0 0 4px var(--swatch)}
.ygn-embed-color-custom{position:relative;background:#243247;color:#fff;font-weight:900;overflow:hidden}
.ygn-embed-color-custom input{position:absolute;inset:0;opacity:0;cursor:pointer}
.ygn-embed-range{margin-top:16px}
.ygn-embed-range label{display:flex;align-items:center;justify-content:space-between;color:#c9d2df;font-size:11px}
.ygn-embed-range output{padding:4px 7px;border-radius:7px;background:#142035;color:#fff}
.ygn-embed-range input{width:100%;accent-color:var(--ygn-embed-accent,#e30613)}
.ygn-embed-size-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ygn-embed-size-grid label>span{display:block;margin-bottom:7px;color:#c9d2df;font-size:11px;font-weight:700}
.ygn-embed-size-grid label>div{display:grid;grid-template-columns:1fr 62px}
.ygn-embed-size-grid input,.ygn-embed-size-grid select,.ygn-embed-select{width:100%;min-height:42px;border:1px solid #223148;background:#0f1928;color:#f8fafc}
.ygn-embed-size-grid input{border-radius:10px 0 0 10px;padding:0 12px}
.ygn-embed-size-grid select{border-left:0;border-radius:0 10px 10px 0;padding:0 8px}
.ygn-embed-select{border-radius:10px;padding:0 12px}
.ygn-embed-hint,.ygn-embed-free{display:block;color:#718096;font-size:10px;line-height:1.5}
.ygn-embed-hint{margin:8px 0 0}
.ygn-embed-generate{width:100%;min-height:48px;border:0;border-radius:10px;background:var(--ygn-embed-accent,#e30613);color:#fff;font-weight:900;cursor:pointer;box-shadow:0 12px 30px color-mix(in srgb,var(--ygn-embed-accent,#e30613) 18%,transparent)}
.ygn-embed-free{text-align:center;margin-top:8px}

.ygn-embed-workspace{padding:18px;min-width:0}
.ygn-embed-preview-head,.ygn-embed-codebox header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:14px}
.ygn-embed-preview-head h2 i{display:inline-block;width:7px;height:7px;margin-left:5px;border-radius:50%;background:#22c55e}
.ygn-embed-devices{display:flex;gap:7px}
.ygn-embed-devices button{border:1px solid #223148;border-radius:9px;padding:9px 12px;background:#0f1928;color:#9ca8ba;font-size:11px;font-weight:800;cursor:pointer}
.ygn-embed-devices button.is-active{background:var(--ygn-embed-accent,#e30613);border-color:var(--ygn-embed-accent,#e30613);color:#fff}
.ygn-embed-preview-stage{min-height:530px;padding:14px;border:1px solid #1d293b;border-radius:14px;background:radial-gradient(circle at 50% 10%,rgba(37,99,235,.08),transparent 40%),#060c16;display:flex;align-items:flex-start;justify-content:center;overflow:auto}
.ygn-embed-preview-shell{width:100%;max-width:100%;transition:width .22s ease}
.ygn-embed-preview-shell[data-device="tablet"]{width:min(760px,100%)}
.ygn-embed-preview-shell[data-device="mobile"]{width:min(390px,100%)}
.ygn-embed-preview-shell iframe{display:block;width:100%;height:450px;border:0;border-radius:12px;background:#0b1220}
.ygn-embed-presets{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin:12px 0 18px}
.ygn-embed-presets button{padding:10px 6px;border:1px solid #1d293b;border-radius:10px;background:#0f1928;color:#aeb8c8;font-size:10px;font-weight:800;cursor:pointer}
.ygn-embed-presets button span{display:block;margin-bottom:4px;font-size:16px}
.ygn-embed-presets button.is-active{border-color:var(--ygn-embed-accent,#e30613);color:#fff;background:color-mix(in srgb,var(--ygn-embed-accent,#e30613) 8%,transparent)}
.ygn-embed-codebox{border:1px solid #1d293b;border-radius:14px;padding:14px;background:#080f1b}
.ygn-embed-codebox header>div:first-child{display:flex;gap:10px;align-items:center}
.ygn-embed-codebox header>div:first-child>b{width:34px;height:34px;border-radius:9px;background:#10223d;color:#5ea4ff;display:grid;place-items:center}
.ygn-embed-code-actions button{border:0;background:var(--ygn-embed-accent,#e30613);color:#fff;border-radius:9px;padding:10px 14px;font-size:11px;font-weight:900;cursor:pointer}
.ygn-embed-codebox pre{margin:0;padding:16px;border:1px solid #1d293b;border-radius:10px;background:#0b1422;overflow:auto;color:#cdd7e5;min-height:135px}
.ygn-embed-codebox code{font:12px/1.65 ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;white-space:pre-wrap;overflow-wrap:anywhere}
.ygn-embed-code-tabs{display:flex;gap:7px;margin-top:10px}
.ygn-embed-code-tabs button{border:1px solid #223148;background:#0f1928;color:#9ca8ba;border-radius:8px;padding:8px 11px;font-size:10px;font-weight:800;cursor:pointer}
.ygn-embed-code-tabs button.is-active{border-color:var(--ygn-embed-accent,#e30613);color:#fff}
.ygn-embed-code-tabs small{color:var(--ygn-embed-accent,#e30613)}
.ygn-embed-notice{margin-top:12px;padding:13px 15px;border:1px solid #1d293b;border-radius:11px;background:#0b1422;color:#8e9aae;display:flex;justify-content:space-between;gap:20px;font-size:10px}
.ygn-embed-notice strong{color:#fff;white-space:nowrap}
.ygn-embed-builder .screen-reader-text{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

@media(max-width:1100px){
 .ygn-embed-builder__hero{grid-template-columns:1fr}
 .ygn-embed-studio{grid-template-columns:330px minmax(0,1fr)}
 .ygn-embed-types{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:850px){
 .ygn-embed-studio{grid-template-columns:1fr}
 .ygn-embed-controls{position:static}
 .ygn-embed-types{grid-template-columns:repeat(3,1fr)}
 .ygn-embed-preview-stage{min-height:470px}
 .ygn-embed-presets{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:620px){
 .ygn-embed-builder{padding:16px 0 28px}
 .ygn-embed-builder__hero,.ygn-embed-controls,.ygn-embed-workspace{border-radius:16px}
 .ygn-embed-builder__hero{padding:22px}
 .ygn-embed-builder__features{grid-template-columns:1fr}
 .ygn-embed-builder__hero h1{font-size:34px}
 .ygn-embed-types{grid-template-columns:repeat(2,1fr)}
 .ygn-embed-size-grid{grid-template-columns:1fr}
 .ygn-embed-preview-head{align-items:flex-start;flex-direction:column}
 .ygn-embed-devices{width:100%}
 .ygn-embed-devices button{flex:1;padding:9px 6px}
 .ygn-embed-preview-stage{padding:8px;min-height:420px}
 .ygn-embed-preview-shell iframe{height:420px}
 .ygn-embed-presets{grid-template-columns:repeat(2,1fr)}
 .ygn-embed-codebox header{align-items:flex-start;flex-direction:column}
 .ygn-embed-code-actions{width:100%}
 .ygn-embed-code-actions button{width:100%}
 .ygn-embed-notice{flex-direction:column}
}


/* 1.42.2 — precision pass */
.ygn-embed-types button{position:relative}
.ygn-embed-types button svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;color:#b4c0d0}
.ygn-embed-types button.is-active svg{color:var(--ygn-embed-accent,#e30613)}
.ygn-embed-types button small{position:absolute;top:6px;right:6px;padding:2px 4px;border-radius:5px;background:var(--ygn-embed-accent,#e30613);color:#fff;font-size:7px;font-weight:950;letter-spacing:.04em}
.ygn-embed-devices button{display:inline-flex;align-items:center;justify-content:center;gap:6px}
.ygn-embed-devices button svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ygn-embed-preview-stage{min-height:0;overflow:visible}
.ygn-embed-preview-shell{overflow:visible}
.ygn-embed-preview-shell iframe{height:450px;min-height:180px;transition:height .18s ease;background:#0a1322}
.ygn-embed-step--options{padding-bottom:16px}
.ygn-embed-toggles{display:grid;gap:8px}
.ygn-embed-toggles label{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:10px 11px;border:1px solid #1d2938;border-radius:11px;background:#0f1928;cursor:pointer}
.ygn-embed-toggles label>span{display:grid;gap:2px}
.ygn-embed-toggles label strong{color:#dce4ef;font-size:11px}
.ygn-embed-toggles label small{color:#718096;font-size:9px;line-height:1.35}
.ygn-embed-toggles input{position:absolute;opacity:0;pointer-events:none}
.ygn-embed-toggles label>i{position:relative;width:36px;height:20px;flex:0 0 36px;border-radius:999px;background:#334155;transition:.18s}
.ygn-embed-toggles label>i::after{content:"";position:absolute;top:3px;left:3px;width:14px;height:14px;border-radius:50%;background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.25);transition:.18s}
.ygn-embed-toggles input:checked+i{background:var(--ygn-embed-accent,#e30613)}
.ygn-embed-toggles input:checked+i::after{transform:translateX(16px)}
.ygn-embed-toggles input:focus-visible+i{outline:2px solid #fff;outline-offset:2px}
.ygn-embed-presets button{min-height:74px;font-size:11px}
.ygn-embed-presets button span{font-size:18px;color:#aeb9c8}
@media(max-width:620px){
 .ygn-embed-preview-shell iframe{height:420px}
}