:root{
        --bg:#0b0b0b;
        --fg:#eee;
        --muted:rgba(255,255,255,.75);
        --accent:#7c5cff
    }

    *{
        box-sizing:border-box
    }

    body{
        font-family:Inter, system-ui, -apple-system, 'Segoe UI', Roboto, 'Noto Sans KR', 'Apple SD Gothic Neo', 'Malgun Gothic', sans-serif;
        margin:18px;
        background:var(--bg);
        color:var(--fg)
    }

    .controls{
        margin-bottom:12px;
        display:flex; gap:8px;
        align-items:center;
        flex-wrap:wrap
    }

    .card{
        background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));
        padding:12px;
        border-radius:10px
    }

    button{
        padding:8px 12px;
        border-radius:10px;
        border:1px solid rgba(255,255,255,0.06);
        cursor:pointer;
        background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(0,0,0,0.12));
        color:var(--fg);
        font-weight:600
    }
    button:hover{
        transform:translateY(-1px);
        box-shadow:0 6px 18px rgba(0,0,0,0.5)
    }
    select{
        padding:8px 10px;
        border-radius:8px;
        border:1px solid rgba(255,255,255,0.06);
        background:rgba(255,255,255,0.02);
        color:var(--fg)
    }
    input[type="number"]{
        width:110px;
        padding:6px 8px;
        border-radius:8px;
        border:1px solid rgba(255,255,255,0.06);
        background:rgba(255,255,255,0.02);
        color:var(--fg)
    }

    .meta{
        font-size:13px;
        color:var(--muted);
    }
    canvas{
        display:block;
        border-radius:12px;
        box-shadow:0 10px 30px rgba(0,0,0,.7);
        max-width:100%;
        height:auto;
    }
    .footer{
        margin-top:10px;
        color:var(--muted);
        font-size:13px;
    }
    .flex{
        display:flex;
        gap:8px;
        align-items:center;
    }
    label{
        font-size:13px;
    }

    @media (max-width:720px){
      .controls{
        flex-direction:column; align-items:flex-start;
      }
      .flex{
        width:100%;
        justify-content:flex-start;
      }
      input[type="number"]{
        width:48%;
      }
    }