/* Lucian UX/UI Prompt #006 · MIT License (c) 2026 Seokwoooo · https://lucianlabs.dev/uxui-prompt/#006 */
/* Lucian UX/UI Prompt #039 · MIT License (c) 2026 Seokwoooo · https://lucianlabs.dev/uxui-prompt/#039 */
/* Lucian UX/UI Prompt #044 · MIT License (c) 2026 Seokwoooo · https://lucianlabs.dev/uxui-prompt/#044 */
/* Adaptation: #006 press/ripple only, as previously requested. #039 panels contain real captures. #044 FAQ has content-driven width/height. No simulated subscription or download completion. */
:root{--ux-page:var(--page);--ux-surface:var(--surface);--ux-surface-2:var(--surface-high);--ux-ink:var(--text);--ux-ink-2:var(--secondary);--ux-ink-3:var(--muted);--ux-line:var(--line);--ux-line-2:#ffffff2c;--ux-accent:var(--accent);--ux-accent-ink:#112338;--ux-shadow-strong:#0008;--ux-ease:cubic-bezier(.2,.8,.2,1);--ux-spring:cubic-bezier(.34,1.45,.64,1)}
.ux,.ux *,.ux *::before,.ux *::after{box-sizing:border-box}.ux{font-family:inherit;color:var(--ux-ink);-webkit-font-smoothing:antialiased;letter-spacing:-.01em;-webkit-tap-highlight-color:transparent;word-break:keep-all;overflow-wrap:break-word}:where(.ux) :is(button,input,textarea,select){font:inherit;color:inherit}.ux :focus-visible{outline:2px solid var(--ux-accent);outline-offset:3px}.ux [hidden]{display:none!important}
.u006-ink{position:absolute;z-index:-1;width:20px;height:20px;margin:-10px 0 0 -10px;border-radius:50%;background:var(--c);pointer-events:none;animation:u006-ink .75s var(--ux-ease) forwards}@keyframes u006-ink{from{transform:scale(0);opacity:.5}to{transform:scale(var(--s));opacity:0}}
.u039{position:relative;width:100%;height:auto}.u039-tabs{position:relative;display:flex;max-width:500px;padding:5px;border-radius:999px;background:var(--ux-surface);box-shadow:0 0 0 1px var(--ux-line)}.u039-pill{position:absolute;left:0;top:5px;bottom:5px;width:var(--w,80px);border-radius:999px;background:var(--ux-ink);transform:translateX(var(--x,5px));box-shadow:0 8px 16px -10px var(--ux-shadow-strong);transition:transform .5s var(--ux-spring),width .5s var(--ux-spring);pointer-events:none}.u039-tab{position:relative;flex:1;height:42px;border:0;padding:0 14px;border-radius:999px;background:none;font-size:13px;font-weight:680;color:var(--ux-ink-2);white-space:nowrap;transition:color .35s var(--ux-ease)}.u039-tab[aria-selected=true]{color:var(--ux-page)}.u039-tab:focus-visible{outline:2px solid var(--ux-accent);outline-offset:2px}
.u044{position:relative;width:100%;height:auto;display:flex;flex-direction:column;gap:8px}.u044-it{position:relative;border-radius:20px;background:var(--ux-surface);box-shadow:0 0 0 1px var(--ux-line);transition:background-color .4s var(--ux-ease),box-shadow .5s var(--ux-ease),transform .5s var(--ux-spring)}.u044-it.open{box-shadow:0 0 0 1px var(--ux-line-2),0 22px 40px -22px var(--ux-shadow-strong);transform:translateY(-2px)}.u044-q{position:relative;display:flex;align-items:center;gap:12px;width:100%;min-height:58px;padding:12px 14px 12px 16px;border:0;border-radius:20px;background:none;font-size:14px;font-weight:680;letter-spacing:-.02em;color:var(--ux-ink);text-align:left}.u044-q:focus-visible{outline:2px solid var(--ux-accent);outline-offset:2px}.u044-t{flex:1}.u044-pm{position:relative;width:30px;height:30px;flex:none;border-radius:50%;background:var(--ux-surface-2);box-shadow:none;transition:background-color .35s var(--ux-ease),box-shadow .35s,transform .45s var(--ux-spring)}.u044-q:hover .u044-pm{transform:scale(1.1)}.u044-q:active .u044-pm{transform:scale(.9)}.u044-pm::before,.u044-pm::after{content:"";position:absolute;left:50%;top:50%;width:11px;height:2px;margin:-1px 0 0 -5.5px;border-radius:2px;background:var(--ux-ink);transition:transform .5s var(--ux-spring),background-color .3s}.u044-pm::after{transform:rotate(90deg)}.u044-it.open .u044-pm{background:var(--ux-ink);box-shadow:none}.u044-it.open .u044-pm::before,.u044-it.open .u044-pm::after{background:var(--ux-page)}.u044-it.open .u044-pm::after{transform:rotate(180deg)}.u044-body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .5s var(--ux-ease)}.u044-it.open .u044-body{grid-template-rows:1fr}.u044-body>div{overflow:hidden;min-height:0}.u044-a{padding:0 18px 16px 16px;opacity:0;transform:translateY(-8px);transition:opacity .25s var(--ux-ease),transform .45s var(--ux-spring)}.u044-it.open .u044-a{opacity:1;transform:none;transition-delay:.12s}.u044-a p{margin:0;font-size:13px;line-height:1.75;color:var(--ux-ink-2)}
@media(max-width:700px){.u044-q{font-size:13px}.u044-a p{font-size:12px}.u039-tab{font-size:12px;padding-inline:9px}}
@media(prefers-reduced-motion:reduce){.ux,.ux *,.ux *::before,.ux *::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}