/* The warm, rounded connection language applied to visitor-facing controls. */
:root[data-theme]{--soft-card:#fffaf0;--soft-stroke:#dedfd4;--soft-shadow:0 12px 32px #30250012,0 2px 6px #3025000c}
:root[data-theme=dark]{--soft-card:#22261d;--soft-stroke:#4b5042;--soft-shadow:0 14px 32px #0004,0 2px 6px #0003}
:root[data-theme] .site-header :is(.account-link,.lang-button,.theme-toggle){border-radius:12px;transition:background .2s ease,transform .2s ease,box-shadow .2s ease}
:root[data-theme] .site-header :is(.account-link,.lang-button,.theme-toggle):hover{transform:translateY(-2px);box-shadow:0 5px 12px #30250017}
:root[data-theme] .site-header .account-link{background:var(--soft-card);border-color:var(--soft-stroke)}
:root[data-theme] .site-header .account-link:hover{background:var(--theme-soft);color:var(--theme-heading)}
:root[data-theme] .site-header .lang-button{border-color:var(--yellow);background:var(--yellow);color:var(--ink)}
:root[data-theme] .site-header .theme-toggle{background:var(--soft-card);border-color:var(--soft-stroke)}
:root[data-theme] .button{border-radius:var(--radius-md,14px);transition:transform var(--motion-fast,.2s) ease,box-shadow var(--motion-fast,.2s) ease,background var(--motion-fast,.2s) ease}
:root[data-theme] .button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 7px 17px #3025001b}
:root[data-theme] .create-form-panel textarea,:root[data-theme] .create-form-panel select{border-radius:15px;border:1px solid var(--theme-input-line);background:var(--theme-raised);box-shadow:inset 0 1px 2px #1111}
:root[data-theme] .create-form-panel textarea{padding:17px 18px;min-height:155px}
:root[data-theme] .create-form-panel textarea:focus-visible{background:var(--soft-card)}
:root[data-theme] .generation-mode{gap:10px}
:root[data-theme] .generation-mode label{border:1px solid var(--soft-stroke);border-radius:15px;background:var(--soft-card);padding:14px 16px;min-height:60px;transition:transform .18s ease,border-color .18s ease,background .18s ease,box-shadow .18s ease}
:root[data-theme] .generation-mode label:has(input:checked)::after{content:'✦';margin-left:auto;color:var(--theme-heading);font-size:19px;line-height:1;transition:transform .25s ease}
:root[data-theme] .generation-mode label:has(input:checked):hover::after{transform:rotate(20deg) scale(1.15)}
:root[data-theme] .generation-mode label:hover{transform:translateY(-2px);border-color:var(--theme-strong);box-shadow:var(--soft-shadow)}
:root[data-theme] .generation-mode label:has(input:checked){border:2px solid var(--theme-strong);background:var(--theme-soft);padding:13px 15px}
:root[data-theme] .generation-mode input[type=radio]{accent-color:var(--ink)}
:root[data-theme] .generation-cost{border-radius:14px;background:var(--theme-soft);border:1px solid #e8d887}
:root[data-theme=dark] .generation-cost{border-color:#615c31}
:root[data-theme] .generated-preview-frame{border:1px solid var(--soft-stroke);border-radius:24px;box-shadow:var(--soft-shadow);background:var(--soft-card)}
:root[data-theme] .generated-empty{background:var(--soft-card);gap:0;overflow:hidden}
:root[data-theme] .generated-empty .empty-master{width:min(80%,390px);height:auto;max-height:80%;object-fit:contain;opacity:1;filter:drop-shadow(0 12px 8px #30250012)}
:root[data-theme] .generated-empty .empty-master{transition:transform .45s cubic-bezier(.2,1,.3,1)}
:root[data-theme] .generated-preview-frame:hover .empty-master{transform:translateY(-5px) rotate(-2deg)}
:root[data-theme] .generated-empty>p{margin-top:-6px!important;color:var(--theme-heading);font-size:16px;letter-spacing:.01em}
:root[data-theme] .generated-thumb{border-radius:12px;border:1px solid var(--soft-stroke)}
:root[data-theme] .generated-thumb.is-active{outline:3px solid var(--yellow)}
:root[data-theme] .poster-cta{border-radius:13px;padding-inline:24px}
:root[data-theme] .poster-cta::after{content:'✦';display:inline-block;margin-left:10px;font-size:15px;transition:transform .3s cubic-bezier(.2,1,.3,1)}
:root[data-theme] .poster-cta:hover::after{transform:rotate(70deg) scale(1.3)}
:root[data-theme] .showcase-section{padding:clamp(34px,4vw,62px) max(20px,4vw);justify-content:flex-start}
:root[data-theme] .showcase-heading{margin-bottom:22px}
:root[data-theme] .showcase-heading h2{font-size:clamp(52px,5vw,78px)}
:root[data-theme] .showcase-grid{grid-template-columns:repeat(7,minmax(0,1fr));gap:10px}
:root[data-theme] .showcase-grid .art-frame{border-radius:16px;box-shadow:0 7px 18px #30250012}
:root[data-theme] .showcase-grid .art-frame::after{border-radius:12px}
:root[data-theme] .showcase-grid img{width:100%;height:100%;object-fit:cover;object-position:center}
.hero-sparkle-layer{position:absolute;inset:0;z-index:8;pointer-events:none;overflow:hidden}
.hero-spark{position:absolute;width:28px;height:28px;transform:translate(-50%,-50%);opacity:0;filter:drop-shadow(0 2px 2px #3025003b)}
.hero-spark svg{display:block;width:100%;height:100%;fill:#fff8d8;stroke:#171914;stroke-width:2;stroke-linejoin:round}
@media(max-width:1800px){:root[data-theme] .showcase-grid{grid-template-columns:repeat(6,minmax(0,1fr))}}
@media(max-width:1500px){:root[data-theme] .showcase-grid{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media(max-width:1100px){:root[data-theme] .showcase-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:750px){:root[data-theme] .showcase-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}:root[data-theme] .generated-preview-frame{border-radius:20px}}
@media(max-width:520px){:root[data-theme] .showcase-grid{grid-template-columns:repeat(2,minmax(0,1fr))}:root[data-theme] .showcase-section{padding-inline:16px}}
@media(prefers-reduced-motion:reduce){:root[data-theme] .site-header :is(.account-link,.lang-button,.theme-toggle),:root[data-theme] .button,:root[data-theme] .generation-mode label,:root[data-theme] .generated-empty .empty-master,:root[data-theme] .poster-cta::after{transition:none}:root[data-theme] .site-header :is(.account-link,.lang-button,.theme-toggle):hover,:root[data-theme] .generation-mode label:hover,:root[data-theme] .generated-preview-frame:hover .empty-master,:root[data-theme] .poster-cta:hover::after{transform:none;box-shadow:none}.hero-sparkle-layer{display:none}}