:root{
    --bg:#050816;
    --panel:#0f172a;
    --panel2:#111827;
    --text:#f8fafc;
    --muted:#94a3b8;
    --blue:#38bdf8;
    --purple:#8b5cf6;
}
*{box-sizing:border-box}
body{
    margin:0;
    background:radial-gradient(circle at top,#111a3b 0,#050816 42%,#020617 100%);
    color:var(--text);
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Noto Sans KR",Arial,sans-serif;
}
a{color:inherit;text-decoration:none}
.gph-container{width:min(1180px,92%);margin:0 auto}
.gph-header{
    position:sticky;
    top:0;
    z-index:10;
    background:rgba(5,8,22,.88);
    backdrop-filter:blur(14px);
    border-bottom:1px solid rgba(148,163,184,.18);
}
.gph-header-inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    min-height:74px;
}
.gph-logo{
    font-size:26px;
    font-weight:900;
    color:var(--blue);
    letter-spacing:.5px;
}
.gph-search input{
    background:#0b1224;
    border:1px solid rgba(148,163,184,.28);
    color:#fff;
    padding:12px 14px;
    border-radius:999px;
}
.gph-hero{
    padding:78px 0 46px;
    text-align:center;
}
.gph-badge{
    display:inline-block;
    color:#a5f3fc;
    border:1px solid rgba(56,189,248,.4);
    padding:8px 14px;
    border-radius:999px;
    margin-bottom:18px;
}
.gph-hero h1{
    font-size:clamp(32px,5vw,58px);
    margin:0 0 16px;
}
.gph-hero p{color:var(--muted);font-size:18px}
.gph-section{padding:42px 0}
.gph-section h1,.gph-section h2{margin:0 0 24px}
.gph-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
    gap:22px;
}
.gph-card{
    background:linear-gradient(180deg,rgba(17,24,39,.95),rgba(15,23,42,.95));
    border:1px solid rgba(148,163,184,.18);
    border-radius:24px;
    overflow:hidden;
    box-shadow:0 18px 48px rgba(0,0,0,.28);
}
.gph-thumb{
    display:block;
    height:176px;
    background:#0b1022;
}
.gph-thumb img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}
.gph-thumb-placeholder{
    height:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    color:var(--blue);
    font-size:30px;
    font-weight:900;
}
.gph-card-body{padding:18px}
.gph-card h3{margin:0 0 10px;font-size:19px}
.gph-card p{color:#b7c4d8;line-height:1.55;min-height:50px}
.gph-card-bottom{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-top:14px;
    color:var(--muted);
}
.gph-play,.gph-btn{
    display:inline-flex;
    border:0;
    border-radius:999px;
    padding:12px 20px;
    color:#fff;
    font-weight:800;
    background:linear-gradient(135deg,var(--blue),var(--purple));
    cursor:pointer;
}
.gph-single{
    padding:34px 0 60px;
}
.gph-single h1{
    font-size:clamp(28px,4vw,46px);
}
.gph-meta{
    color:var(--muted);
    margin-bottom:18px;
}
.gph-player-wrap{
    position:relative;
    width:100%;
    padding-top:56.25%;
    background:#000;
    border-radius:24px;
    overflow:hidden;
    border:1px solid rgba(56,189,248,.32);
    box-shadow:0 0 48px rgba(56,189,248,.12);
}
.gph-player{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    border:0;
}
.gph-player-empty{
    position:absolute;
    inset:0;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    padding:24px;
}
.gph-actions{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
    margin:18px 0 28px;
}
.gph-content,.gph-info-box,.gph-empty{
    background:rgba(15,23,42,.72);
    border:1px solid rgba(148,163,184,.18);
    border-radius:22px;
    padding:22px;
    line-height:1.75;
}
.gph-footer{
    border-top:1px solid rgba(148,163,184,.18);
    color:var(--muted);
    padding:30px 0;
}
.gph-ad{
    border:1px dashed rgba(148,163,184,.4);
    color:var(--muted);
    border-radius:18px;
    padding:26px;
    text-align:center;
}
@media(max-width:768px){
    .gph-header-inner{flex-direction:column;padding:16px 0}
    .gph-search{width:100%}
    .gph-search input{width:100%}
    .gph-player-wrap{padding-top:150%}
    .gph-thumb{height:150px}
}
