@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

:root{
    --bg:#0a0b0f;
    --surface:#121319;
    --surface-2:#1a1c24;
    --surface-3:#21232d;
    --border:rgba(255,255,255,0.08);
    --border-soft:rgba(255,255,255,0.05);
    --text:#edecf5;
    --text-muted:rgba(237,236,245,0.5);
    --text-faint:rgba(237,236,245,0.3);
    --accent-1:#7c5cff;
    --font-ui:'Poppins',sans-serif;
    --font-mono:'JetBrains Mono',monospace;
    color-scheme:dark;
}

html.light{
    --bg:#f7f7fa;
    --surface:#ffffff;
    --surface-2:#f0f0f4;
    --surface-3:#e8e8ee;
    --border:rgba(10,11,15,0.08);
    --border-soft:rgba(10,11,15,0.05);
    --text:#14151a;
    --text-muted:rgba(20,21,26,0.55);
    --text-faint:rgba(20,21,26,0.35);
    --accent-1:#7c5cff;
    color-scheme:light;
}

html,body{
    height:100%;
}

body{
    display:flex;
    font-family:var(--font-ui);
    font-size:14px;
    color:var(--text);
    background-color:var(--bg);
    overflow:hidden;
}

svg[data-lucide]{
    width:18px;
    height:18px;
    stroke-width:2;
    flex-shrink:0;
    display:block;
}

.prompt-overlay{
    position:fixed;
    inset:0;
    z-index:1000;
    display:flex;
    align-items:center;
    justify-content:center;
    background:rgba(0,0,0,0.55);
    backdrop-filter:blur(4px);
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:opacity 0.18s ease,visibility 0.18s ease;
}

.prompt-overlay.active{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
}

.prompt-box{
    position:relative;
    width:min(420px,calc(100vw - 32px));
    padding:24px;
    background:var(--surface);
    border:1px solid var(--border);
    border-top:3px solid var(--accent-1);
    border-radius:12px;
    box-shadow:0 20px 60px rgba(0,0,0,0.45),0 0 0 1px rgba(255,255,255,0.02);
    transform:translateY(8px) scale(0.98);
    transition:transform 0.18s ease;
}

.prompt-overlay.active .prompt-box{
    transform:translateY(0) scale(1);
}

.prompt-close{
    position:absolute;
    top:12px;
    right:12px;
    display:flex;
    align-items:center;
    justify-content:center;
    width:28px;
    height:28px;
    padding:0;
    border:none;
    border-radius:7px;
    background:transparent;
    color:var(--text-faint);
    cursor:pointer;
    transition:background 0.15s ease,color 0.15s ease;
}

.prompt-close:hover{
    background:var(--surface-2);
    color:var(--text);
}

.prompt-close svg{
    width:16px;
    height:16px;
}

.prompt-title{
    padding-right:32px;
    font-size:17px;
    font-weight:600;
    color:var(--text);
}

.prompt-description{
    margin-top:6px;
    font-size:12.5px;
    line-height:1.5;
    color:var(--text-muted);
}

.prompt-input{
    width:100%;
    height:36px;
    margin-top:18px;
    padding:0 11px;
    border:1px solid var(--border);
    border-radius:7px;
    outline:none;
    background:var(--surface-3);
    color:var(--text);
    font-family:var(--font-ui);
    font-size:12.5px;
    transition:border-color 0.15s ease,box-shadow 0.15s ease;
}

.prompt-input:focus{
    border-color:var(--accent-1);
    box-shadow:0 0 0 3px rgba(124,92,255,0.15);
}

.prompt-input::placeholder{
    color:var(--text-faint);
}

.prompt-submit{
    width:100%;
    height:36px;
    margin-top:10px;
    border:none;
    border-radius:7px;
    background:var(--accent-1);
    color:white;
    font-family:var(--font-ui);
    font-size:12.5px;
    font-weight:500;
    cursor:pointer;
    transition:opacity 0.15s ease,transform 0.15s ease;
}

.prompt-submit:hover{
    opacity:0.9;
}

.prompt-submit:active{
    transform:scale(0.98);
}