.home-journey { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-bottom: 26px; font-size: .85rem; }.home-journey a { color: var(--text); text-decoration: none; }.home-journey > span { color: var(--muted); }
.ai-directory-note,.ai-description { color: var(--muted); font-size: .8rem; line-height: 1.7; }.ai-card form > .button { width: 100%; }
.home-ai-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,220px),1fr)); gap: 14px; margin-top: 14px; }
.home-ai-card { padding: 16px; min-height: 0; background: #0e1f31; border: 1px solid var(--line); border-radius: 18px; }.home-ai-card > header { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 14px; }.home-ai-card:has(input:checked) { border-color: #5ad1e1; background: #143346; }
.home-ai-choice { display: flex; gap: 10px; align-items: center; cursor: pointer; }.home-ai-choice input { width: 18px; height: 18px; min-height: 18px; accent-color: #6bdeeb; }.home-ai-card > form > .button { width: 100%; }
.home-ai-empty { padding: 24px; border: 1px dashed #547a8d; border-radius: 16px; text-align: center; }.home-api-controls { margin-top: 12px; font-size: .75rem; }.home-api-controls summary { cursor: pointer; padding: 8px 0; }.home-api-controls .operation-grid { display: flex; flex-wrap: wrap; margin-top: 12px; }.home-api-controls .operation-grid > * { flex: 1; }
.home-use-grid { display: grid; grid-template-columns: minmax(0,1fr); gap: 22px; align-items: start; margin-top: 24px; }.home-use-grid:has(.home-ai-workspace:not([hidden])) { grid-template-columns: minmax(310px,.8fr) minmax(0,1.2fr); }
.home-use-grid .received-code-panel { margin: 0; min-width: 0; }.home-input-tools { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }.home-input-tools .button { font-size: .75rem; }.home-use-grid .received-code-panel > header { flex-wrap: wrap; gap: 12px; }.home-use-grid .received-code-item { flex-wrap: wrap; }.home-use-grid .received-code-main { min-width: 0; flex: 1 1 220px; }
.home-use-grid .received-code-actions { flex-wrap: wrap; gap: 8px; }.home-use-grid .received-code-actions .home-copy-button { min-width: 90px; padding: 8px 12px; font-size: .8rem; color: #c8fbff; border: 1px solid #4f9eaf; background: #163646; border-radius: 10px; }
.home-use-grid .received-code-item { display: flex; flex-wrap: wrap; }
.home-use-grid .received-code-main { flex: 1 1 280px; width: 100%; }
.home-use-grid .received-code-list { max-height: 65vh; }
.home-use-grid .received-code-select > span { flex-wrap: wrap; gap: 6px; }
.home-use-grid .received-code-actions { margin-inline-start: auto; }
.home-ai-workspace { min-width: 0; position: sticky; top: 90px; border: 1px solid #496a84; background: #101d30; border-radius: 20px; padding: 18px; }.home-ai-workspace[hidden] { display: none; }.home-ai-workspace h2 { font-size: 1.1rem; }.home-ai-workspace iframe { display: block; margin-top: 12px; width: 100%; height: max(420px,65vh); border: 0; border-radius: 12px; background: #fff; }
[data-home-workspace-status] { font-size: .82rem; }[data-home-workspace-status][data-kind=error] { color: #ffb6ac; }
.input-mode-picker,.guide-links { display: flex; flex-wrap: wrap; gap: 12px; margin: 18px 0; }.input-mode-picker a { padding: 10px 18px; border: 1px solid var(--line); border-radius: 30px; text-decoration: none; }.input-mode-picker a[aria-current] { background: #1b4859; color: #bdf7ff; border-color: #63c6d5; }
.text-input-page,.ai-guide { width: min(100%,1000px); margin: 0 auto; }.text-input-form { display: grid; gap: 16px; }.text-input-form label { display: grid; gap: 8px; }.text-input-form input,.text-input-form textarea { width: 100%; min-width: 0; }.text-input-form textarea { resize: vertical; min-height: 280px; line-height: 1.8; }.text-input-form .errorlist { color: #ffb5a7; }
.guide-starters,.feature-note-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,260px),1fr)); gap: 16px; margin: 20px 0; }.guide-starter,.feature-note { padding: 22px; border: 1px solid var(--line); border-radius: 18px; background: #112436; text-decoration: none; }.guide-starter { display: grid; gap: 12px; color: var(--text); }.guide-starter b { font-size: 2rem; color: #81d8e7; }.guide-starter small { color: var(--muted); }
.guide-check { margin: 36px 0; padding: 24px; border: 1px solid var(--line); border-radius: 20px; }.guide-check label { display: flex; align-items: center; gap: 12px; margin: 14px 0; }.guide-check input { width: 22px; height: 22px; min-height: 22px; accent-color: #75d7d2; }.guide-check .button { margin-top: 12px; }.feature-note h3 { font-size: 1rem; margin: 10px 0; }.feature-note p { font-size: .85rem; line-height: 1.7; }.feature-note time,.feature-note small { color: var(--muted); font-size: .73rem; }.feature-note a { color: #86deea; }.feature-note .stale { color: #ffd38e; }
@media(max-width:950px) { .home-use-grid:has(.home-ai-workspace:not([hidden])) { grid-template-columns: minmax(0,1fr); }.home-ai-workspace { position: static; }.home-ai-workspace iframe { height: 60vh; } }
