:root {
    color-scheme: light;
    --ink: #15241f;
    --muted: #67746e;
    --paper: #f5f2e9;
    --panel: #fffdf8;
    --line: #d9ded8;
    --green: #176b52;
    --green-dark: #0e4d3b;
    --red: #a33b31;
}

.admin-container { max-width: 1440px; }
.spec-document { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; font: 15px/1.75 ui-monospace, SFMono-Regular, Consolas, monospace; }
.admin-query-form { display: grid; gap: 12px; }
.admin-query-form textarea { min-height: 180px; resize: vertical; font: 14px/1.55 ui-monospace, SFMono-Regular, Consolas, monospace; }
.admin-query-form .form-actions { justify-content: flex-end; }
.admin-shell { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 24px; align-items: start; margin-top: 28px; }
.admin-sidebar { position: sticky; top: 24px; display: grid; gap: 8px; padding: 14px; border: 1px solid var(--line); border-radius: 12px; background: var(--panel); }
.admin-sidebar a { display: block; padding: 12px 14px; border-radius: 8px; color: var(--ink); text-decoration: none; font-weight: 700; }
.admin-sidebar a:hover { background: #edf4ef; }
.admin-sidebar a.active { color: white; background: var(--green); }
.admin-content { min-width: 0; }
.admin-content > .panel:first-child { margin-top: 0; }
.admin-user-search { display: grid; gap: 10px; }
.admin-user-search .search-row { display: flex; gap: 10px; align-items: center; }
.admin-user-search .search-row input { flex: 1; min-width: 180px; }
.admin-users-table input[name="membershipExpiryDate"] { min-width: 125px; width: 125px; }
.admin-users-table select { min-width: 145px; }
.admin-users-table .button { white-space: nowrap; }
.user-id { display: block; margin-top: 4px; color: var(--muted); font-size: 11px; overflow-wrap: anywhere; }
.entry-form input::placeholder { color: #aa8d6f; opacity: 1; }
@media (max-width: 760px) {
    .admin-shell { grid-template-columns: 1fr; }
    .admin-sidebar { position: static; grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .admin-sidebar a { text-align: center; }
    .admin-user-search .search-row { align-items: stretch; flex-direction: column; }
}
* { box-sizing: border-box; }
body {
    margin: 0;
    color: var(--ink);
    background: radial-gradient(circle at top right, #dcebdc, transparent 34rem), var(--paper);
    font-family: "Noto Sans TC", "Microsoft JhengHei", sans-serif;
    -webkit-text-size-adjust: 100%;
}
.container { width: min(1180px, calc(100% - 32px)); margin: 0 auto; padding: 48px 0; }
header, .list-heading, footer { display: flex; justify-content: space-between; align-items: center; gap: 24px; }
h1 { margin: 2px 0 8px; font-family: Georgia, "Noto Serif TC", serif; font-size: clamp(2rem, 5vw, 3.8rem); }
h2 { margin: 0 0 22px; font-size: 1.2rem; }
.eyebrow { color: var(--green); letter-spacing: .24em; font-size: .75rem; font-weight: 800; }
.subtitle, footer { color: var(--muted); }
.investment-reminder {
    margin-top: 24px; padding: 12px 16px; border: 1px solid #e3cf9a; border-radius: 10px;
    color: #654d17; background: #fff8e6; font-size: .9rem; line-height: 1.7;
}
.investment-reminder strong { color: #765811; }
.button {
    display: inline-flex; align-items: center; justify-content: center; min-height: 42px;
    padding: 0 18px; border: 1px solid var(--green); border-radius: 8px;
    color: white; background: var(--green); text-decoration: none; cursor: pointer; font-weight: 700;
}
.button:hover { background: var(--green-dark); }
.button.secondary { color: var(--green); background: transparent; }
.summary-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin: 34px 0 18px; }
.summary-grid article, .panel { border: 1px solid var(--line); border-radius: 14px; background: rgba(255,253,248,.94); box-shadow: 0 8px 28px rgba(30,50,42,.05); }
.summary-grid article { padding: 20px; }
.summary-grid span, td small { display: block; color: var(--muted); font-size: .78rem; margin-bottom: 7px; }
.summary-grid strong { font-size: 1.35rem; }
.panel { padding: 26px; margin-bottom: 18px; }
.entry-form { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; }
label { display: grid; gap: 7px; color: var(--muted); font-size: .82rem; font-weight: 700; }
input, select {
    width: 100%; min-height: 42px; padding: 9px 11px; border: 1px solid #c8d0ca;
    border-radius: 7px; color: var(--ink); background: white; font: inherit;
}
input:focus, select:focus { outline: 2px solid #a8cfbf; border-color: var(--green); }
.wide { grid-column: span 4; }
.form-actions { display: flex; align-items: end; }
.list-heading h2 { margin-bottom: 0; }
.search { display: flex; align-items: center; gap: 8px; }
.search a { color: var(--muted); font-size: .85rem; }
.table-wrap {
    max-width: 100%; overflow-x: auto; margin-top: 20px;
    -webkit-overflow-scrolling: touch; overscroll-behavior-inline: contain;
}
table { width: 100%; border-collapse: collapse; white-space: nowrap; }
th, td { padding: 13px 10px; border-bottom: 1px solid var(--line); text-align: left; font-size: .9rem; }
th { color: var(--muted); font-size: .75rem; text-transform: uppercase; }
.number { text-align: right; font-variant-numeric: tabular-nums; }
.tag { display: inline-block; border-radius: 999px; padding: 4px 9px; color: var(--green-dark); background: #dcefe7; font-size: .78rem; font-weight: 700; }
.tag.sell { color: var(--red); background: #f4dfdc; }
.tag.cash_dividend, .tag.stock_dividend { color: #765811; background: #f4e8c5; }
.delete { border: 0; color: var(--red); background: transparent; cursor: pointer; font: inherit; }
.row-edit-input { width:96px; min-height:34px; padding:5px 7px; text-align:right; }
.numeric-input { text-align:right; font-variant-numeric:tabular-nums; }
.row-static-value { display:inline-block; width:96px; min-height:34px; padding:5px 7px; text-align:right; }
.row-edit-input[readonly] { border-color:transparent; background:transparent; pointer-events:none; }
.editing .row-edit-input { border-color:#83b5a1; background:white; outline:2px solid #d8ebe3; }
.action-cell { min-width:112px; text-align:right; }
.row-actions { display:inline-flex; align-items:center; justify-content:flex-end; gap:9px; }
.row-actions form { display:inline; margin:0; }
.edit-link { color:var(--green); text-decoration:none; font-weight:700; }
.edit-link:hover { text-decoration:underline; }
.edit-placeholder { visibility:hidden; font-weight:700; }
.auth-page { min-height:100vh; display:grid; place-items:center; padding:24px; }
.auth-card { width:min(430px,100%); padding:36px; border:1px solid var(--line); border-radius:18px; background:var(--panel); box-shadow:0 18px 55px rgba(30,50,42,.12); }
.auth-card h1 { margin-bottom:8px; font-size:2.3rem; }
.auth-form { display:grid; gap:18px; margin-top:26px; }
.auth-form .button { width:100%; margin-top:4px; }
.auth-form small { color:var(--muted); font-weight:400; }
.auth-link { margin:22px 0 0; color:var(--muted); text-align:center; }
.auth-link a { color:var(--green); font-weight:700; }
.notice { padding:11px 13px; border-radius:8px; font-size:.9rem; }
.notice.error { color:#8f1d18; background:#fde8e7; }
.notice.success { color:#126348; background:#e5f5ee; }
.account-actions { display:flex; align-items:center; justify-content:flex-end; gap:12px; flex-wrap:wrap; }
.account-actions form { margin:0; }
.member-name { color:var(--muted); font-weight:700; }
.account-link { color:var(--green); text-decoration:none; font-weight:700; }
.account-link:hover { text-decoration:underline; }
.logout-link { border:0; padding:8px 2px; color:var(--red); background:transparent; cursor:pointer; font:inherit; font-weight:700; }
.empty { padding: 42px; color: var(--muted); text-align: center; }
footer { padding: 12px 4px; font-size: .75rem; }
footer a { color: var(--green); }
.section-intro { display:flex; justify-content:space-between; align-items:flex-start; gap:20px; margin-bottom:22px; }
.section-intro h2, .list-heading h2 { margin:2px 0 0; }
.hint { color:var(--muted); font-size:.78rem; }
.calculated { color:var(--green-dark); background:#edf5f1; font-weight:800; font-variant-numeric:tabular-nums; }
.total-field { border-color:#83b5a1; }
.stock-link { color:var(--green); font-weight:800; text-decoration:none; border-bottom:1px solid #9bc5b5; }
.stock-link:hover { color:var(--green-dark); border-bottom-color:var(--green-dark); }
.compact-panel { padding-top:22px; }
.export-container { max-width:680px; }
.export-panel { padding:34px; }
.export-panel h1 { margin-bottom:8px; font-size:2.5rem; }
.export-form { display:grid; gap:20px; margin-top:28px; }
.export-form .button { justify-self:start; }
.custom-date-range { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.custom-date-range[hidden] { display:none; }
.upcoming-panel { margin-top:24px; }
.upcoming-panel td:nth-child(2) small { max-width:9em; white-space:normal; }
.breadcrumb { margin-bottom:24px; }
.breadcrumb a { color:var(--green); text-decoration:none; font-weight:700; }
.gain { color:#0057b8 !important; font-weight:800; }
.loss { color:#d00000 !important; font-weight:800; }
.portfolio-table tbody tr:nth-child(odd) > td { background:#eef8f3; }
.portfolio-table tbody tr:nth-child(even) > td { background:#eef3fb; }
.portfolio-table tbody tr:hover > td { background:#e1eee8; }
.portfolio-table th:first-child, .portfolio-table td:first-child { width:5.2em; min-width:5.2em; max-width:5.2em; }
.portfolio-table td:first-child small {
    width:4em; margin-top:5px; white-space:normal; line-height:1.45;
    overflow-wrap:anywhere; word-break:break-all;
}
@media (max-width: 850px) {
    header, .list-heading { align-items: flex-start; flex-direction: column; }
    header .account-actions { width:100%; justify-content:flex-start; }
    .summary-grid { grid-template-columns: repeat(2, 1fr); }
    .entry-form { grid-template-columns: repeat(2, 1fr); }
    .wide { grid-column: span 2; }
    .section-intro { flex-direction:column; }
}
@media (max-width: 600px) {
    .container { width:min(100% - 20px, 1180px); padding:20px 0 28px; }
    header, .list-heading { gap:16px; }
    h1 { font-size:clamp(1.8rem, 10vw, 2.5rem); line-height:1.15; }
    h2 { margin-bottom:16px; }
    .subtitle { margin-top:6px; line-height:1.55; }
    .panel { padding:18px 14px; border-radius:12px; }
    .summary-grid, .entry-form { grid-template-columns: 1fr; }
    .summary-grid { gap:10px; margin:22px 0 14px; }
    .summary-grid article { min-width:0; padding:15px; }
    .summary-grid strong { font-size:1.15rem; overflow-wrap:anywhere; }
    .entry-form { gap:13px; }
    .entry-form > label { min-width:0; }
    .entry-form input[type="date"] {
        width:calc(100% - 18px); min-width:0; max-width:calc(100% - 18px);
        justify-self:start;
    }
    .wide { grid-column: span 1; }
    input, select { min-height:46px; font-size:16px; }
    .button { min-height:46px; padding-inline:16px; }
    .form-actions, .form-actions .button { width:100%; }
    .search { display:grid; grid-template-columns:minmax(0, 1fr) auto; width:100%; }
    .search a { grid-column:1 / -1; justify-self:start; padding:6px 0; }
    .account-actions { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); width:100%; gap:8px 12px; }
    .account-actions .member-name { grid-column:1 / -1; }
    .account-actions .button, .account-actions .account-link,
    .account-actions form, .account-actions .logout-link { width:100%; text-align:center; }
    .account-actions .account-link, .logout-link { display:flex; min-height:44px; align-items:center; justify-content:center; }
    .table-wrap { margin:16px -14px 0; padding:0 14px 8px; scrollbar-width:thin; }
    .table-wrap::after { content:"左右滑動查看完整表格"; position:sticky; left:0; display:block; width:max-content; margin-top:8px; color:var(--muted); font-size:.72rem; }
    th, td { padding:12px 9px; }
    .portfolio-table th, .portfolio-table td { padding-left:6px; padding-right:6px; }
    .portfolio-table th:first-child, .portfolio-table td:first-child { width:4.7em; min-width:4.7em; max-width:4.7em; }
    .portfolio-table th:nth-child(2), .portfolio-table td:nth-child(2) { width:4.8em; min-width:4.8em; }
    .portfolio-table th:nth-child(3), .portfolio-table td:nth-child(3) { width:4.4em; min-width:4.4em; }
    .portfolio-table th:nth-child(4), .portfolio-table td:nth-child(4) { width:5.7em; min-width:5.7em; }
    .row-edit-input, .row-static-value { width:84px; }
    .row-actions { gap:4px; }
    .edit-link, .delete { display:inline-flex; min-height:44px; padding:0 6px; align-items:center; justify-content:center; }
    .empty { padding:30px 12px; white-space:normal; }
    footer { align-items: flex-start; flex-direction: column; }
    .auth-page { align-items:start; padding:14px 10px; }
    .auth-card { padding:26px 18px; border-radius:14px; }
    .auth-card h1 { font-size:2rem; }
    .auth-form { gap:15px; margin-top:22px; }
}
.pagination { display:flex; align-items:center; justify-content:center; gap:12px; margin-top:18px; }
.pagination .button { width:auto; }