:root {
    --hoiku-action-background: #206a56;
}

.annual-plan {
    color-scheme: light;
    --ink: #1a332e;
    --muted: #4d6860;
    --paper: #fff;
    --line: #dbe7de;
    --accent: var(--hoiku-action-background);
    --tint: #e8f3eb;
    font-size: 15px;
    line-height: 1.65;
    border: 1px solid var(--line);
    border-radius: 16px;
    overflow: hidden;
    color: var(--ink);
    background: #fbfcf8;
}
.annual-plan * { box-sizing: border-box; }
.annual-plan h1, .annual-plan h2, .annual-plan h3, .annual-plan p { margin: 0; }
.annual-plan a { color: var(--accent); }
.annual-plan button, .annual-plan select, .annual-plan textarea { font: inherit; color: inherit; }
.annual-plan :focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.annual-plan .history { display: block; margin-top: 8px; padding: 8px 10px; border-radius: 8px; overflow-wrap: anywhere; }
.annual-plan .history small { display: block; color: var(--muted); }
.annual-plan [aria-current="page"] { background: var(--tint); font-weight: 700; }
.hoiku-sidebar h2, .annual-plan .chat strong, .annual-plan h3 { font-size: 14px; }
.annual-plan .main-area { min-width: 0; }
.annual-plan .workspace--with-plan .main-area { display: grid; grid-template-columns: minmax(250px, .85fr) minmax(0, 1.15fr); }
.annual-plan .chat, .annual-plan .plan { padding: clamp(16px, 3vw, 34px); min-width: 0; }
.annual-plan .chat { display: grid; align-content: start; gap: 22px; }
.annual-plan .periods { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.annual-plan .chat-title { font-size: 20px; font-weight: 600; line-height: 1.4; overflow-wrap: anywhere; }
.hoiku-breadcrumbs { margin-top: 6px; }
.hoiku-breadcrumbs .fi-breadcrumbs-list { flex-wrap: wrap; }
.hoiku-breadcrumbs .fi-breadcrumbs-item-label { overflow-wrap: anywhere; }
.annual-plan .hoiku-breadcrumbs [aria-current="page"] { background: transparent; }
.annual-plan .intro .hoiku-breadcrumbs .fi-breadcrumbs-list { justify-content: center; }
.annual-plan .workspace--with-plan .draft-overview-heading { display: none; }
.annual-plan .badge { border-radius: 20px; padding: 2px 9px; background: var(--tint); color: var(--accent); font-size: 12px; }
.annual-plan .intro { margin-top: 8px; }
.annual-plan h1 { font-size: clamp(23px, 3vw, 32px); line-height: 1.35; letter-spacing: -.025em; }
.annual-plan .intro p, .annual-plan .plan-header p:last-child { margin-top: 8px; }
.annual-plan .muted { color: var(--muted); font-size: 13px; }
.annual-plan .composer { background: var(--paper); border: 1px solid var(--line); padding: 16px; border-radius: 14px; }
.annual-plan select, .annual-plan textarea { border: 1px solid var(--line); background: var(--paper); border-radius: 8px; padding: 7px 10px; }
.fi-main :is(.primary, .document-action, .fi-btn.fi-color-primary, .fi-btn.fi-color-danger):not(.fi-outlined) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: 8px 14px;
    border: 0;
    border-radius: 8px;
    background: var(--hoiku-action-background);
    color: white;
    font-size: .875rem;
    line-height: 1.5rem;
    font-weight: 500;
    text-decoration: none;
    cursor: pointer;
}
.fi-main :is(.primary, .document-action, .fi-btn.fi-color-primary, .fi-btn.fi-color-danger):not(.fi-outlined):not(:disabled):hover {
    background: #195746;
}
.fi-main :is(.primary, .fi-btn.fi-color-primary, .fi-btn.fi-color-danger):not(.fi-outlined):focus-visible {
    outline: 2px solid var(--hoiku-action-background);
    outline-offset: 2px;
}
.annual-plan .plan { background: var(--paper); border-left: 1px solid var(--line); display: grid; gap: 17px; align-content: start; }
.annual-plan .periods a { padding: 5px 10px; border: 1px solid var(--line); border-radius: 8px; text-decoration: none; }
.annual-plan .notice, .annual-plan .status { padding: 9px 12px; border-radius: 8px; font-size: 13px; }
.annual-plan .notice { background: #fcf3df; color: #694916; }
.annual-plan .status { background: var(--tint); color: var(--accent); }
.annual-plan .fields { display: grid; gap: 12px; justify-items: start; }
.annual-plan .fields label { display: block; width: 100%; font-weight: 600; }
.annual-plan .fields textarea { display: block; margin-top: 5px; width: 100%; resize: vertical; font-weight: 400; }
.annual-plan details { border-top: 1px solid var(--line); padding-top: 12px; }
.annual-plan summary { color: var(--accent); cursor: pointer; font-weight: 600; }
.annual-plan details h3 { margin-top: 12px; }
.annual-plan details p { margin-bottom: 6px; }
.annual-plan blockquote { border-left: 3px solid var(--line); margin: 8px 0; padding-left: 12px; }
@media (max-width: 850px) {
    .annual-plan .workspace--with-plan .main-area { grid-template-columns: minmax(0, 1fr); }
    .annual-plan .plan { border-left: 0; border-top: 1px solid var(--line); }
}

.annual-plan input { font: inherit; color: inherit; }
.annual-plan input:not([type="checkbox"]) { border: 1px solid var(--line); background: var(--paper); border-radius: 8px; padding: 7px 10px; }
.annual-plan #annual-plan-input { max-width: 800px; }
.annual-plan #annual-plan-input label input:not([type="checkbox"]),
.annual-plan #annual-plan-input label select { display: block; width: 100%; min-width: 0; margin-top: 5px; }
.annual-plan .input-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 210px), 1fr)); gap: 12px; width: 100%; }
.annual-plan .secondary { display: inline-block; border: 1px solid var(--line); border-radius: 8px; padding: 6px 12px; color: var(--accent); background: var(--paper); text-decoration: none; cursor: pointer; }
.annual-plan [hidden] { display: none !important; }
.annual-plan button:disabled { opacity: .6; cursor: default; }
.annual-plan .record-group { min-width: 0; width: 100%; margin: 0; border: 1px solid var(--line); border-radius: 10px; padding: 12px; }
.annual-plan .record-group legend { padding-inline: 6px; font-weight: 600; }
.annual-plan .record-input { display: grid; gap: 8px; margin-block: 12px; border-bottom: 1px solid var(--line); padding-bottom: 12px; }
.annual-plan .record-input .primary { justify-self: start; }
.annual-plan .fields .consent { display: flex; gap: 8px; align-items: baseline; font-weight: 400; }
.annual-plan .form-errors { margin: 0; padding-left: 32px; }
.annual-plan .preserve-lines { white-space: pre-wrap; overflow-wrap: anywhere; }

.annual-plan .plan-field { width: 100%; min-width: 0; }
.annual-plan .plan-field-heading,
.annual-plan .revision-actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.annual-plan .plan-field-heading label { width: auto; }
.annual-plan .plan-field-heading a { margin-inline-start: auto; font-size: 13px; text-decoration: underline; }
.annual-plan .revision-preview { display: grid; gap: 12px; }
.annual-plan .revision-version { background: var(--tint); border-radius: 8px; padding: 10px 12px; }
.annual-plan .revision-version h3 { margin-bottom: 4px; }
.annual-plan #revision-request { scroll-margin-top: 80px; }
.annual-plan #revision-request select { display: block; margin-top: 5px; }
.annual-plan .task-entry { border-top: 0; padding: 0; }
.annual-plan .task-entry summary { background: var(--tint); border: 1px solid var(--line); border-radius: 10px; padding: 12px 16px; }
.annual-plan .task-entry .composer { margin-top: 12px; }

.fi-main:has(.annual-plan > .workspace:not(.workspace--consultation)) { padding: 0; }
.annual-plan { border: 0; border-radius: 0; background: #fafbfa; }
.annual-plan .workspace { min-height: 100dvh; }
.hoiku-sidebar {
    position: sticky;
    top: 0;
    align-self: flex-start;
    display: flex;
    flex-direction: column;
    flex: 0 0 280px;
    min-width: 0;
    height: 100dvh;
    overflow: hidden;
    border-right: 1px solid var(--line);
    background: var(--paper);
}
.hoiku-sidebar .sidebar-content { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 22px 18px 14px; }
.hoiku-sidebar .sidebar-account { flex: none; padding: 12px 18px 16px; }
.hoiku-sidebar .sidebar-account form { margin-top: 8px; }
@media (max-width: 850px) {
    .hoiku-sidebar { flex-basis: 220px; }
    .hoiku-sidebar .sidebar-content, .hoiku-sidebar .sidebar-account { padding-inline: 14px; }
}
.annual-plan .brand { display: flex; align-items: center; gap: 8px; font-size: 18px; font-weight: 700; color: var(--ink); padding: 4px 8px; }
.annual-plan .brand span { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 9px; background: var(--accent); color: white; }
.hoiku-sidebar .signed-in-account {
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--paper);
    color: var(--ink);
    overflow-wrap: anywhere;
}
.hoiku-sidebar .signed-in-account:hover,
.hoiku-sidebar .signed-in-account[aria-current="page"] { background: var(--tint); }
.hoiku-sidebar .signed-in-account strong,
.hoiku-sidebar .signed-in-account small { display: block; }
.hoiku-sidebar .signed-in-account small { font-size: 12px; color: var(--muted); }
.annual-plan .workspace-menu { display: grid; gap: 6px; padding-block: 16px; margin-bottom: 18px; border-bottom: 1px solid var(--line); }
.annual-plan .workspace-menu a { display: flex; align-items: center; gap: 10px; min-height: 42px; padding: 8px 10px; border-radius: 8px; color: var(--ink); }
.annual-plan .workspace-menu a:hover, .annual-plan .history:hover { background: var(--tint); }
.annual-plan .workspace-menu svg, .annual-plan .task-entry svg { width: 17px; height: 17px; }
.hoiku-sidebar .workspace-menu + .workspace-menu { padding-top: 0; }
.hoiku-sidebar .workspace-menu--management,
.hoiku-sidebar .workspace-menu--account { grid-template-columns: minmax(0, 1fr); padding: 0; margin-bottom: 0; border: 0; }
.hoiku-sidebar .workspace-menu--account { margin-top: 8px; }
.hoiku-sidebar .workspace-menu--management > .workspace-menu-group { border-top: 0; padding-top: 0; }
.hoiku-sidebar .workspace-menu-group--references { border-top: 0; padding-top: 0; }
.hoiku-sidebar .workspace-menu-group > summary {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 42px;
    padding: 8px 10px;
    border-radius: 8px;
    cursor: pointer;
    list-style: none;
}
.hoiku-sidebar .workspace-menu-group > summary::-webkit-details-marker { display: none; }
.hoiku-sidebar .workspace-menu-group > summary:hover,
.hoiku-sidebar .workspace-menu-group[open] > summary { background: var(--tint); }
.hoiku-sidebar .workspace-menu-group .menu-chevron { width: 14px; height: 14px; margin-inline-start: auto; }
.hoiku-sidebar .workspace-menu-group[open] > summary .menu-chevron { transform: rotate(180deg); }
.hoiku-sidebar .workspace-submenu {
    display: grid;
    gap: 2px;
    margin: 4px 0 4px 10px;
    padding-inline-start: 6px;
    border-inline-start: 1px solid var(--line);
}
.hoiku-sidebar .workspace-menu-pending { padding: 8px 10px; color: var(--muted); }
.hoiku-sidebar .workspace-menu-divider { margin: 6px 0; border: 0; border-top: 1px solid var(--line); }
.hoiku-sidebar .workspace-menu-pending small { display: inline-block; margin-inline-start: 2px; font-size: 11px; }
.annual-plan .chat--start { max-width: 790px; margin-inline: auto; padding-top: clamp(36px, 20vh, 180px); }
.annual-plan .chat--start .intro { text-align: center; }
.annual-plan .chat--start:has(details[open].task-entry) { padding-top: 32px; }
.annual-plan .chat--thread { width: 100%; max-width: 790px; margin-inline: auto; }
.annual-plan .workspace--consultation .chat--thread { max-width: 722px; padding-block-start: 0; padding-inline: 0; }
.annual-plan .chat-message {
    --bubble-background: var(--paper);
    display: flex;
    align-items: flex-start;
    justify-self: start;
    gap: 12px;
    min-width: 0;
    max-width: min(100%, 680px);
}
.annual-plan .chat-message--user {
    --bubble-background: var(--tint);
    flex-direction: row-reverse;
    justify-self: end;
    max-width: min(90%, 600px);
}
.annual-plan .chat-avatar {
    display: grid;
    place-items: center;
    flex: 0 0 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--accent);
    color: white;
    font-size: 15px;
    font-weight: 700;
}
.annual-plan .chat-message--user .chat-avatar {
    background: var(--paper);
    color: var(--accent);
    border: 1px solid var(--line);
}
.annual-plan .chat-avatar svg { width: 17px; height: 17px; }
.annual-plan .chat-message-content { min-width: 0; }
.annual-plan .chat-message-time {
    display: block;
    margin-top: 4px;
    padding-inline: 4px;
    color: var(--muted);
    font-size: 12px;
}
.annual-plan .chat-message--user .chat-message-time { text-align: right; }
.annual-plan .chat-bubble {
    position: relative;
    isolation: isolate;
    min-width: 0;
    padding: 12px 15px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: var(--bubble-background);
}
.annual-plan .chat-bubble::before {
    content: "";
    position: absolute;
    z-index: -1;
    top: 10px;
    left: -5px;
    width: 8px;
    height: 8px;
    transform: rotate(45deg);
    border-left: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    background: var(--bubble-background);
}
.annual-plan .chat-message--user .chat-bubble::before {
    right: -5px;
    left: auto;
    transform: rotate(225deg);
}
.annual-plan .chat-bubble strong { display: block; color: var(--accent); font-size: 13px; }
.annual-plan .chat-bubble p { margin-top: 4px; }
.annual-plan .start-composer { width: 100%; }
.annual-plan .task-entry summary { display: inline-flex; gap: 7px; align-items: center; padding: 6px 12px; background: var(--paper); border-radius: 999px; }
.annual-plan .document-card { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 16px; padding: clamp(16px, 3vw, 24px); border: 1px solid var(--line); border-radius: 16px; background: var(--paper); }
.annual-plan .document-card:hover { border-color: var(--accent); }
.annual-plan .document-details { min-width: 0; overflow-wrap: anywhere; }
.annual-plan .document-details strong { display: block; margin-bottom: 4px; color: var(--ink); font-size: 19px; line-height: 1.4; }
.annual-plan .document-card small { display: block; color: var(--muted); }
.annual-plan .document-icon { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 11px; background: var(--tint); }
.annual-plan .document-icon svg { width: 22px; height: 22px; }
.annual-plan .document-action { justify-self: start; white-space: nowrap; }
.annual-plan .workspace--with-plan .document-card { grid-template-columns: auto minmax(0, 1fr); }
.annual-plan .workspace--with-plan .document-action { grid-column: 2; }
.annual-plan .plan-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-bottom: 8px; border-bottom: 1px solid var(--line); }
.annual-plan .plan-toolbar a { font-size: 23px; line-height: 1; padding: 4px 8px; }
.annual-plan .plan-field > [data-revision-slot]:not(:empty) { margin-block: 8px; }
@media (max-width: 540px) {
    .annual-plan .document-card { grid-template-columns: auto minmax(0, 1fr); }
    .annual-plan .document-action { grid-column: 2; }
    .fi-layout:has(> .hoiku-sidebar) { display: block; }
    .hoiku-sidebar { position: static; height: auto; overflow: visible; border: 0; border-bottom: 1px solid var(--line); }
    .hoiku-sidebar .sidebar-content { overflow: visible; padding-top: 14px; }
    .annual-plan .workspace-menu { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-bottom: 8px; padding-block: 6px; }
    .hoiku-sidebar .workspace-menu.workspace-menu--management,
    .hoiku-sidebar .workspace-menu.workspace-menu--account { grid-template-columns: minmax(0, 1fr); margin-bottom: 0; padding-block: 0; }
    .annual-plan .chat--start { padding-top: 26px; }
}

.plan-list-filters { display: flex; align-items: end; flex-wrap: wrap; gap: 12px; }
.plan-list-filters label { display: grid; gap: 4px; font-size: 14px; }
.plan-list-filters .fi-input { width: 100%; border: 1px solid #dbe7de; border-radius: 8px; padding: 8px 10px; }
.plan-list-filters input[name="year"] { max-width: 11ch; }
.plan-list-results { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; }
.plan-list-table { overflow-x: auto; border: 1px solid #dbe7de; border-radius: 10px; background: white; }
.plan-list-table table { width: 100%; min-width: 680px; border-collapse: collapse; text-align: start; }
.plan-list-results, .plan-list-table table, .annual-plan .api-usage, .annual-plan .usage-table table, .annual-plan .system-settings {
    font-size: .875rem;
    line-height: 1.5rem;
}
.consultation-list-table table { min-width: 0; }
.consultation-list-table thead th:first-child { width: 72%; }
.consultation-delete-modal .fi-modal-content { white-space: normal; overflow-wrap: anywhere; }
.consultation-delete-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 8px; }
.annual-plan .consultation-back { justify-self: start; }
.plan-list-table th, .plan-list-table td { padding: 12px 16px; text-align: start; }
.plan-list-table thead { background: #eef5ef; color: #36574d; }
.plan-list-table .plan-list-class { width: 32%; }
.plan-list-table tbody tr { border-top: 1px solid #dbe7de; }
.plan-list-table tbody tr:hover { background: #f6faf7; }
.plan-list-table tbody th { color: #1a332e; font-weight: 600; overflow-wrap: anywhere; }
.plan-list-table td, .plan-list-table thead th { white-space: nowrap; }
.plan-list-table tbody th a:hover { text-decoration: underline; }
.plan-list-pages { display: flex; gap: 12px; align-items: center; }
.plan-list-filters a, .plan-list-pages a { color: #206a56; text-decoration: underline; }

.annual-plan .hoiku-chat-form { width: 100%; display: grid; gap: 6px; }
.annual-plan .hoiku-chat-box { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; padding: 12px; background: var(--paper); border: 1px solid var(--line); border-radius: 16px; }
.annual-plan .hoiku-chat-box > label { font-weight: 600; }
.annual-plan .hoiku-chat-options { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 8px; }
.annual-plan .hoiku-chat-box textarea { min-width: 0; width: 100%; resize: vertical; scroll-margin-top: 24px; }
.annual-plan .hoiku-chat-waiting { display: flex; justify-content: flex-end; align-items: center; gap: 8px; color: var(--accent); font-size: 13px; }
.annual-plan .hoiku-chat-waiting:empty { position: absolute; }
.annual-plan .hoiku-chat-waiting:not(:empty)::before {
    content: "";
    width: 14px;
    height: 14px;
    border: 2px solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    animation: hoiku-chat-spin .8s linear infinite;
}
@keyframes hoiku-chat-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
    .annual-plan .hoiku-chat-waiting::before { animation: none; }
}

.annual-plan .api-usage { display: grid; align-content: start; gap: 14px; min-width: 0; }
.annual-plan .system-settings { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.annual-plan .system-settings p { flex-basis: 100%; }
.annual-plan .usage-table { overflow-x: auto; background: var(--paper); border: 1px solid var(--line); border-radius: 10px; }
.annual-plan .usage-table table { width: 100%; border-collapse: collapse; text-align: left; }
.annual-plan .usage-table th, .annual-plan .usage-table td { padding: 10px 12px; border-bottom: 1px solid var(--line); white-space: nowrap; }
.annual-plan .usage-table th { background: var(--tint); }
.annual-plan .usage-table tr:last-child td { border-bottom: 0; }
.annual-plan .usage-pages { display: flex; align-items: center; gap: 12px; }
.annual-plan .api-usage a { text-decoration: underline; }