* {
    box-sizing: border-box;
}

.site-header-nav {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 18px;
}

.site-header-home {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    text-decoration: none;
}

.site-header-logo {
    display: block;
    width: 42px;
    height: 42px;
    border-radius: 50%;
}

.site-header-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    min-height: 30px;
    padding: 0 10px;
    color: #7b5d2a;
    background: #f6efe2;
    border: 1px solid #dfcfb4;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
}

.site-header-link:hover {
    background: #f3ead8;
}

/* One shared navigation menu, independent of calculator titles. */
.site-header-nav { flex-wrap: nowrap; position: relative; }
.site-header-home { flex: 0 0 44px; }
.ht-menu { margin-left: auto; position: relative; flex: 0 0 auto; z-index: 1000; }
.ht-menu-toggle { display: inline-flex; align-items:center; justify-content:center; width:44px; height:44px; padding:0; color:#1f3442; background:#fffaf1; border:1px solid #c5ad7d; border-radius:8px; font:700 22px/1 sans-serif; cursor:pointer; }
.ht-menu-panel { position:absolute; top:calc(100% + 8px); right:0; width:224px; max-width:calc(100vw - 32px); max-height:calc(100vh - 100px); max-height:calc(100svh - 100px); overflow-y:auto; overscroll-behavior:contain; padding:10px; background:#fffaf1; border:1px solid #dfcfb4; border-radius:10px; box-shadow:0 8px 24px #0002; }
.ht-menu-panel[hidden], .ht-input-actions[hidden] { display:none !important; }
.ht-menu-panel a, .ht-menu-panel button { display:flex; align-items:center; width:100%; padding:10px 12px; margin:0; min-height:44px; border:1px solid #dfcfb4; border-radius:6px; background:#f6efe2; color:#1f3442; text-align:left; text-decoration:none; font:700 14px/1.4 sans-serif; cursor:pointer; }
.ht-menu-panel a + a, .ht-menu-panel button + button { margin-top:6px; }
.ht-menu-panel a:active, .ht-menu-panel button:active { background:#eadcc4; border-color:#c5ad7d; }
@media (hover:hover) and (pointer:fine) {
    .ht-menu-panel a:hover, .ht-menu-panel button:hover { background:#f1eadc; }
}
.ht-menu-panel a[aria-current="page"] { background:#edf1f3; box-shadow:inset 3px 0 #2f4f63; }
.ht-menu-panel hr { border:0; border-top:1px solid #dfcfb4; margin:8px 0; }
.ht-menu-panel [data-ht-action=reset] { color:#8a4030; }
.ht-menu-panel [data-ht-support] { color:#7b5d2a; }
.ht-menu-toggle:focus:not(:focus-visible), .ht-menu-panel :focus:not(:focus-visible) { outline:none; }
.ht-menu-toggle:focus-visible { border-color:#1f3442; outline:2px solid #1f3442; outline-offset:2px; }
.ht-menu-panel :focus-visible { outline:2px solid #1f3442; outline-offset:-2px; }
.ht-file-dialog { width:min(440px,calc(100vw - 32px)); max-height:calc(100svh - 32px); overflow:auto; padding:22px; border:1px solid #dfcfb4; border-radius:12px; background:#fffaf1; color:#222; }
.ht-file-dialog::backdrop { background:#0006; }
.ht-file-dialog h2 { font-size:20px; margin:0 0 20px; }
.ht-file-dialog label { display:block; font-weight:700; }
.ht-file-dialog input { display:block; width:100%; margin:8px 0; padding:12px; border:1px solid #dfcfb4; border-radius:6px; font-size:16px; }
.ht-file-preview { overflow-wrap:anywhere; font-size:13px; }
.ht-file-hint, .ht-file-scope { font-size:12px; color:#6f6254; }
.ht-file-error { color:#a32b20; font-size:13px; }
.ht-file-actions { display:flex; justify-content:flex-end; gap:10px; }
.ht-file-actions button { min-height:44px; padding:10px 16px; border:1px solid #c5ad7d; border-radius:6px; background:#f6efe2; color:#1f3442; font-weight:700; }
@media(max-width:400px) { .site-header-nav { gap:8px; } .site-header-link { padding:0 8px; } }
@media print { .ht-menu, .ht-file-dialog { display:none !important; } }

.ht-file-progress { position:fixed; bottom:20px; left:50%; transform:translateX(-50%); z-index:1100; max-width:calc(100vw - 32px); padding:12px 18px; border:1px solid #dfcfb4; border-radius:8px; background:#fffaf1; color:#1f3442; font-size:14px; box-shadow:0 4px 16px #0002; }

.ht-import-notice { margin:0 0 16px; padding:14px; border:1px solid #c5ad7d; border-radius:8px; background:#fff3d9; color:#584628; font-size:13px; line-height:1.6; }
.ht-import-notice ul { padding-left:20px; max-height:240px; overflow:auto; overflow-wrap:anywhere; }
.ht-import-notice button { padding:8px 12px; margin-top:8px; border:1px solid #c5ad7d; border-radius:6px; background:#fffaf1; color:#584628; cursor:pointer; }
[data-ht-default] { outline:2px solid #bc812d; outline-offset:2px; }

.ht-support-dialog { width:min(400px,calc(100vw - 32px)); max-height:calc(100svh - 32px); overflow:auto; padding:24px; border:1px solid #dfcfb4; border-radius:12px; background:#fffaf1; color:#222; line-height:1.65; }
.ht-support-dialog::backdrop { background:#0006; }
.ht-support-dialog h2 { margin:0 0 18px; font-size:20px; color:#7b5d2a; }
.ht-support-dialog p { font-size:14px; }
.ht-support-dialog .ht-support-note { font-size:13px; color:#6f6254; }
.ht-support-method { margin:20px 0; color:#6f6254; }
.ht-support-method a { color:#7b5d2a; }
.ht-support-actions { display:flex; justify-content:flex-end; }
.ht-support-actions button { min-height:44px; padding:8px 18px; border:1px solid #c5ad7d; border-radius:6px; background:#f6efe2; color:#7b5d2a; font-weight:700; cursor:pointer; }
.ht-support-footer { margin:20px 0 8px; text-align:center; }
.ht-support-footer[hidden] { display:none !important; }
.ht-support-footer button { padding:10px 14px; min-height:44px; border:0; background:transparent; color:#7b5d2a; font:600 13px/1.5 sans-serif; text-decoration:underline; text-underline-offset:3px; cursor:pointer; }
.ht-support-dialog :focus-visible, .ht-support-footer button:focus-visible { outline:2px solid #7b5d2a; outline-offset:2px; }
@media print { .ht-support-footer, .ht-support-dialog { display:none !important; } }

.ht-support-method h3 { font-size:14px; font-weight:400; margin:0 0 8px; color:#6f6254; }
.ht-support-account-card { padding:16px; border:1px solid #c5ad7d; border-radius:10px; background:#f6efe2; text-align:left; }
.ht-support-account-card p { margin:0; }
.ad-placeholder-card { display:flex; align-items:center; justify-content:center; box-sizing:border-box; height:var(--ad-placeholder-height, 90px); min-height:var(--ad-placeholder-height, 90px); color:#9a8a72; background:#fffaf1; border:1px dashed #dfcfb4; border-radius:8px; font-size:13px; font-weight:800; letter-spacing:0; }
@media print { .ad-placeholder-card { display:none !important; } }
.ht-support-method .ht-support-bank { font-size:15px; font-weight:700; color:#7b5d2a; }
.ht-support-method .ht-support-account { color:#7b5d2a; font-size:20px; font-weight:700; overflow-wrap:anywhere; margin:8px 0; }
