:root {
    --ac-bg: #f5f7f5;
    --ac-surface: #ffffff;
    --ac-primary: #075f54;
    --ac-primary-dark: #044940;
    --ac-accent: #d8eee9;
    --ac-text: #172b2a;
    --ac-muted: #607372;
    --ac-line: #dce5e2;
    --ac-danger: #ad2d2d;
    --ac-shadow: 0 18px 44px rgba(18, 50, 46, .08);
    font-family: Inter, "Segoe UI", Arial, sans-serif;
}

* { box-sizing: border-box; }
.ac-body { margin: 0; background: var(--ac-bg); color: var(--ac-text); font-family: inherit; }
.screen-reader-text { clip: rect(1px, 1px, 1px, 1px); height: 1px; overflow: hidden; position: absolute; width: 1px; }
.ac-brand { align-items: center; color: var(--ac-primary); display: flex; font-size: 1.05rem; font-weight: 700; gap: .65rem; }
.ac-mark { align-items: center; background: var(--ac-primary); border-radius: 12px; color: #fff; display: inline-flex; font-size: .8rem; height: 38px; justify-content: center; letter-spacing: .05em; width: 38px; }
.ac-muted { color: var(--ac-muted); line-height: 1.55; }
.ac-auth-shell { align-items: center; background: radial-gradient(circle at 20% 10%, #d7eee8, transparent 42%), var(--ac-bg); display: flex; justify-content: center; min-height: 100vh; padding: 24px; }
.ac-login-card { background: var(--ac-surface); border: 1px solid var(--ac-line); border-radius: 24px; box-shadow: var(--ac-shadow); max-width: 440px; padding: 38px; width: 100%; }
.ac-login-card h1 { font-size: clamp(1.65rem, 4vw, 2rem); line-height: 1.2; margin: 32px 0 10px; }
.ac-form { display: flex; flex-direction: column; gap: 9px; margin-top: 26px; }
.ac-form label { color: #314745; font-size: .93rem; font-weight: 600; margin-top: 8px; }
.ac-form input:not([type=checkbox]), .ac-form textarea { background: #fff; border: 1px solid #cbd8d4; border-radius: 12px; color: var(--ac-text); font: inherit; padding: 13px 14px; transition: border-color .15s, box-shadow .15s; width: 100%; }
.ac-form textarea { line-height: 1.5; resize: vertical; }
.ac-form input:focus, .ac-form textarea:focus, .ac-search input:focus { border-color: var(--ac-primary); box-shadow: 0 0 0 3px rgba(7, 95, 84, .15); outline: 0; }
.ac-check { align-items: center; display: flex; font-weight: 400 !important; gap: 9px; margin: 10px 0 16px !important; }
.ac-check input { accent-color: var(--ac-primary); height: 17px; width: 17px; }
.ac-button { border: 0; border-radius: 12px; cursor: pointer; font: inherit; font-weight: 650; min-height: 48px; padding: 12px 20px; transition: background .15s, transform .05s; }
.ac-button:active { transform: translateY(1px); }
.ac-button:disabled { cursor: wait; opacity: .65; }
.ac-primary { background: var(--ac-primary); color: #fff; }
.ac-primary:hover { background: var(--ac-primary-dark); }
.ac-secondary { background: var(--ac-accent); color: var(--ac-primary-dark); }
.ac-security { border-top: 1px solid var(--ac-line); color: var(--ac-muted); font-size: .84rem; margin: 28px 0 0; padding-top: 22px; }
.ac-error { background: #fff1f1; border-radius: 9px; color: var(--ac-danger); font-size: .91rem; margin: 10px 0; padding: 11px 13px; }
.ac-app { min-height: 100vh; }
.ac-header { align-items: center; background: var(--ac-surface); border-bottom: 1px solid var(--ac-line); display: flex; height: 72px; justify-content: space-between; padding: 0 clamp(20px, 4vw, 52px); }
.ac-account { align-items: center; color: var(--ac-muted); display: flex; gap: 20px; }
.ac-account a { color: var(--ac-primary); font-weight: 650; text-decoration: none; }
.ac-main { margin: 0 auto; max-width: 1400px; padding: clamp(32px, 5vw, 58px) clamp(18px, 4vw, 46px); }
.ac-eyebrow { color: var(--ac-primary); font-size: .82rem; font-weight: 700; letter-spacing: .12em; margin: 0 0 10px; text-transform: uppercase; }
.ac-hero h1 { font-size: clamp(1.75rem, 4vw, 2.65rem); letter-spacing: -.035em; margin: 0 0 27px; }
.ac-search { display: flex; gap: 12px; max-width: 960px; }
.ac-search input { border: 1px solid var(--ac-line); border-radius: 14px; flex: 1; font: inherit; font-size: 1.04rem; min-height: 54px; padding: 0 18px; }
.ac-notice { background: #edf5ff; border: 1px solid #cfdeee; border-radius: 12px; color: #334d69; margin: 20px 0 0; max-width: 960px; padding: 13px 16px; }
.ac-feedback { color: var(--ac-muted); min-height: 22px; margin: 25px 0 18px; }
.ac-results { display: grid; gap: 22px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ac-panel { background: var(--ac-surface); border: 1px solid var(--ac-line); border-radius: 18px; min-height: 460px; padding: 22px; }
.ac-panel-title { align-items: center; display: flex; justify-content: space-between; }
.ac-panel-title h2 { font-size: 1.18rem; margin: 0; }
.ac-count { background: var(--ac-accent); border-radius: 999px; color: var(--ac-primary-dark); font-size: .86rem; font-weight: 700; padding: 5px 11px; }
.ac-panel-help { color: var(--ac-muted); font-size: .87rem; margin: 9px 0 20px; }
.ac-list { display: flex; flex-direction: column; gap: 12px; }
.ac-empty { border: 1px dashed var(--ac-line); border-radius: 13px; color: var(--ac-muted); padding: 28px 18px; text-align: center; }
.ac-card { background: #fcfdfd; border: 1px solid var(--ac-line); border-radius: 13px; padding: 16px; transition: border-color .15s, background .15s; }
button.ac-card { color: inherit; cursor: pointer; font: inherit; text-align: left; width: 100%; }
button.ac-card:hover { background: #f4faf8; border-color: #afd1c9; }
.ac-card h3 { font-size: 1rem; margin: 0 0 7px; }
.ac-tag { color: var(--ac-primary); display: block; font-size: .79rem; font-weight: 700; margin-bottom: 8px; text-transform: uppercase; }
.ac-card p { color: #425654; font-size: .91rem; line-height: 1.48; margin: 0; }
.ac-card-footer { align-items: center; border-top: 1px solid var(--ac-line); display: flex; gap: 14px; margin-top: 13px; padding-top: 12px; }
.ac-card-footer a { color: var(--ac-primary); font-size: .88rem; font-weight: 650; text-decoration: none; }
.ac-source-note { color: var(--ac-muted); font-size: .8rem; margin-left: auto; }
.ac-thumbs { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 8px; }
.ac-thumbs img { border: 1px solid var(--ac-line); border-radius: 8px; height: 68px; object-fit: cover; width: 68px; }
.ac-modal { inset: 0; position: fixed; z-index: 100000; }
.ac-modal-backdrop { background: rgba(8, 22, 21, .48); inset: 0; position: absolute; }
.ac-editor { background: var(--ac-surface); border-radius: 20px; box-shadow: var(--ac-shadow); left: 50%; max-height: min(90vh, 800px); max-width: 610px; overflow-y: auto; padding: 26px; position: absolute; top: 50%; transform: translate(-50%, -50%); width: calc(100% - 34px); }
.ac-editor-head { align-items: center; cursor: grab; display: flex; gap: 14px; justify-content: space-between; margin: -8px -8px 0; padding: 8px; touch-action: none; user-select: none; }
.ac-editor-head:active { cursor: grabbing; }
.ac-editor-head h2 { font-size: 1.35rem; margin: 0; }
.ac-drag-hint { color: var(--ac-muted); font-size: .8rem; margin-left: auto; }
.ac-popout { background: var(--ac-accent); border: 0; border-radius: 8px; color: var(--ac-primary-dark); cursor: pointer; font: inherit; font-size: .78rem; font-weight: 650; padding: 8px 10px; white-space: nowrap; }
.ac-popout:hover { background: #cae6e0; }
.ac-icon { background: #eef3f2; border: 0; border-radius: 50%; cursor: pointer; font-size: 1.1rem; height: 38px; width: 38px; }
.ac-field-note { color: var(--ac-muted); font-size: .84rem; margin: 0; }
.ac-actions { display: flex; gap: 10px; justify-content: flex-end; margin-top: 18px; }

@media (max-width: 820px) {
    .ac-results { grid-template-columns: 1fr; }
    .ac-search { flex-wrap: wrap; }
    .ac-search input { flex-basis: 100%; }
    .ac-search .ac-button { flex: 1; }
    .ac-header { padding: 0 18px; }
    .ac-account span { display: none; }
    .ac-login-card { padding: 28px 23px; }
    .ac-drag-hint { display: none; }
    .ac-popout { display: none; }
}

.ac-popout-body { background: var(--ac-bg); margin: 0; padding: 14px; }
.ac-popout-body .ac-editor { border-radius: 16px; left: auto; max-height: none; max-width: none; min-height: calc(100vh - 28px); overflow-y: visible; position: static; top: auto; transform: none; width: 100%; }
.ac-popout-body .ac-drag-hint, .ac-popout-body .ac-popout { display: none; }