* {
    box-sizing: border-box;
}

body {
    margin: 0;
    font-family: Arial, sans-serif;
    background: #f4f6f9;
    color: #1f2937;
}


.topbar {
    background: linear-gradient(135deg, #1e3a5f, #2563eb);

    color: white;

    padding: 25px 50px;

    display: flex;

    justify-content: space-between;

    align-items: center;
}


.topbar h1 {
    margin: 0;
    font-size: 30px;
}


.topbar p {
    margin-top: 8px;
    opacity: 0.85;
}


.year-box {

    background: rgba(255,255,255,0.15);

    padding: 12px 22px;

    border-radius: 10px;

    font-size: 18px;
}


.container {

    max-width: 1400px;

    margin: auto;

    padding: 30px;
}


.welcome {

    margin-bottom: 25px;
}


.welcome h2 {

    margin-bottom: 5px;
}


.kpi-grid {

    display: grid;

    grid-template-columns:
        repeat(auto-fit, minmax(250px, 1fr));

    gap: 20px;

    margin-bottom: 30px;
}


.kpi-card {

    background: white;

    padding: 25px;

    border-radius: 16px;

    box-shadow:
        0 5px 20px rgba(0,0,0,0.08);
}


.card-title {

    font-size: 16px;

    color: #6b7280;
}


.kpi-number {

    font-size: 42px;

    font-weight: bold;

    margin-top: 15px;

    color: #1d4ed8;
}


.kpi-detail {

    margin-top: 10px;

    color: #6b7280;
}


.status {

    margin-top: 18px;

    padding: 8px 14px;

    border-radius: 20px;

    display: inline-block;

    font-weight: bold;

    font-size: 13px;
}


.pass {

    background: #dcfce7;

    color: #166534;
}


.fail {

    background: #fee2e2;

    color: #991b1b;
}


.chart-grid {

    display: grid;

    grid-template-columns:
        repeat(2, 1fr);

    gap: 25px;
}


.chart-card {

    background: white;

    padding: 25px;

    border-radius: 16px;

    box-shadow:
        0 5px 20px rgba(0,0,0,0.08);

    height: 400px;

    display: flex;

    flex-direction: column;
}


.chart-card h3 {

    margin-top: 0;

    margin-bottom: 25px;
}


.chart-wrapper {

    position: relative;

    flex: 1;

    min-height: 0;
}


.full-width {

    grid-column: span 2;
}


.footer-info {

    text-align: center;

    margin-top: 40px;

    color: #6b7280;

    font-size: 14px;
}


@media (max-width: 800px) {

    .topbar {

        padding: 20px;

        flex-direction: column;

        align-items: flex-start;

        gap: 15px;
    }


    .container {

        padding: 20px;
    }


    .chart-grid {

        grid-template-columns: 1fr;
    }


    .full-width {

        grid-column: span 1;
    }

}

.main-nav{background:#fff;border-bottom:1px solid #e5e7eb;padding:0 30px;display:flex;gap:8px;position:sticky;top:0;z-index:10}
.nav-btn{border:0;background:transparent;padding:16px 18px;font-size:15px;cursor:pointer;color:#475569;border-bottom:3px solid transparent}
.nav-btn:hover{background:#f8fafc}.nav-btn.active{color:#1d4ed8;border-bottom-color:#2563eb;font-weight:bold}.nav-btn.disabled{opacity:.45;cursor:not-allowed}
.page{display:none}.page.active{display:block}.page-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.page-heading h2{margin:0 0 7px}.page-heading p{margin:0;color:#64748b}
.import-btn,#resetFinal{background:#2563eb;color:white;border:0;border-radius:10px;padding:11px 16px;font-weight:bold;cursor:pointer}.import-btn:hover,#resetFinal:hover{background:#1d4ed8}
.filter-bar{background:#fff;padding:16px;border-radius:14px;box-shadow:0 5px 20px rgba(0,0,0,.06);display:flex;gap:10px;flex-wrap:wrap;margin-bottom:22px}.filter-bar select,.filter-bar button{padding:10px 12px;border:1px solid #dbe3ee;border-radius:9px;background:white;font-size:14px}.filter-bar select{min-width:150px}.filter-bar button{color:#334155;cursor:pointer}.final-kpis{grid-template-columns:repeat(5,minmax(180px,1fr))}.success-num{color:#16a34a}.fail-num{color:#dc2626}.warn-num{color:#d97706}
.table-card{background:white;border-radius:16px;padding:22px;box-shadow:0 5px 20px rgba(0,0,0,.08);margin-top:25px}.table-head{display:flex;gap:15px;align-items:center;flex-wrap:wrap}.table-head h3{margin:0;margin-right:auto}.table-head input{padding:10px 12px;border:1px solid #dbe3ee;border-radius:9px;min-width:260px}.table-wrap{overflow:auto;margin-top:18px;max-height:600px}table{border-collapse:collapse;width:100%;font-size:13px}th,td{padding:11px 10px;border-bottom:1px solid #eef2f7;text-align:left;white-space:nowrap}th{position:sticky;top:0;background:#f8fafc;color:#475569}.result-pass{color:#15803d;font-weight:bold}.result-fail{color:#dc2626;font-weight:bold}.result-accept{color:#b45309;font-weight:bold}.pagination{display:flex;justify-content:center;align-items:center;gap:14px;padding-top:16px}.pagination button{border:1px solid #dbe3ee;background:white;padding:8px 14px;border-radius:8px;cursor:pointer}.pagination button:disabled{opacity:.4;cursor:not-allowed}
@media(max-width:1100px){.final-kpis{grid-template-columns:repeat(3,1fr)}}@media(max-width:800px){.main-nav{overflow:auto;padding:0 10px}.page-heading{align-items:flex-start;gap:15px;flex-direction:column}.filter-bar select{width:100%}.final-kpis{grid-template-columns:1fr}.table-head input{width:100%;min-width:0}}


/* =========================================
   INCOMING INSPECTION – MASTER DASHBOARD ADDITION
   Final Inspection styles above are preserved.
   ========================================= */
.incoming-kpi{
    grid-template-columns:repeat(4,minmax(180px,1fr));
}

.incoming-kpi .kpi-title{
    font-size:15px;
    color:#6b7280;
}

.incoming-kpi .kpi-value{
    font-size:34px;
    font-weight:700;
    margin:12px 0;
    color:#1e3a5f;
}

.kpi-sub{
    font-size:13px;
    color:#6b7280;
}

.page-header{
    display:flex;
    justify-content:space-between;
    gap:20px;
    align-items:flex-start;
    margin-bottom:18px;
}

.page-header h2{
    margin:0;
}

.page-header p{
    color:#6b7280;
    margin:7px 0;
}

.import-box{
    background:#fff;
    padding:12px;
    border-radius:10px;
    box-shadow:0 2px 10px rgba(0,0,0,.05);
}

.import-label{
    display:inline-block;
    background:#2563eb;
    color:white;
    padding:10px 14px;
    border-radius:8px;
    cursor:pointer;
    font-weight:bold;
}

.import-label input{
    display:none;
}

.import-box small{
    display:block;
    color:#6b7280;
    margin-top:7px;
}

.filters{
    display:flex;
    gap:12px;
    align-items:end;
    flex-wrap:wrap;
    background:#fff;
    padding:16px;
    border-radius:12px;
    margin-bottom:12px;
    box-shadow:0 5px 20px rgba(0,0,0,.06);
}

.filters label{
    display:flex;
    flex-direction:column;
    gap:6px;
    font-size:13px;
    color:#6b7280;
}

.filters select,
.filters button{
    padding:9px 11px;
    border:1px solid #d1d5db;
    border-radius:7px;
    background:white;
}

.filters button{
    cursor:pointer;
    background:#f3f4f6;
    color:#334155;
}

.data-source{
    font-size:13px;
    color:#475569;
    margin:10px 0 18px;
}

.badge{
    padding:4px 8px;
    border-radius:99px;
    font-size:12px;
    font-weight:bold;
}

.badge.pass{
    background:#dcfce7;
    color:#166534;
}

.badge.fail{
    background:#fee2e2;
    color:#991b1b;
}

@media(max-width:1100px){
    .incoming-kpi{grid-template-columns:repeat(2,1fr);}
}

@media(max-width:800px){
    .incoming-kpi{grid-template-columns:1fr;}
    .page-header{align-items:flex-start;gap:15px;flex-direction:column;}
}


/* =========================================
   MASTER V2 – ADVANCED FINAL ANALYSIS
   Existing dashboard styles are preserved.
   ========================================= */
.analysis-section{margin-top:34px;padding-top:8px;border-top:1px solid #e8edf5}.section-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin:22px 0}.section-heading h2{margin:0 0 6px;font-size:24px}.section-heading p{margin:0;color:#64748b}.analysis-tag{background:#eff6ff;color:#1d4ed8;padding:8px 12px;border-radius:999px;font-size:12px;font-weight:700;white-space:nowrap}.analysis-table-grid{display:grid;grid-template-columns:1fr 1fr;gap:25px}.compact-card{margin-top:0}.small-table{max-height:360px}.data-table{width:100%;border-collapse:collapse}.data-table th,.data-table td{padding:11px 10px;border-bottom:1px solid #eef2f7;text-align:left}.data-table th{background:#f8fafc;color:#475569}.table-note{margin:-5px 0 12px;color:#64748b;font-size:13px}.cpk-good{background:#dcfce7;color:#166534;padding:5px 9px;border-radius:999px;font-weight:700;display:inline-block;min-width:52px;text-align:center}.cpk-watch{background:#fef3c7;color:#92400e;padding:5px 9px;border-radius:999px;font-weight:700;display:inline-block;min-width:52px;text-align:center}.cpk-bad{background:#fee2e2;color:#991b1b;padding:5px 9px;border-radius:999px;font-weight:700;display:inline-block;min-width:52px;text-align:center}.cpk-na{background:#f1f5f9;color:#64748b;padding:5px 9px;border-radius:999px;font-weight:700;display:inline-block;min-width:52px;text-align:center}.issue-badge{padding:5px 9px;border-radius:999px;font-size:12px;font-weight:700}.issue-badge.fail{background:#fee2e2;color:#991b1b}.issue-badge.warn{background:#fef3c7;color:#92400e}@media(max-width:900px){.analysis-table-grid{grid-template-columns:1fr}.section-heading{flex-direction:column}.analysis-tag{white-space:normal}}


/* =========================================
   DOCUMENT CONTROL CENTER (DCC)
   Added without changing existing pages
   ========================================= */
.dcc-header{align-items:center}.dcc-status{background:#eff6ff;color:#1d4ed8;padding:9px 13px;border-radius:999px;font-size:13px;font-weight:700}.dcc-hero{background:linear-gradient(135deg,#1e3a5f,#2563eb);color:#fff;border-radius:20px;padding:28px 32px;display:flex;justify-content:space-between;align-items:center;gap:24px;margin-bottom:22px;box-shadow:0 14px 30px rgba(37,99,235,.18)}.dcc-eyebrow{font-size:12px;letter-spacing:1.2px;font-weight:800;opacity:.75}.dcc-hero h3{font-size:26px;margin:8px 0}.dcc-hero p{margin:0;opacity:.88}.dcc-total{width:155px;height:120px;border:1px solid rgba(255,255,255,.25);border-radius:18px;background:rgba(255,255,255,.12);display:flex;flex-direction:column;align-items:center;justify-content:center;flex-shrink:0}.dcc-total span{font-size:42px;font-weight:800}.dcc-total small{opacity:.85}.dcc-summary-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px;margin-bottom:20px}.dcc-summary-card{border:1px solid #e5e7eb;background:#fff;border-radius:16px;padding:16px 14px;text-align:left;cursor:pointer;box-shadow:0 4px 15px rgba(0,0,0,.04);transition:.18s}.dcc-summary-card:hover,.dcc-summary-card.active{border-color:#2563eb;transform:translateY(-2px);box-shadow:0 9px 22px rgba(37,99,235,.12)}.dcc-summary-card span{font-size:22px;display:block;margin-bottom:7px}.dcc-summary-card b{display:block;color:#475569;font-size:14px}.dcc-summary-card strong{font-size:26px;color:#1d4ed8;display:block;margin-top:4px}.dcc-summary-card small{color:#94a3b8;font-size:11px}.dcc-toolbar{background:#fff;border-radius:15px;padding:14px;display:flex;gap:10px;align-items:center;margin-bottom:20px;box-shadow:0 5px 20px rgba(0,0,0,.06)}.dcc-search-wrap{flex:1;border:1px solid #dbe2ea;border-radius:9px;padding:0 12px;display:flex;align-items:center;gap:8px}.dcc-search-wrap input{border:0;outline:0;width:100%;padding:11px 0;background:transparent}.dcc-toolbar select,.dcc-toolbar button{padding:10px 12px;border:1px solid #dbe2ea;border-radius:9px;background:#fff;color:#334155}.dcc-toolbar button{cursor:pointer}.dcc-list-card{background:#fff;border-radius:18px;padding:22px;box-shadow:0 5px 20px rgba(0,0,0,.06)}.dcc-list-head{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;margin-bottom:18px}.dcc-list-head h3{margin:0}.dcc-list-head p{margin:5px 0 0;color:#64748b;font-size:13px}.dcc-hint{font-size:12px;color:#64748b;background:#f8fafc;padding:9px 12px;border-radius:9px}.dcc-document-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:15px}.doc-card{border:1px solid #e8edf3;border-radius:15px;padding:16px;transition:.18s;display:flex;flex-direction:column;min-height:195px}.doc-card:hover{border-color:#93c5fd;box-shadow:0 10px 24px rgba(15,23,42,.08);transform:translateY(-2px)}.doc-card-top{display:flex;gap:12px;align-items:flex-start}.doc-icon{width:48px;height:48px;border-radius:12px;background:#f1f5f9;display:flex;align-items:center;justify-content:center;font-size:24px;flex-shrink:0}.doc-title{font-weight:800;color:#1f2937;line-height:1.35;word-break:break-word}.doc-meta{display:flex;gap:7px;flex-wrap:wrap;margin-top:10px}.doc-badge{font-size:11px;font-weight:800;padding:5px 8px;border-radius:999px;background:#eff6ff;color:#1d4ed8}.doc-badge.type{background:#f8fafc;color:#64748b}.doc-path{margin:11px 0;color:#94a3b8;font-size:12px;word-break:break-word;min-height:34px}.doc-actions{margin-top:auto;display:flex;gap:8px}.doc-actions a{flex:1;text-align:center;text-decoration:none;padding:9px 10px;border-radius:8px;font-size:13px;font-weight:700}.doc-open{background:#f1f5f9;color:#334155}.doc-download{background:#2563eb;color:#fff}.dcc-empty{text-align:center;padding:55px 20px;color:#64748b}.dcc-empty>div{font-size:48px}.dcc-empty h3{color:#334155;margin:10px 0}.dcc-empty p{max-width:600px;margin:0 auto;line-height:1.6}@media(max-width:1200px){.dcc-summary-grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:800px){.dcc-header,.dcc-hero,.dcc-list-head{flex-direction:column;align-items:flex-start}.dcc-toolbar{flex-wrap:wrap}.dcc-search-wrap{flex-basis:100%}.dcc-summary-grid{grid-template-columns:repeat(2,1fr)}.dcc-total{width:100%}.dcc-toolbar select,.dcc-toolbar button{flex:1}}



/* =========================================
   QUALITY PROJECTS WORKSPACE
   Added without changing existing dashboard pages
   ========================================= */
.project-page-head{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:20px}.project-page-head h2{margin:0 0 6px}.project-page-head p{margin:0;color:#64748b}.project-head-actions{display:flex;gap:10px}.project-primary,.project-save{border:0;background:#2563eb;color:#fff;border-radius:10px;padding:11px 16px;font-weight:800;cursor:pointer}.project-secondary{border:1px solid #dbe2ea;background:#fff;color:#475569;border-radius:10px;padding:11px 16px;font-weight:700;cursor:pointer}.project-hero{background:linear-gradient(135deg,#0f2747,#2563eb);border-radius:20px;padding:26px 30px;color:#fff;display:flex;justify-content:space-between;gap:30px;align-items:center;box-shadow:0 14px 30px rgba(37,99,235,.18);margin-bottom:20px}.project-eyebrow{font-size:11px;letter-spacing:1.3px;font-weight:800;opacity:.75}.project-hero h3{font-size:25px;margin:8px 0}.project-hero p{margin:0;opacity:.85}.project-summary{display:flex;gap:12px}.project-summary>div{min-width:100px;padding:14px 16px;border:1px solid rgba(255,255,255,.2);border-radius:14px;background:rgba(255,255,255,.1);text-align:center}.project-summary strong{display:block;font-size:25px}.project-summary span{font-size:11px;opacity:.85}.project-layout{display:grid;grid-template-columns:290px minmax(0,1fr);gap:20px}.project-sidebar,.project-workspace{min-width:0}.project-sidebar{background:#fff;border-radius:18px;padding:14px;box-shadow:0 5px 20px rgba(0,0,0,.06);height:fit-content;max-height:780px;overflow:auto}.project-sidebar-head{display:flex;justify-content:space-between;align-items:center;padding:4px 4px 12px}.project-sidebar-head button{border:0;background:#f1f5f9;border-radius:8px;padding:6px 10px;cursor:pointer}.project-search{display:flex;gap:7px;align-items:center;border:1px solid #dbe2ea;border-radius:9px;padding:0 10px;margin-bottom:10px}.project-search input{border:0;outline:0;width:100%;padding:10px 0}.project-list{display:flex;flex-direction:column;gap:7px}.project-list-item{border:1px solid #edf1f5;background:#fff;border-radius:12px;padding:12px;text-align:left;cursor:pointer}.project-list-item:hover,.project-list-item.active{border-color:#2563eb;background:#f8fbff}.project-list-item b,.project-list-item small,.project-list-code{display:block}.project-list-item b{font-size:13px;margin:3px 0 6px}.project-list-item small{font-size:11px;color:#64748b}.project-list-code{font-size:10px;color:#2563eb;font-weight:800}.status-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#94a3b8;margin-right:5px}.status-dot.in-progress{background:#22c55e}.status-dot.completed{background:#2563eb}.status-dot.on-hold{background:#f59e0b}.project-empty-mini{text-align:center;color:#94a3b8;padding:40px 10px;line-height:1.6}.project-welcome-card{background:#fff;border-radius:20px;padding:70px 25px;text-align:center;box-shadow:0 5px 20px rgba(0,0,0,.06)}.project-welcome-icon{font-size:52px}.project-welcome-card h3{margin:12px 0 6px}.project-welcome-card p{color:#64748b;max-width:540px;margin:0 auto 18px}.project-titlebar{background:#fff;border-radius:18px;padding:20px;box-shadow:0 5px 20px rgba(0,0,0,.06);display:flex;justify-content:space-between;gap:20px;align-items:flex-start}.project-code{font-size:11px;color:#2563eb;font-weight:800}.project-name-input{font-size:24px;font-weight:800;border:0;outline:0;width:100%;color:#1f2937;margin:5px 0}.project-meta-line{display:flex;gap:10px;align-items:center;color:#94a3b8;font-size:12px}.project-meta-line select{border:1px solid #dbe2ea;border-radius:8px;padding:6px 9px}.project-tabs,.tool-tabs{display:flex;gap:6px;margin:16px 0;border-bottom:1px solid #e8edf3;overflow:auto}.project-tab,.tool-tab{border:0;background:transparent;padding:12px 14px;color:#64748b;cursor:pointer;white-space:nowrap;border-bottom:3px solid transparent;font-weight:700}.project-tab.active,.tool-tab.active{color:#2563eb;border-bottom-color:#2563eb}.project-panel,.tool-panel{display:none}.project-panel.active,.tool-panel.active{display:block}.project-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:20px}.project-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.project-card{background:#fff;border-radius:16px;padding:20px;box-shadow:0 5px 20px rgba(0,0,0,.05);margin-bottom:20px}.project-card h3{margin:0 0 12px}.project-card textarea,.fivew-grid textarea,.swot-box textarea,.fish-input-grid textarea,.six-hats-grid textarea{width:100%;min-height:140px;border:1px solid #dbe2ea;border-radius:10px;padding:11px;font-family:inherit;resize:vertical}.progress-big{display:flex;gap:24px;align-items:center}.progress-ring{width:115px;height:115px;border-radius:50%;background:conic-gradient(#2563eb 0 65%,#e8eef8 65% 100%);display:grid;place-items:center;position:relative}.progress-ring:before{content:"";position:absolute;width:82px;height:82px;background:#fff;border-radius:50%}.progress-ring span{position:relative;font-size:20px;font-weight:800}.progress-big input{width:100%}.progress-big label{font-weight:700}.progress-big p{color:#64748b;font-size:13px}.stat-card{text-align:center}.stat-card span{font-size:25px;display:block}.stat-card b{font-size:20px;display:block;margin:7px 0}.stat-card small{color:#64748b}.pdca-flow{display:flex;align-items:center;gap:10px;margin-bottom:20px;overflow:auto}.pdca-stage{min-width:155px;text-align:left;border:1px solid #dbe2ea;background:#fff;border-radius:14px;padding:14px;cursor:pointer}.pdca-stage b,.pdca-stage span{display:block}.pdca-stage b{color:#2563eb}.pdca-stage span{font-size:11px;color:#64748b;margin-top:4px}.pdca-stage.active{border-color:#2563eb;background:#eff6ff}.pdca-editor-head{display:flex;justify-content:space-between;gap:15px}.pdca-editor-head p{margin:4px 0 12px;color:#64748b;font-size:13px}.pdca-editor-head select{height:38px;border:1px solid #dbe2ea;border-radius:8px;padding:0 8px}.pdca-editor textarea{min-height:260px}.fivew-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.fivew-grid label,.fish-input-grid label,.six-hats-grid label{font-weight:800;font-size:13px;color:#334155}.fivew-grid textarea{min-height:105px;margin-top:6px}.tool-head{display:flex;justify-content:space-between;gap:15px;align-items:flex-start}.tool-head p{color:#64748b;font-size:13px;margin:5px 0 0}.mini-add{border:1px solid #bfdbfe;background:#eff6ff;color:#1d4ed8;border-radius:8px;padding:8px 10px;font-weight:700;cursor:pointer;white-space:nowrap}.raci-table input,.task-table input,.task-table select{width:100%;border:1px solid #dbe2ea;border-radius:7px;padding:7px;background:#fff}.row-delete{border:0;background:#fee2e2;color:#dc2626;border-radius:7px;padding:5px 9px;cursor:pointer}.table-empty{text-align:center;color:#94a3b8;padding:20px!important}.gantt-card{overflow:hidden}.gantt-head{display:flex;justify-content:space-between;align-items:center}.gantt-head span{font-size:12px;color:#64748b}.gantt-chart{margin-top:14px;border:1px solid #eef2f7;border-radius:12px;padding:12px;overflow:auto}.gantt-axis{margin-left:180px;display:grid;grid-template-columns:repeat(10,1fr);font-size:10px;color:#94a3b8;margin-bottom:8px;min-width:620px}.gantt-row{display:grid;grid-template-columns:180px minmax(620px,1fr);align-items:center;margin:8px 0}.gantt-task-name{font-size:12px;padding-right:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.gantt-track{height:28px;background:repeating-linear-gradient(90deg,#f8fafc 0,#f8fafc calc(10% - 1px),#e5e7eb calc(10% - 1px),#e5e7eb 10%);position:relative;border-radius:6px}.gantt-bar{position:absolute;top:4px;height:20px;background:linear-gradient(90deg,#2563eb,#60a5fa);border-radius:5px;min-width:30px;color:#fff;font-size:10px;display:flex;align-items:center;justify-content:center}.gantt-empty{text-align:center;padding:40px;color:#94a3b8}.swot-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.swot-box{border-radius:15px;padding:16px;border:1px solid #e5e7eb}.swot-box b,.swot-box span{display:block}.swot-box span{font-size:12px;color:#64748b;margin:3px 0 8px}.swot-box textarea{min-height:130px}.swot-box.s{background:#f0fdf4}.swot-box.w{background:#fff7ed}.swot-box.o{background:#eff6ff}.swot-box.t{background:#fef2f2}.strategy-btn{margin:16px 0}.tows-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.tows-card{border-radius:14px;padding:16px;border:1px solid #e5e7eb}.tows-card b{display:block;margin-bottom:8px}.tows-card ul{margin:0;padding-left:18px;font-size:13px;line-height:1.55}.tows-card.so{background:#f0fdf4}.tows-card.st{background:#eff6ff}.tows-card.wo{background:#fffbeb}.tows-card.wt{background:#fef2f2}.fish-input-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.fish-input-grid textarea{min-height:95px;margin-top:6px}.fishbone-wrap{overflow:auto}.fishbone-diagram{position:relative;min-width:820px;min-height:380px;margin-top:20px;background:#f8fafc;border-radius:16px;padding:25px}.fish-spine{position:absolute;left:12%;right:8%;top:50%;height:4px;background:#334155}.fish-spine:after{content:"▶";position:absolute;right:-8px;top:-12px;color:#334155;font-size:22px}.fish-spine span{position:absolute;right:-50px;top:-34px;background:#fff;padding:7px 10px;border:1px solid #dbe2ea;border-radius:8px;font-size:12px;font-weight:800}.fish-branch{position:absolute;width:28%;padding:10px;border-left:2px solid #64748b;background:#fff;border-radius:8px;box-shadow:0 3px 10px rgba(0,0,0,.04)}.fish-branch.top{top:25px}.fish-branch.bottom{bottom:25px}.fish-branch:nth-of-type(2),.fish-branch:nth-of-type(5){left:10%}.fish-branch:nth-of-type(3),.fish-branch:nth-of-type(6){left:36%}.fish-branch:nth-of-type(4),.fish-branch:nth-of-type(7){left:62%}.fish-branch b{font-size:12px;color:#2563eb}.fish-branch ul{margin:6px 0 0;padding-left:16px;font-size:11px;color:#475569}.six-hats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.six-hats-grid label{background:#fff;border:1px solid #e5e7eb;border-radius:14px;padding:15px}.six-hats-grid label span{font-size:22px;display:block}.six-hats-grid label b,.six-hats-grid label small{display:block}.six-hats-grid label small{color:#94a3b8;margin:3px 0 8px}.six-hats-grid textarea{min-height:120px}.project-primary:hover,.project-save:hover{background:#1d4ed8}.project-secondary:hover,.mini-add:hover{filter:brightness(.98)}
@media(max-width:1100px){.project-layout{grid-template-columns:1fr}.project-sidebar{max-height:none}.project-list{display:grid;grid-template-columns:repeat(2,1fr)}.project-summary{flex-wrap:wrap}.project-grid-3{grid-template-columns:1fr 1fr}.fish-input-grid{grid-template-columns:1fr 1fr}}
@media(max-width:800px){.project-page-head,.project-hero,.project-titlebar{flex-direction:column;align-items:flex-start}.project-head-actions{width:100%}.project-head-actions button{flex:1}.project-summary{width:100%}.project-summary>div{flex:1}.project-list{grid-template-columns:1fr}.project-grid-2,.project-grid-3,.fivew-grid,.swot-grid,.tows-grid,.six-hats-grid,.fish-input-grid{grid-template-columns:1fr}.pdca-flow{align-items:stretch}.pdca-flow>span{display:none}.progress-big{flex-direction:column;align-items:flex-start}.gantt-row{grid-template-columns:130px minmax(620px,1fr)}.gantt-axis{margin-left:130px}.project-name-input{font-size:20px}}


/* QUALITY VERIFICATION */
.verification-page-head,.verification-hero,.verification-records-head{display:flex;justify-content:space-between;align-items:center;gap:18px}.verification-page-head h2{margin:0}.verification-page-head p,.verification-records-head p{margin:5px 0 0;color:#64748b}.verification-head-actions{display:flex;gap:10px}.verification-hero{margin:18px 0 20px;background:linear-gradient(135deg,#17365d,#2f5da8);color:#fff;border-radius:22px;padding:25px 28px;box-shadow:0 10px 30px rgba(23,54,93,.18)}.verification-eyebrow{font-size:10px;font-weight:800;letter-spacing:1.2px;color:#bfdbfe}.verification-hero h3{margin:8px 0;font-size:24px}.verification-hero p{margin:0;color:#dbeafe}.verification-summary{display:flex;gap:12px}.verification-summary>div{min-width:105px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.16);border-radius:14px;padding:13px;text-align:center}.verification-summary strong,.verification-summary span{display:block}.verification-summary strong{font-size:25px}.verification-summary span{font-size:11px;color:#dbeafe}.verification-tabs{display:flex;gap:8px;border-bottom:1px solid #e5e7eb;margin-bottom:18px}.verification-tab{border:0;background:transparent;padding:12px 16px;font-weight:800;color:#64748b;border-bottom:3px solid transparent;cursor:pointer}.verification-tab.active{color:#2563eb;border-bottom-color:#2563eb}.verification-panel{display:none}.verification-panel.active{display:block}.v-section-card{background:#fff;border-radius:18px;padding:20px;box-shadow:0 5px 20px rgba(0,0,0,.05);margin-bottom:18px}.v-section-title{display:flex;gap:12px;align-items:center;border-bottom:1px solid #edf1f5;padding-bottom:14px;margin-bottom:16px}.v-section-title>span{display:grid;place-items:center;width:34px;height:34px;border-radius:9px;background:#17365d;color:#fff;font-weight:900}.v-section-title h3{margin:0;font-size:16px}.v-section-title p{margin:3px 0 0;color:#64748b;font-size:12px}.v-form-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:13px}.v-form-grid label,.v-full-label{font-size:12px;font-weight:800;color:#475569}.v-form-grid input,.v-full-label textarea{display:block;width:100%;box-sizing:border-box;border:1px solid #dbe2ea;border-radius:9px;padding:10px;margin-top:5px;font:inherit;font-size:13px}.v-full-label textarea{min-height:90px;resize:vertical}.v-group-row{margin-top:16px;display:flex;align-items:center;gap:18px;flex-wrap:wrap;background:#f8fafc;border-radius:12px;padding:12px}.v-group-label{font-weight:800;color:#334155}.v-choice{font-size:13px}.v-checklist-wrap{overflow:auto}.v-checklist-table,.v-trace-table{width:100%;border-collapse:collapse;min-width:850px}.v-checklist-table th,.v-checklist-table td,.v-trace-table th,.v-trace-table td{border:1px solid #dbe2ea;padding:10px;font-size:12px;vertical-align:middle}.v-checklist-table th,.v-trace-table th{background:#eaf0f8;color:#17365d;text-align:center}.v-checklist-table td:nth-child(n+3):nth-child(-n+5),.v-trace-table td:not(:first-child){text-align:center}.v-item-remark{width:100%;box-sizing:border-box;border:0;border-bottom:1px dashed #94a3b8;padding:5px;background:transparent}.verification-two-col{display:grid;grid-template-columns:1fr 1.15fr;gap:18px}.v-tick-list{display:flex;flex-direction:column;gap:11px}.v-tick-list label{padding:10px 12px;background:#f8fafc;border-radius:9px;font-size:13px}.v-tick-list input{margin-right:7px}.conclusion-card{border-top:4px solid #17365d}.v-conclusion-options{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:16px}.v-conclusion{display:block;border:1px solid #dbe2ea;border-radius:14px;padding:15px;cursor:pointer}.v-conclusion input{margin-right:7px}.v-conclusion b,.v-conclusion small{display:block}.v-conclusion small{margin-top:7px;color:#64748b;font-size:11px}.v-conclusion.accept{background:#f0fdf4}.v-conclusion.observation{background:#fffbeb}.v-conclusion.fail{background:#fef2f2}.verification-records-head{background:#fff;padding:18px 20px;border-radius:16px;box-shadow:0 5px 20px rgba(0,0,0,.05);margin-bottom:16px}.verification-filter input{border:1px solid #dbe2ea;border-radius:9px;padding:10px 12px;min-width:260px}.verification-record-list{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.verification-record-card{background:#fff;border-radius:16px;padding:18px;box-shadow:0 5px 20px rgba(0,0,0,.05)}.verification-record-top{display:flex;justify-content:space-between;gap:12px}.verification-record-top h3{margin:6px 0;font-size:16px}.verification-record-top p{margin:0;color:#64748b;font-size:12px}.verification-record-date{font-size:11px;color:#2563eb;font-weight:800}.verification-result{height:fit-content;padding:6px 9px;border-radius:999px;font-size:11px;font-weight:800}.verification-result.accept{background:#dcfce7;color:#166534}.verification-result.observation{background:#fef3c7;color:#92400e}.verification-result.fail{background:#fee2e2;color:#b91c1c}.verification-record-meta{display:flex;gap:12px;flex-wrap:wrap;border-top:1px solid #edf1f5;margin-top:13px;padding-top:11px;color:#64748b;font-size:11px}.verification-record-card details{margin-top:12px;background:#f8fafc;border-radius:10px;padding:10px}.verification-record-card summary{cursor:pointer;font-size:12px;font-weight:800}.verification-detail-list{margin-top:10px}.verification-detail-list>div{display:flex;align-items:center;gap:8px;border-bottom:1px solid #e5e7eb;padding:8px 0;font-size:11px}.verification-detail-list b{flex:1}.mini-result{font-weight:800;font-size:10px;padding:3px 6px;border-radius:999px;background:#e2e8f0}.mini-result.pass{background:#dcfce7;color:#166534}.mini-result.fail{background:#fee2e2;color:#b91c1c}.mini-result.na{background:#e2e8f0;color:#475569}.record-note{font-size:12px;color:#475569}.verification-empty{grid-column:1/-1;text-align:center;background:#fff;border-radius:16px;padding:60px;color:#94a3b8;box-shadow:0 5px 20px rgba(0,0,0,.04)}
@media(max-width:1100px){.v-form-grid{grid-template-columns:repeat(2,1fr)}.verification-two-col{grid-template-columns:1fr}.verification-record-list{grid-template-columns:1fr}}@media(max-width:800px){.verification-page-head,.verification-hero,.verification-records-head{flex-direction:column;align-items:flex-start}.verification-summary{width:100%}.verification-summary>div{flex:1}.v-form-grid,.v-conclusion-options{grid-template-columns:1fr}.verification-head-actions{width:100%}.verification-head-actions button{flex:1}.verification-filter,.verification-filter input{width:100%;box-sizing:border-box}}

/* Quality Verification v2 - mixed size / mixed lot sampling */
.v-sampling-note{margin-top:14px;padding:12px 14px;border:1px solid #bfd1ef;background:#f6f9ff;border-radius:12px;color:#38516f;line-height:1.65}.v-form-grid select{width:100%;padding:11px 12px;border:1px solid #c9d4e3;border-radius:10px;background:#fff;font:inherit}.verification-record-meta{flex-wrap:wrap}.verification-record-meta span{white-space:normal}
/* ===== v3 Monthly Report / Calibration / SPC ===== */
.nav-btn{white-space:nowrap}
.filters,.filter-bar{flex-wrap:wrap}
.chart-title-row{display:flex;justify-content:space-between;align-items:center;gap:12px}.chart-title-row span{font-size:12px;color:#64748b}.chart-wrapper.tall{height:390px}
.spc-hero{background:linear-gradient(135deg,#0f172a,#1d4ed8);color:#fff;border-radius:24px;padding:28px;display:flex;justify-content:space-between;gap:25px;align-items:center;margin:20px 0 28px;box-shadow:0 18px 45px rgba(15,23,42,.18)}
.spc-hero h3{font-size:28px;margin:6px 0}.eyebrow,.monthly-kicker{letter-spacing:.16em;font-size:11px;font-weight:800;opacity:.75}.spc-stat-row{display:grid;grid-template-columns:repeat(5,minmax(90px,1fr));gap:10px}.spc-stat-row>div{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.15);border-radius:16px;padding:13px;text-align:center}.spc-stat-row b{display:block;font-size:22px}.spc-stat-row span{font-size:11px;opacity:.75}
.notice-card,.admin-card{background:#fff;border-radius:18px;padding:20px;margin:18px 0;box-shadow:0 8px 25px rgba(0,0,0,.06)}.notice-card{border-left:4px solid #2563eb;color:#475569}.admin-card h3{margin-top:0}.admin-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.admin-grid label{display:flex;flex-direction:column;gap:8px;font-weight:700;color:#334155}.admin-grid textarea{min-height:110px}.admin-login{max-width:520px;margin:70px auto;background:#fff;padding:35px;border-radius:24px;box-shadow:0 15px 50px rgba(0,0,0,.1);text-align:center}.admin-login input{width:100%;padding:14px;border:1px solid #cbd5e1;border-radius:12px;margin:12px 0}.admin-toolbar{position:sticky;top:0;z-index:5;background:#fff;padding:15px 18px;border-radius:16px;display:flex;align-items:center;gap:12px;box-shadow:0 8px 25px rgba(0,0,0,.08)}.admin-toolbar b{margin-right:auto}.admin-toolbar button{padding:9px 14px;border-radius:10px;border:1px solid #cbd5e1;background:#fff;cursor:pointer}.check-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.check-grid label{padding:12px;background:#f8fafc;border-radius:10px}.slide-upload-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px;margin-top:15px}.slide-upload-list>div{border:1px solid #e2e8f0;border-radius:14px;padding:10px;background:#f8fafc}.slide-upload-list img{width:100%;aspect-ratio:16/9;object-fit:contain;background:#fffaf2;border-radius:10px}.slide-upload-list span{display:block;font-size:12px;margin:8px 0}.slide-upload-list button{border:0;background:#fee2e2;padding:6px 10px;border-radius:8px}
.monthly-report{background:#e9eef5;padding:0 0 40px}.monthly-cover{min-height:430px;background:linear-gradient(135deg,#0b1220 0%,#172554 58%,#2563eb 100%);color:#fff;border-radius:0 0 34px 34px;padding:70px 7%;display:flex;flex-direction:column;justify-content:center}.monthly-cover h2{font-size:48px;max-width:900px;margin:15px 0}.monthly-cover p{font-size:20px;opacity:.8}.monthly-cover-line{width:110px;height:5px;background:#60a5fa;border-radius:10px;margin:25px 0}.monthly-cover-foot{display:flex;justify-content:space-between;font-size:12px;opacity:.7}.report-section{background:#fff;margin:28px auto;max-width:1250px;border-radius:28px;padding:34px;box-shadow:0 15px 40px rgba(15,23,42,.07)}.report-section-head{display:flex;gap:16px;align-items:flex-start;margin-bottom:24px}.report-section-head>span{font-size:12px;font-weight:900;color:#2563eb;background:#dbeafe;padding:7px 10px;border-radius:10px}.report-section-head h2{margin:0;font-size:30px}.report-section-head p{margin:5px 0;color:#64748b}.report-kpi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin-bottom:22px}.report-kpi-grid.four{grid-template-columns:repeat(4,1fr)}.report-kpi-grid.three{grid-template-columns:repeat(3,1fr)}.report-kpi{background:linear-gradient(145deg,#f8fafc,#eef2ff);padding:20px;border-radius:18px;border:1px solid #e2e8f0}.report-kpi span,.report-kpi small{display:block;color:#64748b}.report-kpi b{display:block;font-size:34px;margin:8px 0}.report-kpi.good b{color:#16a34a}.report-kpi.bad b{color:#dc2626}.report-kpi.warn b{color:#d97706}.report-chart-box{background:#f8fafc;border-radius:20px;padding:18px;height:310px}.report-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:18px}.report-chart-box canvas{width:100%!important;height:100%!important}.insight-box{margin-top:18px;padding:16px 18px;background:#eff6ff;border-radius:14px;color:#1e3a8a}.report-list{display:grid;gap:10px;margin-top:15px}.report-list-item{display:grid;grid-template-columns:130px 1fr 100px;gap:10px;padding:14px;background:#f8fafc;border-radius:12px}.report-list-item strong{text-align:right}.verification-report-grid,.project-report-grid,.custom-slide-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.verification-report-card,.project-report-card{padding:18px;border:1px solid #e2e8f0;border-radius:18px;background:#f8fafc}.verification-report-card>*{display:block;margin-bottom:6px}.project-report-top{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center}.project-report-top span{font-size:11px;color:#2563eb;font-weight:800}.project-report-top strong{font-size:22px}.report-progress{height:8px;background:#e2e8f0;border-radius:10px;margin:15px 0}.report-progress i{display:block;height:100%;background:#2563eb;border-radius:10px}.custom-slide-grid{grid-template-columns:1fr;margin-top:18px}.custom-slide-grid img{width:100%;max-width:1100px;max-height:680px;height:auto;object-fit:contain;display:block;margin:0 auto;border-radius:20px;box-shadow:0 12px 30px rgba(0,0,0,.1);background:#fffaf2}.management-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.management-summary>div{padding:20px;border-radius:18px;background:#f8fafc;border:1px solid #e2e8f0}.management-summary h3{margin-top:0}.empty-state{padding:30px;text-align:center;color:#94a3b8;background:#f8fafc;border-radius:14px}.closing-section{padding-bottom:50px}
@media(max-width:900px){.spc-hero{flex-direction:column;align-items:stretch}.spc-stat-row{grid-template-columns:repeat(2,1fr)}.admin-grid,.report-grid-2,.management-summary,.verification-report-grid,.project-report-grid{grid-template-columns:1fr}.report-kpi-grid,.report-kpi-grid.four,.report-kpi-grid.three{grid-template-columns:repeat(2,1fr)}.monthly-cover h2{font-size:34px}.report-section{margin:18px 10px;padding:22px}.main-nav{overflow-x:auto}.nav-btn{font-size:12px}}
.report-kpi-grid.five{grid-template-columns:repeat(5,1fr)}
@media(max-width:1100px){.report-kpi-grid.five{grid-template-columns:repeat(3,1fr)}}
@media(max-width:900px){.report-kpi-grid.five{grid-template-columns:repeat(2,1fr)}}

/* ===== QA Report V4 UI polish ===== */
html,body{overflow-x:hidden}
.topbar{padding:20px 34px;min-height:82px}
.topbar h1{font-size:26px;letter-spacing:-.02em}
.topbar p{margin:5px 0 0;font-size:13px}
.main-nav{
  position:sticky;top:0;z-index:50;
  display:flex;align-items:center;gap:8px;
  padding:8px 24px;background:rgba(255,255,255,.96);
  backdrop-filter:blur(12px);border-bottom:1px solid #e5e7eb;
  box-shadow:0 4px 16px rgba(15,23,42,.05);
  min-width:0;
}
.nav-primary{display:flex;align-items:center;gap:4px;min-width:0;flex:1}
.nav-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:7px;
  white-space:nowrap;border:1px solid transparent;background:transparent;
  border-radius:11px;padding:10px 12px;font-size:13px;font-weight:650;
  color:#475569;cursor:pointer;transition:.18s ease;
  border-bottom:0!important;
}
.nav-btn:hover{background:#f1f5f9;color:#0f172a;transform:none}
.nav-btn.active{background:#eff6ff;color:#1d4ed8;border:1px solid #bfdbfe!important;box-shadow:0 2px 7px rgba(37,99,235,.08)}
.nav-icon{font-size:16px;line-height:1}
.nav-report{background:linear-gradient(135deg,#1d4ed8,#2563eb)!important;color:#fff!important;border-color:#1d4ed8!important;padding:10px 14px;box-shadow:0 5px 16px rgba(37,99,235,.22)}
.nav-report:hover{background:linear-gradient(135deg,#1e40af,#1d4ed8)!important;color:#fff!important}
.nav-report.active{color:#fff!important}
.nav-report em{font-style:normal;font-size:9px;padding:3px 6px;border-radius:999px;background:rgba(255,255,255,.18);letter-spacing:.02em}
.nav-more{position:relative;flex:0 0 auto}
.nav-more>summary{
  list-style:none;cursor:pointer;border:1px solid #dbe3ee;background:#fff;color:#475569;
  border-radius:11px;padding:10px 12px;font-size:13px;font-weight:700;white-space:nowrap;
}
.nav-more>summary::-webkit-details-marker{display:none}
.nav-more>summary:hover{background:#f8fafc}
.nav-more-menu{
  position:absolute;right:0;top:calc(100% + 8px);min-width:230px;
  background:#fff;border:1px solid #e2e8f0;border-radius:16px;padding:8px;
  box-shadow:0 18px 45px rgba(15,23,42,.14);
}
.nav-more-menu .nav-btn{width:100%;justify-content:flex-start}
.nav-more-menu .nav-admin{margin-top:5px;border-top:1px solid #e2e8f0!important;border-radius:8px;padding-top:13px}
.page-header,.page-heading{gap:20px}
.import-box{border-radius:16px}
.data-source{margin:0 0 18px}
.cal-status{display:inline-flex;padding:5px 8px;border-radius:999px;font-size:11px;font-weight:800}
.cal-status.actual{background:#dcfce7;color:#166534}
.cal-status.fail{background:#fee2e2;color:#991b1b}
.cal-status.upcoming{background:#dbeafe;color:#1d4ed8}
.cal-status.overdue{background:#fef3c7;color:#92400e}
#monthlyPage{margin:-30px}
#monthlyPage .monthly-report{min-height:calc(100vh - 130px)}
@media(max-width:1100px){
 .main-nav{overflow-x:auto}
 .nav-primary{flex:0 0 auto}
 .nav-btn{font-size:12px;padding:9px 10px}
 .nav-report em{display:none}
}
@media(max-width:700px){
 .topbar{padding:16px 18px}.year-box{display:none}
 .main-nav{padding:7px 10px}
 #monthlyPage{margin:-20px}
 .monthly-cover{border-radius:0 0 24px 24px;padding:45px 24px}
}

/* =========================================================
   QA & QMR — LUXURY IVORY / CHAMPAGNE UI
   UI-only refinement layer.
   No data, API, calculation or interaction rules are changed.
   ========================================================= */
:root{
  --lux-bg:#f4eee4;
  --lux-bg-2:#eee4d6;
  --lux-surface:rgba(255,252,246,.88);
  --lux-surface-solid:#fffaf2;
  --lux-cream:#f8f1e5;
  --lux-ivory:#fffdf8;
  --lux-brown:#6b4f3a;
  --lux-brown-deep:#3d2b20;
  --lux-brown-soft:#8a6a50;
  --lux-gold:#b08a57;
  --lux-gold-light:#d7bd91;
  --lux-line:rgba(107,79,58,.16);
  --lux-shadow:0 16px 42px rgba(73,50,32,.10);
  --lux-shadow-soft:0 8px 24px rgba(73,50,32,.07);
  --lux-radius:20px;
}

html{scroll-behavior:smooth}
body{
  font-family:"Noto Sans Thai","Leelawadee UI","Segoe UI",Arial,sans-serif;
  background:
    radial-gradient(circle at 10% 0%,rgba(215,189,145,.22),transparent 30%),
    radial-gradient(circle at 92% 8%,rgba(255,255,255,.90),transparent 28%),
    linear-gradient(180deg,#f8f3eb 0%,var(--lux-bg) 45%,#efe5d7 100%);
  color:var(--lux-brown-deep);
}
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;opacity:.34;
  background-image:linear-gradient(rgba(255,255,255,.18) 1px,transparent 1px),linear-gradient(90deg,rgba(107,79,58,.035) 1px,transparent 1px);
  background-size:44px 44px;
}

/* ---------- Header ---------- */
.topbar{
  position:relative;overflow:hidden;
  background:
    radial-gradient(circle at 85% 0%,rgba(215,189,145,.24),transparent 32%),
    linear-gradient(135deg,#4b3628 0%,#6b4f3a 54%,#84664b 100%);
  color:#fffaf2;padding:24px 38px;min-height:92px;
  border-bottom:1px solid rgba(255,255,255,.16);
  box-shadow:0 10px 30px rgba(61,43,32,.18);
}
.topbar::after{
  content:"";position:absolute;right:-80px;top:-150px;width:430px;height:430px;border-radius:50%;
  border:1px solid rgba(255,255,255,.12);box-shadow:0 0 0 22px rgba(255,255,255,.025),0 0 0 44px rgba(255,255,255,.018);
}
.topbar h1{font-size:28px;letter-spacing:.01em;color:#fffdf8}
.topbar p{color:#eadfce;opacity:1}
.year-box{
  display:flex;flex-direction:column;align-items:flex-end;justify-content:center;gap:2px;
  min-width:175px;text-align:right;
  background:linear-gradient(135deg,rgba(255,255,255,.16),rgba(215,189,145,.13));
  border:1px solid rgba(255,255,255,.20);box-shadow:inset 0 1px rgba(255,255,255,.18),0 8px 20px rgba(0,0,0,.10);
  backdrop-filter:blur(12px);color:#fff8eb;padding:10px 16px;border-radius:12px;
}
.year-box span{font-size:14px;font-weight:800;letter-spacing:.02em}
.year-box small{font-size:11px;font-weight:650;opacity:.88;letter-spacing:.05em}
.year-box em{font-style:normal;font-size:9px;font-weight:800;letter-spacing:.14em;opacity:.72;margin-top:2px}

/* ---------- Navigation ---------- */
.main-nav{
  background:rgba(255,250,243,.88)!important;
  border-bottom:1px solid var(--lux-line)!important;
  box-shadow:0 8px 28px rgba(73,50,32,.08)!important;
  backdrop-filter:blur(18px) saturate(120%);
}
.nav-btn{color:#735b48!important;font-weight:700;border-radius:13px!important}
.nav-btn:hover{background:rgba(176,138,87,.09)!important;color:var(--lux-brown-deep)!important}
.nav-btn.active{
  color:var(--lux-brown-deep)!important;
  background:linear-gradient(135deg,#fffaf1,#f1e3cf)!important;
  border-color:rgba(176,138,87,.34)!important;
  box-shadow:0 5px 16px rgba(107,79,58,.10),inset 0 1px rgba(255,255,255,.8);
}
.nav-report,.nav-report.active{
  background:linear-gradient(135deg,#73543b,#a27d50)!important;
  border-color:#a98960!important;color:#fffaf0!important;
  box-shadow:0 8px 20px rgba(107,79,58,.22),inset 0 1px rgba(255,255,255,.22);
}
.nav-report:hover{background:linear-gradient(135deg,#64482f,#92704a)!important}
.nav-report em{background:rgba(255,248,231,.16)}
.nav-more>summary{
  background:rgba(255,252,247,.82)!important;color:#735b48!important;
  border-color:var(--lux-line)!important;box-shadow:0 3px 12px rgba(73,50,32,.05);
}
.nav-more>summary:hover{background:#fffaf2!important}
.nav-more-menu{
  background:rgba(255,251,245,.96)!important;border-color:var(--lux-line)!important;
  box-shadow:0 22px 55px rgba(73,50,32,.16)!important;backdrop-filter:blur(18px);
}

/* ---------- Page framing ---------- */
.container{max-width:1480px;padding:34px}
.page-heading,.page-header{margin-bottom:24px}
.page-heading h2,.page-header h2,.welcome h2{color:var(--lux-brown-deep);letter-spacing:-.02em}
.page-heading p,.page-header p,.welcome p{color:#8a7665}

/* ---------- Shared surfaces ---------- */
.kpi-card,.chart-card,.table-card,.filters,.filter-bar,.import-box,.notice-card,.admin-card,.admin-toolbar,
.v-section-card,.verification-records-head,.project-card,.project-sidebar,.project-welcome-card,
.project-titlebar,.project-tabs,.gantt-card,.spc-card,.cal-card{
  background:linear-gradient(145deg,rgba(255,253,248,.96),rgba(249,241,230,.91))!important;
  border:1px solid rgba(176,138,87,.15)!important;
  box-shadow:var(--lux-shadow-soft)!important;
}
.kpi-card,.chart-card,.table-card,.filters,.filter-bar,.import-box,.notice-card,.admin-card,.admin-toolbar,
.v-section-card,.project-card,.project-sidebar,.project-welcome-card,.gantt-card{border-radius:var(--lux-radius)!important}
.kpi-card,.chart-card,.table-card,.project-card,.v-section-card{position:relative;overflow:hidden}
.kpi-card::before,.chart-card::before,.table-card::before,.project-card::before,.v-section-card::before{
  content:"";position:absolute;left:0;right:0;top:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.95),transparent);
}
.kpi-card:hover,.chart-card:hover,.project-card:hover{
  transform:translateY(-2px);
  box-shadow:0 18px 44px rgba(73,50,32,.12),inset 0 1px rgba(255,255,255,.75)!important;
}
.kpi-card,.chart-card,.project-card{transition:transform .22s ease,box-shadow .22s ease}

/* ---------- KPI ---------- */
.card-title,.kpi-title{color:#846d59!important;font-weight:750}
.kpi-number,.kpi-value{color:var(--lux-brown)!important}
.kpi-number{font-size:44px}
.kpi-detail,.kpi-sub{color:#9a8775!important}
.status.pass,.badge.pass{background:linear-gradient(135deg,#eaf2e7,#dce9d7)!important;color:#496343!important;border:1px solid #cbdcc5}
.status.fail,.badge.fail{background:linear-gradient(135deg,#f7e6df,#f1d5cb)!important;color:#8b4c3f!important;border:1px solid #e5c2b6}
.success-num{color:#5d7655!important}.fail-num{color:#9b594c!important}.warn-num{color:#9a7338!important}

/* ---------- Filters / controls ---------- */
.filters,.filter-bar{padding:14px!important;background:rgba(255,251,245,.82)!important}
.filters label{color:#8a7665!important;font-weight:650}
.filters select,.filters button,.filter-bar select,.filter-bar button,
.table-head input,.import-box input,.admin-grid input,.admin-grid textarea,.admin-grid select,
.admin-login input,.v-form-grid select,.v-full-label textarea,
.project-card input,.project-card textarea,.project-card select,
.project-search input,.project-name-input{
  border:1px solid rgba(133,103,77,.22)!important;
  background:rgba(255,253,248,.88)!important;color:#4d392b!important;
  box-shadow:inset 0 1px 2px rgba(73,50,32,.025),0 2px 8px rgba(73,50,32,.025);
  border-radius:11px!important;
}
.filters select:focus,.filters button:focus,.filter-bar select:focus,.filter-bar button:focus,
.table-head input:focus,.admin-grid input:focus,.admin-grid textarea:focus,.admin-grid select:focus,
.admin-login input:focus,.project-card input:focus,.project-card textarea:focus,.project-card select:focus{
  outline:none;border-color:rgba(176,138,87,.62)!important;box-shadow:0 0 0 3px rgba(176,138,87,.12)!important;
}
.filter-bar button,.filters button{color:#6b4f3a!important;background:linear-gradient(180deg,#fffdf9,#f1e6d8)!important}
.import-label,.import-btn,#resetFinal,.project-primary,.project-save,.mini-add,.strategy-btn{
  background:linear-gradient(135deg,#76563c,#b08a57)!important;color:#fffaf1!important;
  border:1px solid rgba(117,82,50,.38)!important;border-radius:11px!important;
  box-shadow:0 8px 18px rgba(107,79,58,.17),inset 0 1px rgba(255,255,255,.22)!important;
}
.import-label:hover,.import-btn:hover,#resetFinal:hover,.project-primary:hover,.project-save:hover,.mini-add:hover,.strategy-btn:hover{
  background:linear-gradient(135deg,#65482f,#9d784d)!important;transform:translateY(-1px)
}

/* ---------- Data source / notices ---------- */
.data-source,.notice-card{color:#735d4a!important}
.data-source{background:rgba(255,250,242,.55);border-radius:12px;padding:10px 13px}
.notice-card{border-left:4px solid var(--lux-gold)!important}
.analysis-tag,.dcc-status{background:#f1e5d4!important;color:#765738!important;border:1px solid #dfc8a5}

/* ---------- Tables ---------- */
.table-wrap{border-radius:14px}
table{color:#594535}
th{background:linear-gradient(180deg,#f5ecdf,#eee1d1)!important;color:#705844!important;border-bottom:1px solid #ddcbb5!important}
th,td{border-bottom-color:rgba(133,103,77,.13)!important}
tbody tr:nth-child(even){background:rgba(246,237,225,.28)}
tbody tr:hover{background:rgba(215,189,145,.12)!important}
.result-pass{color:#58704f!important}.result-fail{color:#9a5648!important}.result-accept{color:#9a713a!important}
.pagination button{background:#fffaf2!important;border-color:var(--lux-line)!important;color:#735b48!important}

/* ---------- Charts ---------- */
.chart-card h3,.table-card h3{color:#594231}
.chart-wrapper{padding:2px}

/* ---------- DCC ---------- */
.dcc-hero,.spc-hero{
  background:
    radial-gradient(circle at 90% 0%,rgba(215,189,145,.28),transparent 30%),
    linear-gradient(135deg,#4a3527,#74553b 58%,#9b774e)!important;
  border:1px solid rgba(255,255,255,.13)!important;
  box-shadow:0 20px 50px rgba(73,50,32,.18)!important;
}
.dcc-hero{position:relative;overflow:hidden}
.dcc-hero::after,.spc-hero::after{
  content:"";position:absolute;right:-90px;bottom:-150px;width:380px;height:380px;border-radius:50%;border:1px solid rgba(255,255,255,.12);box-shadow:0 0 0 28px rgba(255,255,255,.025),0 0 0 56px rgba(255,255,255,.018)
}
.dcc-eyebrow,.eyebrow,.monthly-kicker{color:#e9d6b8!important}
.dcc-hero h3,.spc-hero h3{color:#fffaf1!important}
.dcc-hero p,.spc-hero p{color:#eadfce!important}
.dcc-total,.spc-stat-row>div{background:rgba(255,250,240,.10)!important;border-color:rgba(255,255,255,.16)!important;box-shadow:inset 0 1px rgba(255,255,255,.10)}

/* ---------- Monthly report ---------- */
.monthly-report{background:linear-gradient(180deg,#eee4d6,#e8dccd)!important}
.monthly-cover{
  position:relative;overflow:hidden;
  background:
    radial-gradient(circle at 82% 5%,rgba(215,189,145,.26),transparent 28%),
    linear-gradient(135deg,#3f2c21 0%,#624833 55%,#8b6948 100%)!important;
  box-shadow:0 24px 60px rgba(73,50,32,.20);
}
.monthly-cover::before{content:"";position:absolute;inset:24px;border:1px solid rgba(255,255,255,.10);border-radius:28px;pointer-events:none}
.monthly-cover h2{color:#fffaf1!important;text-shadow:0 4px 24px rgba(0,0,0,.18)}
.monthly-cover p{color:#e8ddcf!important}.monthly-cover-line{background:linear-gradient(90deg,#d8bb8d,#f0dfc0)!important}
.monthly-cover-foot{color:#e3d5c3!important}
.report-section{background:rgba(255,251,245,.91)!important;border:1px solid rgba(176,138,87,.14);box-shadow:0 18px 50px rgba(73,50,32,.10)!important}
.report-section-head>span{background:#f1e5d4!important;color:#765738!important}
.report-section-head h2{color:#4f3828!important}
.report-section-head p{color:#8a7665!important}
.report-kpi{background:linear-gradient(145deg,#fffdf8,#f3e9db)!important;border-color:rgba(176,138,87,.15)!important}
.report-kpi span,.report-kpi small{color:#8b7662!important}.report-kpi b{color:#5b4332!important}
.report-kpi.good b{color:#5d7655!important}.report-kpi.bad b{color:#9b594c!important}.report-kpi.warn b{color:#9a7338!important}
.report-chart-box{background:linear-gradient(145deg,#fbf6ed,#f2e7d8)!important;border:1px solid rgba(176,138,87,.10)}
.insight-box{background:#f2e7d8!important;color:#765638!important;border:1px solid rgba(176,138,87,.13)}
.report-list-item,.verification-report-card,.project-report-card,.management-summary>div{background:rgba(248,240,229,.72)!important;border-color:rgba(133,103,77,.12)!important}
.report-progress{background:#e8dccd!important}.report-progress i{background:linear-gradient(90deg,#8b6948,#c3a36f)!important}
.empty-state{background:#f4eadf!important;color:#9b8875!important}

/* ---------- Calibration / SPC ---------- */
.cal-status.actual{background:#e6eedf!important;color:#57704f!important}
.cal-status.fail{background:#f3ddd5!important;color:#955548!important}
.cal-status.upcoming{background:#eee3d2!important;color:#80613f!important}
.cal-status.overdue{background:#f1dfc4!important;color:#8b6333!important}

/* ---------- Verification ---------- */
.v-section-title span,.v-conclusion,.v-checklist-wrap,.v-form-grid>label{border-color:rgba(176,138,87,.16)!important}
.v-section-title span{background:linear-gradient(145deg,#76563c,#b08a57)!important;color:#fffaf1!important;box-shadow:0 6px 15px rgba(107,79,58,.16)}
.v-section-title h3,.verification-records-head h3{color:#5a4231!important}
.v-section-title p,.verification-records-head p{color:#927e6b!important}
.v-conclusion{background:linear-gradient(145deg,#fffdf8,#f5eadc)!important}
.v-conclusion.accept{border-color:#cbdcc5!important}.v-conclusion.observation{border-color:#dfc8a5!important}.v-conclusion.fail{border-color:#e4c2b7!important}

/* ---------- Projects ---------- */
.project-hero{
  background:
    radial-gradient(circle at 86% 0%,rgba(215,189,145,.25),transparent 30%),
    linear-gradient(135deg,#463227,#74543a 62%,#9b764d)!important;
  border:1px solid rgba(255,255,255,.12)!important;
  box-shadow:0 20px 50px rgba(73,50,32,.18)!important;
}
.project-eyebrow{color:#ead7bb!important}.project-hero h3{color:#fffaf1!important}.project-hero p{color:#e9ddcf!important}
.project-summary>div{background:rgba(255,250,240,.10)!important;border-color:rgba(255,255,255,.15)!important}
.project-sidebar-head,.tool-head,.gantt-head,.pdca-editor-head{color:#5a4231}
.project-sidebar-head button{background:#f1e5d4!important;color:#73563a!important;border-color:var(--lux-line)!important}
.project-search{background:#f8efe3!important;border-color:var(--lux-line)!important}
.project-list>*,.project-tab,.tool-tab{border-color:rgba(133,103,77,.13)!important}
.project-tab.active,.tool-tab.active{background:linear-gradient(135deg,#f1e3d0,#e8d5bc)!important;color:#684a31!important;border-color:#d3b990!important}
.project-tab:hover,.tool-tab:hover{background:#f7eee3!important}
.project-code{color:#a07b52!important}.project-meta-line{color:#917d69!important}

/* ---------- Admin ---------- */
.admin-login{background:linear-gradient(145deg,#fffdf8,#f2e6d7)!important;border:1px solid rgba(176,138,87,.16);box-shadow:0 25px 65px rgba(73,50,32,.14)!important}
.admin-login h2,.admin-card h3{color:#5b4332!important}
.admin-toolbar{background:rgba(255,251,245,.94)!important}
.admin-toolbar button{background:#fffaf2!important;border-color:var(--lux-line)!important;color:#735b48!important}

/* ---------- Micro details ---------- */
button,input,select,textarea{font-family:inherit}
button{transition:transform .18s ease,box-shadow .18s ease,background .18s ease}
button:active{transform:translateY(0)!important}
::selection{background:#d9c19a;color:#3d2b20}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:#eee4d7}
::-webkit-scrollbar-thumb{background:linear-gradient(#c5a77a,#9c7950);border-radius:99px;border:2px solid #eee4d7}
::-webkit-scrollbar-thumb:hover{background:#8d6946}

/* A quiet gold rule used throughout the system */
.page-heading::after,.page-header::after{content:"";display:block;position:absolute}
.page-heading,.page-header{position:relative}
.page-heading h2::after,.page-header h2::after,.welcome h2::after{
  content:"";display:block;width:48px;height:2px;margin-top:10px;border-radius:99px;
  background:linear-gradient(90deg,#a47d51,#d9c19a,transparent)
}

@media(max-width:800px){
  .container{padding:20px}
  .topbar{padding:18px 20px}
  .monthly-cover::before{inset:14px}
}

/* ===== QA & QMR Gateway / Landing Screen ===== */
.gateway-screen{
  position:fixed;inset:0;z-index:9999;display:grid;place-items:center;overflow:hidden;
  background:
    radial-gradient(circle at 18% 18%,rgba(215,189,145,.18),transparent 28%),
    radial-gradient(circle at 84% 82%,rgba(255,255,255,.08),transparent 30%),
    linear-gradient(135deg,#241810 0%,#4b3628 48%,#7b5c3f 100%);
  color:#fffaf2;transition:opacity .55s ease,visibility .55s ease;
}
.gateway-screen.is-hidden{opacity:0;visibility:hidden;pointer-events:none}
.gateway-screen::before{content:"";position:absolute;width:900px;height:900px;border:1px solid rgba(215,189,145,.13);border-radius:50%;transform:translate(32%,-28%);box-shadow:0 0 0 80px rgba(215,189,145,.025),0 0 0 160px rgba(215,189,145,.018)}
.gateway-screen::after{content:"";position:absolute;inset:auto -10% -28% -10%;height:48%;background:radial-gradient(ellipse at center,rgba(215,189,145,.16),transparent 62%);filter:blur(8px)}
.gateway-glow{position:absolute;border-radius:50%;filter:blur(55px);pointer-events:none}.gateway-glow-1{width:280px;height:280px;left:8%;top:8%;background:rgba(215,189,145,.11)}.gateway-glow-2{width:360px;height:360px;right:4%;bottom:4%;background:rgba(255,250,240,.08)}
.gateway-panel{position:relative;z-index:2;width:min(720px,88vw);padding:58px 70px 34px;text-align:center;border:1px solid rgba(240,220,190,.22);border-radius:32px;background:linear-gradient(145deg,rgba(255,250,240,.095),rgba(255,255,255,.035));box-shadow:0 35px 100px rgba(0,0,0,.28),inset 0 1px rgba(255,255,255,.14);backdrop-filter:blur(18px)}
.gateway-mark{display:flex;justify-content:center;align-items:center;gap:10px;font-size:13px;font-weight:850;letter-spacing:.18em;color:#ead6b7}.gateway-mark i{width:5px;height:5px;border-radius:50%;background:#d7bd91;box-shadow:0 0 14px rgba(215,189,145,.8)}
.gateway-eyebrow{margin-top:28px;font-size:10px;letter-spacing:.18em;color:#d7c3a8}.gateway-panel h1{margin:12px 0 0;font-size:72px;line-height:1;font-weight:800;letter-spacing:.08em;color:#fffaf2;text-shadow:0 8px 35px rgba(0,0,0,.22)}
.gateway-title{margin:12px 0 0;font-family:Georgia,"Times New Roman",serif;font-size:22px;font-style:italic;color:#d9c19a;letter-spacing:.04em}.gateway-line{width:90px;height:2px;margin:27px auto 22px;background:linear-gradient(90deg,transparent,#d7bd91,transparent)}
.gateway-thai{margin:0;font-size:22px;font-weight:750;color:#fff8ee}.gateway-sub{margin:10px auto 30px;color:#d9cbb9;line-height:1.8;font-size:13px;max-width:470px}
.gateway-enter{display:inline-flex;align-items:center;justify-content:center;gap:34px;min-width:220px;padding:14px 22px;border:1px solid rgba(240,220,190,.45);border-radius:999px;background:linear-gradient(135deg,#d6b982,#a67e4e);color:#2e2118;font:800 14px/1 inherit;cursor:pointer;box-shadow:0 14px 30px rgba(0,0,0,.22),inset 0 1px rgba(255,255,255,.6);transition:transform .2s ease,box-shadow .2s ease,filter .2s ease}.gateway-enter:hover{transform:translateY(-2px);filter:brightness(1.05);box-shadow:0 18px 36px rgba(0,0,0,.28),inset 0 1px rgba(255,255,255,.7)}.gateway-enter b{font-size:22px;font-weight:500}.gateway-foot{display:flex;justify-content:space-between;margin-top:42px;padding-top:16px;border-top:1px solid rgba(255,255,255,.10);font-size:8px;letter-spacing:.14em;color:#bba991}
@media(max-width:700px){.gateway-panel{padding:42px 24px 26px;border-radius:24px}.gateway-panel h1{font-size:52px}.gateway-thai{font-size:19px}.gateway-eyebrow{font-size:8px;letter-spacing:.1em}.gateway-foot{gap:12px;flex-direction:column}}

/* ===== SPC: keep the control chart readable around its actual data ===== */


/* =========================================================
   QA & QMR — RESTORE ORIGINAL LIGHT LUXURY HEADER / WAVE
   Visual refinement only; existing page/data logic remains intact.
   ========================================================= */
body{
  background:
    linear-gradient(rgba(248,243,235,.82),rgba(239,229,215,.90)),
    url('luxury-wave.jpg') center top / cover fixed no-repeat;
  color:#4f4035;
}
body::before{
  opacity:.13;
  background-image:url('luxury-wave.jpg');
  background-size:cover;
  background-position:center top;
  background-repeat:no-repeat;
}
.topbar{
  display:flex!important;align-items:center;justify-content:space-between;gap:20px;
  min-height:86px!important;padding:14px 30px!important;
  background:rgba(255,252,247,.88)!important;
  color:#4f4035!important;
  border-bottom:1px solid rgba(176,138,87,.20)!important;
  box-shadow:0 8px 28px rgba(92,68,45,.08)!important;
  backdrop-filter:blur(16px) saturate(120%);
}
.topbar::after{opacity:.35;border-color:rgba(176,138,87,.16);}
.brand-block{display:flex;align-items:center;gap:14px;min-width:300px;position:relative;z-index:2}
.company-logo{width:104px;height:auto;max-height:55px;object-fit:contain;display:block;border-radius:4px}
.brand-copy h1{margin:0!important;font-size:25px!important;color:#5b4434!important;letter-spacing:-.02em!important}
.brand-copy p{margin:4px 0 0!important;color:#8c7663!important;font-size:12px!important}
.header-search{display:flex;align-items:center;gap:8px;width:min(310px,22vw);min-width:210px;height:40px;padding:0 10px 0 13px;border:1px solid rgba(176,138,87,.20);border-radius:999px;background:rgba(255,255,255,.78);box-shadow:inset 0 1px 3px rgba(73,50,32,.03),0 5px 18px rgba(73,50,32,.05);position:relative;z-index:22}
.header-search>span{font-size:23px;line-height:1;color:#b08a57;transform:rotate(-15deg)}
.header-search input{width:100%;border:0!important;outline:0;background:transparent!important;box-shadow:none!important;color:#594535!important;font-size:12px!important}
.header-search input::placeholder{color:#b09b87}
.header-search kbd{font-size:9px;color:#a18b77;background:#f6eee3;border:1px solid #eadcc9;border-radius:6px;padding:3px 5px;white-space:nowrap}
.year-box{min-width:165px!important;background:rgba(255,255,255,.70)!important;color:#6c5645!important;border:1px solid rgba(176,138,87,.18)!important;box-shadow:0 5px 18px rgba(73,50,32,.05)!important;padding:8px 13px!important;border-radius:12px!important;position:relative;z-index:2}
.year-box span{color:#6a503d!important}.year-box small{color:#967e69!important}.year-box em{color:#a3835f!important}
.main-nav{
  position:absolute!important;top:22px;left:50%;transform:translateX(-50%);z-index:21;
  width:auto!important;padding:0!important;margin:0!important;background:transparent!important;border:0!important;box-shadow:none!important;backdrop-filter:none!important;
}
.nav-primary{display:flex;align-items:center;gap:4px;white-space:nowrap}
.nav-btn{background:transparent!important;border:1px solid transparent!important;color:#6d5747!important;font-weight:700!important;padding:10px 12px!important;border-radius:13px!important;box-shadow:none!important}
.nav-btn:hover{background:rgba(255,255,255,.70)!important;color:#4e3a2d!important}
.nav-btn.active{background:rgba(255,255,255,.88)!important;border-color:rgba(176,138,87,.28)!important;box-shadow:0 5px 16px rgba(107,79,58,.08),inset 0 1px rgba(255,255,255,.95)!important;color:#4f3a2c!important}
.nav-report,.nav-report.active{background:linear-gradient(135deg,#b18b60,#d2b88e)!important;border-color:#b99a70!important;color:#fffaf1!important;box-shadow:0 7px 18px rgba(107,79,58,.15),inset 0 1px rgba(255,255,255,.35)!important}
.nav-more>summary{background:rgba(255,255,255,.75)!important;border:1px solid rgba(176,138,87,.18)!important;color:#6d5747!important}
.nav-more-menu{margin-top:7px}
.gateway-screen{
  background:
    linear-gradient(rgba(249,244,237,.74),rgba(235,225,211,.88)),
    url('luxury-wave.jpg') center / cover no-repeat!important;
  color:#5b4636!important;
}
.gateway-screen::before{border-color:rgba(176,138,87,.20)!important;box-shadow:0 0 0 80px rgba(176,138,87,.035),0 0 0 160px rgba(176,138,87,.022)!important}
.gateway-screen::after{background:radial-gradient(ellipse at center,rgba(215,189,145,.18),transparent 62%)!important}
.gateway-panel{background:rgba(255,252,247,.55)!important;border-color:rgba(176,138,87,.22)!important;box-shadow:0 30px 80px rgba(73,50,32,.12),inset 0 1px rgba(255,255,255,.85)!important;backdrop-filter:blur(18px)!important}
.gateway-logo{position:absolute;left:30px;top:24px;width:118px;height:auto;object-fit:contain;z-index:5;filter:drop-shadow(0 4px 8px rgba(73,50,32,.10))}
.gateway-mark{color:#9a7b57!important}.gateway-eyebrow{color:#9c866e!important}.gateway-panel h1{color:#5b4434!important;text-shadow:none!important}.gateway-title{color:#a07b52!important}.gateway-thai{color:#5b4434!important}.gateway-sub{color:#806b58!important}.gateway-enter{background:linear-gradient(135deg,#d7bc91,#b08a57)!important;color:#3d2b20!important}.gateway-foot{color:#9d8974!important;border-top-color:rgba(107,79,58,.12)!important}
.spc-chart-card .chart-wrapper{padding:4px 8px 8px!important}
.spc-chart-card canvas{filter:drop-shadow(0 2px 3px rgba(73,50,32,.025))}

@media(max-width:1350px){
  .brand-copy p{display:none}
  .company-logo{width:92px}
  .brand-block{min-width:220px}
  .header-search{width:220px;min-width:180px}
  .nav-btn{padding:9px 8px!important;font-size:12px!important}
}
@media(max-width:1100px){
  .main-nav{position:static!important;transform:none!important;width:100%!important;padding:6px 10px!important;background:rgba(255,250,243,.88)!important;border-bottom:1px solid var(--lux-line)!important;overflow-x:auto}
  .topbar{min-height:78px!important}
  .header-search{width:250px}
}
@media(max-width:700px){
  .topbar{padding:12px 16px!important;gap:10px}
  .company-logo{width:78px}.brand-block{min-width:0}.brand-copy h1{font-size:18px!important}
  .header-search{display:none}.year-box{min-width:110px!important}.year-box em{display:none}
  .gateway-logo{left:18px;top:18px;width:92px}
}
/* v4 refinement: keep the gateway look, restore the light ivory/gold interior */
.monthly-cover{
  background:
    radial-gradient(circle at 86% 8%,rgba(215,189,145,.30),transparent 30%),
    linear-gradient(135deg,#fffdf8 0%,#f8f0e4 58%,#efe2d0 100%)!important;
  color:#5b4434!important;
  border:1px solid rgba(176,138,87,.16)!important;
  box-shadow:0 18px 50px rgba(73,50,32,.08)!important;
}
.monthly-cover h2{color:#5b4434!important}.monthly-cover p,.monthly-cover-foot{color:#8f7964!important}.monthly-cover-line{background:linear-gradient(90deg,transparent,#b08a57,transparent)!important}
.spc-hero,.dcc-hero{
  background:
    radial-gradient(circle at 90% 0%,rgba(215,189,145,.30),transparent 30%),
    linear-gradient(135deg,#fffdf8 0%,#f7efe3 60%,#eee0cc 100%)!important;
  color:#5b4434!important;
  border:1px solid rgba(176,138,87,.18)!important;
  box-shadow:var(--lux-shadow)!important;
}
.spc-hero::after,.dcc-hero::after{border-color:rgba(176,138,87,.18)!important;box-shadow:0 0 0 28px rgba(176,138,87,.035),0 0 0 56px rgba(176,138,87,.022)!important}
.dcc-eyebrow,.eyebrow,.monthly-kicker{color:#9b7b58!important}.spc-hero h3,.dcc-hero h3{color:#5b4434!important}.spc-hero p,.dcc-hero p{color:#806b58!important}.spc-stat-row>div,.dcc-total{background:rgba(255,255,255,.58)!important;border-color:rgba(176,138,87,.18)!important;box-shadow:inset 0 1px rgba(255,255,255,.85)!important}.spc-stat-row b,.dcc-total span{color:#6b4f3a}.spc-stat-row span,.dcc-total small{color:#8d7763;opacity:1}
/* Desktop header: brand | navigation | search | clock, all on one clean row */
.topbar{display:grid!important;grid-template-columns:minmax(300px,1fr) auto minmax(220px,310px) 175px;align-items:center;gap:18px;min-height:88px!important;padding:12px 30px!important;overflow:visible!important}
.brand-block{min-width:0!important}.main-nav{position:static!important;transform:none!important;width:auto!important;margin:0!important;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important;backdrop-filter:none!important;z-index:30!important}.nav-primary{justify-content:center}.nav-btn{white-space:nowrap}.nav-more{z-index:40}.nav-more-menu{right:0;left:auto;z-index:60}.header-search{width:100%!important;min-width:0!important;z-index:50}
.admin-help{align-self:center;padding:12px 14px;border:1px solid rgba(176,138,87,.14);border-radius:11px;background:rgba(255,253,248,.72);color:#8b7561;font-size:13px;font-weight:600}
.admin-grid select[multiple]{min-height:135px;padding:8px!important;line-height:1.55}
#spcSamplesSelect{min-width:260px!important;max-width:360px}
#mrSpcSamplesSelect{min-width:100%!important}
@media(max-width:1500px){.topbar{grid-template-columns:minmax(250px,1fr) auto minmax(190px,240px) 155px;gap:10px}.nav-btn{padding:9px 8px!important;font-size:12px!important}.company-logo{width:92px}.brand-copy h1{font-size:22px!important}}
@media(max-width:1250px){.topbar{grid-template-columns:1fr auto 190px;grid-template-areas:"brand search clock" "nav nav nav"}.brand-block{grid-area:brand}.header-search{grid-area:search}.year-box{grid-area:clock}.main-nav{grid-area:nav;justify-self:center}.topbar{padding-bottom:8px!important}}
@media(max-width:700px){.topbar{display:flex!important;flex-wrap:wrap;gap:10px}.brand-block{flex:1}.header-search{display:none!important}.year-box{min-width:120px!important}.main-nav{order:3;width:100%!important;overflow-x:auto}.nav-primary{justify-content:flex-start}.monthly-cover{background:linear-gradient(135deg,#fffdf8,#f3e8d8)!important}}


/* v5 header refinement: stable desktop grid, no overlap, accessible More menu */
.topbar{
  display:grid!important;
  grid-template-columns:minmax(300px,1fr) auto minmax(220px,280px) 165px!important;
  grid-template-areas:"brand nav search clock"!important;
  align-items:center!important;
  gap:12px!important;
  min-height:88px!important;
  padding:12px 22px!important;
  position:relative!important;
  overflow:visible!important;
  isolation:isolate!important;
}
.brand-block{grid-area:brand!important;min-width:0!important;z-index:2!important}
.main-nav{grid-area:nav!important;position:relative!important;top:auto!important;left:auto!important;transform:none!important;justify-self:center!important;width:auto!important;margin:0!important;padding:0!important;z-index:100!important}
.nav-primary{display:flex!important;align-items:center!important;justify-content:center!important;gap:2px!important;white-space:nowrap!important}
.nav-btn{padding:8px 9px!important;font-size:12px!important;line-height:1.2!important;white-space:nowrap!important}
.nav-icon{font-size:15px!important}
.nav-report{padding-left:10px!important;padding-right:10px!important}
.nav-more{position:relative!important;z-index:1000!important;flex:0 0 auto!important}
.nav-more>summary{display:flex!important;align-items:center!important;justify-content:center!important;gap:5px!important;min-height:38px!important;padding:8px 11px!important;border-radius:12px!important;cursor:pointer!important;white-space:nowrap!important;list-style:none!important}
.nav-more-menu{position:absolute!important;top:calc(100% + 8px)!important;right:0!important;left:auto!important;width:250px!important;padding:8px!important;display:flex!important;flex-direction:column!important;gap:3px!important;background:rgba(255,252,247,.99)!important;border:1px solid rgba(176,138,87,.24)!important;border-radius:15px!important;box-shadow:0 18px 40px rgba(73,50,32,.18)!important;backdrop-filter:blur(18px)!important;z-index:99999!important}
.nav-more-menu .nav-btn{width:100%!important;text-align:left!important;border-radius:10px!important}
.header-search{grid-area:search!important;width:100%!important;min-width:0!important;z-index:50!important}
.year-box{grid-area:clock!important;min-width:0!important;width:100%!important;z-index:50!important}
.monthly-report{background:transparent!important}
.report-section{background:rgba(255,252,247,.88)!important;border:1px solid rgba(176,138,87,.13)!important}
.report-kpi{background:linear-gradient(145deg,#fffdf8,#f5eadb)!important;border-color:rgba(176,138,87,.16)!important}
.report-chart-box{background:linear-gradient(145deg,#fffdf8,#f5eadb)!important;border-color:rgba(176,138,87,.14)!important}
@media(max-width:1550px){
  .topbar{grid-template-columns:minmax(270px,1fr) auto minmax(190px,230px) 150px!important;gap:8px!important;padding-left:18px!important;padding-right:18px!important}
  .nav-btn{padding-left:7px!important;padding-right:7px!important;font-size:11.5px!important}
  .nav-icon{font-size:14px!important}
}
@media(max-width:1250px){
  .topbar{grid-template-columns:1fr auto 180px!important;grid-template-areas:"brand search clock" "nav nav nav"!important;row-gap:7px!important}
  .main-nav{justify-self:center!important;width:100%!important}
  .nav-primary{justify-content:center!important;overflow-x:auto!important;padding-bottom:2px!important}
}
@media(max-width:700px){
  .topbar{display:flex!important;flex-wrap:wrap!important;align-items:center!important}
  .brand-block{flex:1 1 auto!important}
  .header-search{display:none!important}
  .year-box{width:auto!important;min-width:120px!important}
  .main-nav{order:3!important;width:100%!important;overflow-x:auto!important}
  .nav-primary{justify-content:flex-start!important}
}

/* v6: Final Steel + robust More menu stacking */
.final-head-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.admin-only-note{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:800;color:#8b6a49;background:rgba(176,138,87,.09);border:1px solid rgba(176,138,87,.2);padding:8px 11px;border-radius:999px}.final-mode-tabs{display:flex;gap:8px;margin:0 0 16px;padding:6px;background:rgba(255,251,245,.78);border:1px solid rgba(176,138,87,.15);border-radius:16px;width:max-content}.final-mode-tab{border:1px solid transparent;background:transparent;color:#765c46;padding:10px 18px;border-radius:11px;font-weight:800;cursor:pointer}.final-mode-tab.active{background:linear-gradient(135deg,#73543b,#b48b4e);color:#fffaf0;box-shadow:0 6px 18px rgba(73,50,32,.16)}.final-steel-panel[hidden],#finalHosePanel[hidden]{display:none!important}.steel-source-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 16px;padding:13px 16px;background:rgba(255,251,245,.82);border:1px solid rgba(176,138,87,.15);border-radius:15px}.steel-source-bar .steel-import-btn{padding:9px 13px}.steel-report-mini{margin-top:18px;padding:18px;border:1px solid rgba(176,138,87,.16);border-radius:18px;background:linear-gradient(145deg,#fffdf8,#f7eddf)}.steel-report-mini>div:first-child{display:flex;gap:10px;align-items:baseline;justify-content:space-between;flex-wrap:wrap}.steel-report-mini>div:first-child span{font-size:12px;color:#9b856f}.steel-report-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:14px 0}.steel-report-kpis span{padding:11px 12px;border-radius:12px;background:rgba(255,255,255,.7);border:1px solid rgba(176,138,87,.12);color:#8a7461}.steel-report-kpis b{display:block;font-size:22px;color:#6e4d32}.steel-report-chart{height:250px!important}.steel-report-mini .insight-box{margin-top:12px}
/* v6 header/dropdown fix: keep More menu above Monthly Report and every page layer */
.topbar{position:relative!important;z-index:10000!important;isolation:isolate!important;overflow:visible!important}
.main-nav{z-index:10010!important}
.nav-more{z-index:10050!important}
.nav-more-menu{z-index:100000!important;pointer-events:auto!important}
.nav-more-menu .nav-btn{position:relative!important;z-index:100001!important;pointer-events:auto!important}
.monthly-report,.monthly-cover,.report-section{position:relative;z-index:1}
@media(max-width:1250px){.topbar{z-index:10000!important}.main-nav{z-index:10010!important}}

/* v7: gateway must cover the application header */
.gateway-screen{z-index:1000000!important;}
.gateway-logo{z-index:5;}
body:has(.gateway-screen:not(.is-hidden)){overflow:hidden;}
.final-mode-tabs{position:relative;z-index:3;margin:0 0 16px;}
.admin-check{display:flex;align-items:center;gap:8px;padding-top:28px;font-weight:700;color:#6d5747;}
.admin-check input{width:18px;height:18px;accent-color:#b08a57;}
.steel-report-period{font-size:12px;color:#9b856f;}

/* V9: deterministic More menu fix. Data/API logic is unchanged from V7. */
.nav-more{position:relative!important;z-index:10050!important;flex:0 0 auto!important}
.nav-more-toggle{
  display:flex!important;align-items:center!important;justify-content:center!important;gap:5px!important;
  min-height:38px!important;padding:8px 11px!important;border:0!important;border-radius:12px!important;
  background:transparent!important;color:#6b5747!important;font:inherit!important;font-weight:750!important;
  cursor:pointer!important;white-space:nowrap!important;
}
.nav-more-toggle:hover{background:rgba(255,255,255,.55)!important}
.nav-more-menu[hidden]{display:none!important}
.nav-more-menu:not([hidden]){display:flex!important}
.nav-more-menu{
  position:absolute!important;top:calc(100% + 8px)!important;right:0!important;left:auto!important;width:250px!important;
  padding:8px!important;flex-direction:column!important;gap:3px!important;
  background:rgba(255,252,247,.99)!important;border:1px solid rgba(176,138,87,.24)!important;
  border-radius:15px!important;box-shadow:0 18px 40px rgba(73,50,32,.18)!important;
  backdrop-filter:blur(18px)!important;z-index:99999!important;pointer-events:auto!important;
}
.nav-more-menu .nav-btn{width:100%!important;text-align:left!important;border-radius:10px!important;position:relative!important;z-index:100001!important;pointer-events:auto!important}


/* =========================================================
   V12 — 3D DOCUMENT CONTROL CENTER
   Scope is intentionally limited to #documentPage only.
   ========================================================= */
#documentPage .dcc3d-page{
  --dcc-bg:#f4eee4;
  --dcc-surface:rgba(255,252,247,.91);
  --dcc-ink:#4b392b;
  --dcc-muted:#907967;
  --dcc-line:rgba(116,84,58,.16);
  --dcc-brown:#6d503a;
  --dcc-gold:#b28a55;
  --dcc-shadow:0 24px 62px rgba(71,48,30,.13);
  min-height:calc(100vh - 130px);
}
#documentPage .dcc3d-page-head{
  align-items:center;margin-bottom:14px;padding:2px 2px 0;
}
#documentPage .dcc3d-page-head h2{margin:4px 0 3px;font:800 27px/1.15 Georgia,"Leelawadee UI",serif;color:#5d432f}
#documentPage .dcc3d-page-head p{margin:0;color:#927c69;font-size:12px}
#documentPage .dcc3d-eyebrow{font-size:9px;font-weight:900;letter-spacing:.18em;color:#b28a55}
#documentPage .dcc3d-status{
  padding:9px 13px;border:1px solid var(--dcc-line);border-radius:999px;background:rgba(255,255,255,.58);
  color:#80664f;font-size:11px;font-weight:800;white-space:nowrap
}

#documentPage .dcc3d-toolbar{
  position:relative;z-index:8;display:flex;align-items:center;gap:8px;min-height:56px;padding:9px 11px;
  border:1px solid var(--dcc-line);border-radius:17px 17px 0 0;
  background:rgba(255,252,247,.84);backdrop-filter:blur(18px);
  box-shadow:0 10px 28px rgba(64,42,25,.06)
}
#documentPage .dcc3d-search{
  flex:1;min-width:220px;max-width:390px;display:flex;align-items:center;gap:8px;padding:8px 11px;
  background:#fff;border:1px solid var(--dcc-line);border-radius:12px;color:#9b8068
}
#documentPage .dcc3d-search input{width:100%;border:0!important;outline:0!important;background:transparent!important;padding:0!important;color:var(--dcc-ink);font:inherit;font-size:12px}
#documentPage .dcc3d-chips{display:flex;gap:5px;align-items:center;overflow-x:auto;scrollbar-width:none}
#documentPage .dcc3d-chip,
#documentPage .dcc3d-view-btn,
#documentPage .dcc3d-reset{
  border:1px solid var(--dcc-line);background:rgba(255,255,255,.68);color:#765b45;
  border-radius:999px;padding:7px 10px;cursor:pointer;font-size:10px;font-weight:850;white-space:nowrap
}
#documentPage .dcc3d-chip span{display:inline-grid;place-items:center;min-width:17px;height:17px;margin-left:5px;padding:0 4px;border-radius:999px;background:rgba(110,80,58,.08);font-size:8px}
#documentPage .dcc3d-chip.active,
#documentPage .dcc3d-view-btn.active{background:#6c4f39;color:#fff;border-color:#6c4f39;box-shadow:0 5px 14px rgba(76,51,32,.14)}
#documentPage .dcc3d-chip.active span{background:rgba(255,255,255,.16)}
#documentPage .dcc3d-select{
  min-width:125px;border:1px solid var(--dcc-line);border-radius:11px;padding:7px 9px!important;background:rgba(255,255,255,.72)!important;color:#735a45!important;font-size:10px!important
}
#documentPage .dcc3d-view-switch{display:flex;gap:5px;margin-left:auto}

#documentPage .dcc3d-workspace{
  display:grid;grid-template-columns:minmax(0,1fr) 292px;min-height:620px;
  overflow:hidden;border:1px solid var(--dcc-line);border-top:0;border-radius:0 0 22px 22px;
  background:
    radial-gradient(circle at 13% 5%,rgba(255,255,255,.95),transparent 28%),
    radial-gradient(circle at 85% 12%,rgba(214,191,154,.22),transparent 30%),
    linear-gradient(145deg,#f7f2ea,#eae0d2);
  box-shadow:var(--dcc-shadow)
}
#documentPage .dcc3d-stage{
  position:relative;min-width:0;min-height:620px;overflow:hidden;perspective:1500px;
}
#documentPage .dcc3d-stage::before{
  content:"";position:absolute;left:10%;right:10%;bottom:10%;height:90px;border-radius:50%;
  background:radial-gradient(ellipse,rgba(68,45,28,.17),transparent 70%);filter:blur(14px);
  transform:rotateX(62deg);pointer-events:none
}
#documentPage .dcc3d-stage-title{
  position:absolute;left:20px;right:20px;top:15px;z-index:5;display:flex;justify-content:space-between;align-items:center;
  color:#88715f;font-size:10px
}
#documentPage .dcc3d-stage-title span{font-weight:800;color:#725842}
#documentPage .dcc3d-stage-title small{font-size:9px;color:#a18b78}

#documentPage .dcc3d-gallery{
  position:absolute;left:50%;top:52%;width:min(860px,92%);height:500px;
  transform:translate(-50%,-50%);transform-style:preserve-3d;touch-action:none;user-select:none;cursor:grab
}
#documentPage .dcc3d-gallery.dragging{cursor:grabbing}
#documentPage .dcc3d-book{
  --dcc-x:0px;--dcc-z:0px;--dcc-ry:0deg;--dcc-scale:1;--dcc-opacity:1;--dcc-blur:0px;
  position:absolute;left:50%;top:50%;width:224px;height:314px;padding:0;border:0;background:transparent;
  transform:translate(-50%,-50%) translateX(var(--dcc-x)) translateZ(var(--dcc-z)) rotateY(var(--dcc-ry)) scale(var(--dcc-scale));
  transform-style:preserve-3d;opacity:var(--dcc-opacity);filter:blur(var(--dcc-blur));
  transition:transform .52s cubic-bezier(.2,.8,.2,1),opacity .42s,filter .42s;
  cursor:pointer;outline:none
}
#documentPage .dcc3d-book:focus-visible .dcc3d-book-cover{box-shadow:0 0 0 3px rgba(178,138,85,.36),0 32px 70px rgba(62,40,24,.25)}
#documentPage .dcc3d-book-cover{
  display:block;position:absolute;inset:0;overflow:hidden;border-radius:10px 17px 17px 10px;
  border:1px solid rgba(255,255,255,.56);
  background:
    linear-gradient(115deg,transparent 0 37%,rgba(255,255,255,.12) 43%,transparent 49%),
    radial-gradient(circle at 88% 4%,rgba(255,255,255,.20),transparent 27%),
    linear-gradient(145deg,#6f503b,#ad8560);
  box-shadow:0 25px 55px rgba(61,40,25,.20),inset 8px 0 18px rgba(0,0,0,.11),inset -1px 0 rgba(255,255,255,.26)
}
#documentPage .dcc3d-cat-PR .dcc3d-book-cover{background:linear-gradient(115deg,transparent 0 37%,rgba(255,255,255,.12) 43%,transparent 49%),linear-gradient(145deg,#704b3c,#b07860)}
#documentPage .dcc3d-cat-WI .dcc3d-book-cover{background:linear-gradient(115deg,transparent 0 37%,rgba(255,255,255,.12) 43%,transparent 49%),linear-gradient(145deg,#3e6267,#7e9f9c)}
#documentPage .dcc3d-cat-SD .dcc3d-book-cover{background:linear-gradient(115deg,transparent 0 37%,rgba(255,255,255,.12) 43%,transparent 49%),linear-gradient(145deg,#69613d,#aaa06a)}
#documentPage .dcc3d-cat-FM .dcc3d-book-cover{background:linear-gradient(115deg,transparent 0 37%,rgba(255,255,255,.12) 43%,transparent 49%),linear-gradient(145deg,#65536d,#9b86a5)}
#documentPage .dcc3d-cat-OTHER .dcc3d-book-cover{background:linear-gradient(115deg,transparent 0 37%,rgba(255,255,255,.12) 43%,transparent 49%),linear-gradient(145deg,#526579,#8598aa)}
#documentPage .dcc3d-book-cover::before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:18px;
  background:linear-gradient(90deg,rgba(0,0,0,.16),rgba(255,255,255,.08),transparent);
  border-right:1px solid rgba(255,255,255,.16)
}
#documentPage .dcc3d-book-pages{
  position:absolute;right:-7px;top:8px;bottom:8px;width:10px;border-radius:0 7px 7px 0;transform:translateZ(-3px);
  background:repeating-linear-gradient(0deg,#fbf5eb 0 2px,#dfd1bf 2px 3px);box-shadow:2px 0 6px rgba(52,34,22,.13)
}
#documentPage .dcc3d-book-spine{
  position:absolute;left:-37px;top:50%;transform:rotate(-90deg) translateY(-50%);transform-origin:center;
  color:rgba(255,255,255,.47);font-size:7px;letter-spacing:.15em;white-space:nowrap
}
#documentPage .dcc3d-book-top{position:absolute;left:29px;right:20px;top:27px;color:rgba(255,255,255,.80);font-size:8px;letter-spacing:.13em;font-weight:900;text-align:left}
#documentPage .dcc3d-book-code{position:absolute;left:29px;right:20px;top:54px;color:#fff;font:800 25px/1.05 Georgia,serif;letter-spacing:.02em;text-align:left}
#documentPage .dcc3d-book-title{position:absolute;left:29px;right:20px;top:115px;color:#fff;font-size:14px;line-height:1.34;font-weight:800;text-align:left}
#documentPage .dcc3d-book-rule{position:absolute;left:29px;right:20px;top:188px;height:1px;background:rgba(255,255,255,.32)}
#documentPage .dcc3d-book-meta{position:absolute;left:29px;right:20px;top:204px;color:rgba(255,255,255,.72);font-size:8px;line-height:1.75;text-align:left;font-style:normal}
#documentPage .dcc3d-book-seal{
  position:absolute;right:20px;bottom:23px;width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,.48);
  display:grid;place-items:center;color:#fff;font:700 8px/1 Georgia,serif;text-align:center;transform:rotate(-9deg)
}
#documentPage .dcc3d-book.active .dcc3d-book-cover{
  box-shadow:0 38px 84px rgba(60,39,23,.28),0 0 0 1px rgba(178,138,85,.31),inset 8px 0 18px rgba(0,0,0,.11)
}

#documentPage .dcc3d-arrow{
  position:absolute;top:52%;z-index:6;width:44px;height:44px;border-radius:50%;border:1px solid var(--dcc-line);
  background:rgba(255,252,247,.76);color:#755941;font-size:23px;cursor:pointer;
  box-shadow:0 10px 24px rgba(67,44,27,.10);backdrop-filter:blur(10px);transition:.18s
}
#documentPage .dcc3d-arrow:hover{background:#fff;transform:scale(1.06)}
#documentPage .dcc3d-prev{left:17px}
#documentPage .dcc3d-next{right:17px}
#documentPage .dcc3d-index{
  position:absolute;left:50%;bottom:21px;transform:translateX(-50%);z-index:6;
  display:flex;gap:5px;align-items:center;justify-content:center;max-width:72%;padding:7px 10px;
  border:1px solid var(--dcc-line);border-radius:999px;background:rgba(255,252,247,.72);backdrop-filter:blur(12px)
}
#documentPage .dcc3d-dot{width:5px;height:5px;padding:0;border:0;border-radius:50%;background:#b7a28f;cursor:pointer;transition:.22s}
#documentPage .dcc3d-dot.active{width:21px;border-radius:8px;background:#6e513b}
#documentPage .dcc3d-counter{font-size:10px;font-weight:850;color:#755c48}

#documentPage .dcc3d-preview{
  position:relative;z-index:4;padding:29px 21px;border-left:1px solid var(--dcc-line);
  background:rgba(255,251,245,.70);backdrop-filter:blur(17px);overflow:auto
}
#documentPage .dcc3d-preview-kicker{font-size:8px;letter-spacing:.17em;font-weight:900;color:#b28a55}
#documentPage .dcc3d-preview-category{
  display:inline-flex;margin-top:12px;padding:5px 8px;border-radius:999px;background:rgba(111,80,57,.08);
  color:#816650;font-size:8px;font-weight:900;letter-spacing:.05em
}
#documentPage .dcc3d-preview h3{margin:11px 0 8px;color:#5e4431;font:700 24px/1.14 Georgia,"Leelawadee UI",serif}
#documentPage .dcc3d-preview-path{margin:0 0 18px;color:#9a8573;font-size:9px;line-height:1.55;overflow-wrap:anywhere}
#documentPage .dcc3d-info-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-bottom:18px}
#documentPage .dcc3d-info-grid>div{padding:9px 10px;border:1px solid var(--dcc-line);border-radius:11px;background:rgba(255,255,255,.65)}
#documentPage .dcc3d-info-grid small{display:block;margin-bottom:3px;color:#a08a77;font-size:8px}
#documentPage .dcc3d-info-grid b{display:block;color:#6a503b;font-size:10px;overflow-wrap:anywhere}
#documentPage .dcc3d-info-grid .dcc3d-info-wide{grid-column:1/-1}
#documentPage .dcc3d-action{
  display:flex;align-items:center;justify-content:center;width:100%;margin-top:7px;padding:11px 12px;border-radius:12px;
  text-decoration:none!important;font-size:11px;font-weight:900;transition:.18s
}
#documentPage .dcc3d-action.primary{background:linear-gradient(135deg,#73533c,#9b7552);color:#fffaf0;box-shadow:0 10px 22px rgba(70,46,28,.14)}
#documentPage .dcc3d-action.secondary{border:1px solid var(--dcc-line);background:rgba(255,255,255,.70);color:#6e523d}
#documentPage .dcc3d-action:hover{transform:translateY(-1px)}
#documentPage .dcc3d-action.disabled{opacity:.4;pointer-events:none}
#documentPage .dcc3d-help{margin-top:22px;padding-top:15px;border-top:1px solid var(--dcc-line);color:#998370;font-size:9px;line-height:1.65}
#documentPage .dcc3d-help b{display:block;margin-bottom:4px;color:#745a44}
#documentPage .dcc3d-help span{display:block}

#documentPage .dcc3d-empty{
  position:absolute;inset:0;z-index:7;display:grid;place-items:center;align-content:center;text-align:center;color:#8f7864
}
#documentPage .dcc3d-empty[hidden]{display:none!important}
#documentPage .dcc3d-empty-icon{font-size:43px;margin-bottom:8px}
#documentPage .dcc3d-empty h3{margin:0 0 5px;color:#654b37}
#documentPage .dcc3d-empty p{margin:0;font-size:11px}

@media(max-width:1200px){
  #documentPage .dcc3d-toolbar{flex-wrap:wrap}
  #documentPage .dcc3d-search{max-width:none;flex:1 1 320px}
  #documentPage .dcc3d-view-switch{margin-left:0}
}
@media(max-width:980px){
  #documentPage .dcc3d-workspace{grid-template-columns:1fr}
  #documentPage .dcc3d-preview{display:none}
  #documentPage .dcc3d-stage{min-height:610px}
}
@media(max-width:700px){
  #documentPage .dcc3d-page-head{align-items:flex-start}
  #documentPage .dcc3d-status{display:none}
  #documentPage .dcc3d-select{min-width:0;flex:1}
  #documentPage .dcc3d-view-switch{width:100%}
  #documentPage .dcc3d-view-btn{flex:1}
  #documentPage .dcc3d-stage{min-height:525px}
  #documentPage .dcc3d-gallery{height:430px;width:96%}
  #documentPage .dcc3d-book{width:188px;height:264px}
  #documentPage .dcc3d-book-code{font-size:21px;top:47px}
  #documentPage .dcc3d-book-title{font-size:12px;top:101px}
  #documentPage .dcc3d-book-rule{top:158px}
  #documentPage .dcc3d-book-meta{top:174px}
  #documentPage .dcc3d-book-seal{width:39px;height:39px;bottom:18px}
}


/* =========================================================
   V14 — MONTHLY REPORT LAMP PRESENTATION
   Strictly scoped to #monthlyPage. No other page is affected.
   The lamp is normal document flow/absolute inside the cover,
   never fixed/sticky, so it scrolls away naturally with the cover.
   ========================================================= */

#monthlyPage .monthly-cover{
  position:relative!important;
  min-height:490px!important;
  overflow:hidden!important;
  isolation:isolate!important;
  transition:background .85s ease,box-shadow .85s ease,filter .85s ease!important;
}
#monthlyPage .monthly-cover-content{
  position:relative;
  z-index:5;
  width:min(72%,980px);
  transition:opacity .7s ease,filter .7s ease,transform .7s ease;
}
#monthlyPage .monthly-cover-content h2{
  max-width:920px!important;
}

/* OFF: cover remains faintly visible, like a room with very little ambient light. */
#monthlyPage.report-lamp-off .monthly-cover{
  background:
    radial-gradient(circle at 77% 31%,rgba(207,169,111,.055),transparent 22%),
    linear-gradient(135deg,#211b17 0%,#2e251f 48%,#1b1714 100%)!important;
  box-shadow:0 18px 54px rgba(18,12,8,.24)!important;
}
#monthlyPage.report-lamp-off .monthly-cover::before{
  content:"";
  position:absolute;
  inset:24px;
  z-index:3;
  border:1px solid rgba(255,243,225,.055)!important;
  border-radius:28px;
  pointer-events:none;
}
#monthlyPage.report-lamp-off .monthly-cover-content{
  opacity:.31;
  filter:brightness(.72) saturate(.55);
}
#monthlyPage.report-lamp-off .monthly-cover-content h2,
#monthlyPage.report-lamp-off .monthly-kicker,
#monthlyPage.report-lamp-off .monthly-cover-content p,
#monthlyPage.report-lamp-off .monthly-cover-foot{
  color:#d8c9b8!important;
  text-shadow:none!important;
}

/* ON: restore the original ivory/gold cover. */
#monthlyPage.report-lamp-on .monthly-cover{
  background:
    radial-gradient(circle at 83% 18%,rgba(232,199,143,.39),transparent 31%),
    radial-gradient(circle at 68% 53%,rgba(255,239,204,.26),transparent 34%),
    linear-gradient(135deg,#fffdf8 0%,#f8f0e4 58%,#efe2d0 100%)!important;
  color:#5b4434!important;
  border:1px solid rgba(176,138,87,.16)!important;
  box-shadow:0 18px 50px rgba(73,50,32,.10)!important;
}
#monthlyPage.report-lamp-on .monthly-cover-content{
  opacity:1;
  filter:none;
}

/* ----------------- physical lamp ----------------- */
#monthlyPage .monthly-lamp-zone{
  position:absolute;
  z-index:10;
  right:7.2%;
  top:48px;
  width:230px;
  height:365px;
  display:flex;
  align-items:center;
  justify-content:center;
  pointer-events:none;
}
#monthlyPage .monthly-lamp{
  position:absolute;
  top:2px;
  left:18px;
  width:195px;
  height:305px;
  margin:0;
  padding:0;
  border:0;
  background:transparent;
  cursor:pointer;
  pointer-events:auto;
  filter:drop-shadow(0 17px 20px rgba(0,0,0,.18));
  outline:none;
}
#monthlyPage .monthly-lamp:focus-visible{
  outline:2px solid rgba(208,166,101,.68);
  outline-offset:7px;
  border-radius:28px;
}
#monthlyPage .monthly-lamp-shade{
  position:absolute;
  left:23px;
  top:25px;
  width:149px;
  height:75px;
  z-index:5;
  clip-path:polygon(22% 8%,78% 8%,97% 76%,93% 90%,7% 90%,3% 76%);
  border-radius:50% 50% 20% 20%;
  background:linear-gradient(180deg,#d8cbbb 0%,#9d9184 100%);
  box-shadow:inset 0 1px rgba(255,255,255,.18);
  transition:filter .45s ease,background .45s ease,transform .22s ease;
}
#monthlyPage .monthly-lamp-shade::after{
  content:"";
  position:absolute;
  left:13px;right:13px;bottom:6px;height:9px;
  border-radius:50%;
  background:#81776d;
  box-shadow:inset 0 2px 4px rgba(0,0,0,.20);
}
#monthlyPage .monthly-lamp:hover .monthly-lamp-shade{transform:translateY(-2px)}
#monthlyPage .monthly-lamp-bulb{
  position:absolute;left:76px;top:89px;width:43px;height:23px;z-index:4;
  border-radius:0 0 50% 50%;
  background:#393431;
  transition:background .45s ease,box-shadow .55s ease;
}
#monthlyPage .monthly-lamp-stem{
  position:absolute;left:92px;top:107px;width:11px;height:151px;
  border-radius:6px;
  background:linear-gradient(90deg,#8c8175,#ddd2c4,#6f675f);
  box-shadow:0 2px 5px rgba(0,0,0,.18);
}
#monthlyPage .monthly-lamp-base{
  position:absolute;left:51px;top:249px;width:94px;height:16px;
  border-radius:50%;
  background:linear-gradient(180deg,#d5c9ba,#756c63);
  box-shadow:0 8px 12px rgba(0,0,0,.22);
}
#monthlyPage .monthly-lamp-chain{
  position:absolute;left:139px;top:91px;width:2px;height:102px;z-index:7;
  background:#8f714c;
  transform-origin:top;
}
#monthlyPage .monthly-lamp-pull{
  position:absolute;left:133px;top:187px;width:14px;height:14px;z-index:8;
  border-radius:50%;
  background:linear-gradient(145deg,#d5ae6b,#80572f);
  box-shadow:0 3px 7px rgba(0,0,0,.27);
}
#monthlyPage .monthly-lamp-caption{
  position:absolute;
  left:0;right:0;bottom:5px;
  text-align:center;
  color:#817267;
  font-size:9px;
  letter-spacing:.04em;
  transition:color .5s ease,opacity .5s ease;
}
#monthlyPage .monthly-lamp-caption b{
  display:block;
  margin-bottom:4px;
  font-size:9px;
  letter-spacing:.12em;
}
#monthlyPage.report-lamp-off .monthly-lamp{
  opacity:.74;
  filter:brightness(.52) saturate(.55) drop-shadow(0 17px 20px rgba(0,0,0,.25));
}
#monthlyPage.report-lamp-off .monthly-lamp-caption{color:#a39385}
#monthlyPage.report-lamp-off .monthly-lamp-caption b{color:#baaa9b}
#monthlyPage.report-lamp-on .monthly-lamp{
  opacity:1;
  filter:drop-shadow(0 18px 24px rgba(71,48,29,.20));
}
#monthlyPage.report-lamp-on .monthly-lamp-shade{
  background:linear-gradient(180deg,#fff9ec 0%,#e9dcc8 100%);
  filter:brightness(1.18) drop-shadow(0 0 18px rgba(255,222,155,.48));
}
#monthlyPage.report-lamp-on .monthly-lamp-bulb{
  background:#ffe4a4;
  box-shadow:0 8px 33px 15px rgba(255,218,141,.78);
}
#monthlyPage.report-lamp-on .monthly-lamp-caption{color:#806b57}
#monthlyPage.report-lamp-on .monthly-lamp-caption b{color:#a77d45}

/* Pull animation */
#monthlyPage .monthly-lamp.lamp-pull .monthly-lamp-chain,
#monthlyPage .monthly-lamp.lamp-pull .monthly-lamp-pull{
  animation:monthlyLampPull .44s ease;
  transform-origin:top;
}
@keyframes monthlyLampPull{
  0%{transform:translateY(0) rotate(0)}
  42%{transform:translateY(11px) rotate(7deg)}
  100%{transform:translateY(0) rotate(0)}
}

/* Warm beam stays inside the cover; it therefore scrolls away with it. */
#monthlyPage .monthly-lamp-beam{
  position:absolute;
  z-index:2;
  right:-2%;
  top:101px;
  width:50%;
  height:420px;
  pointer-events:none;
  opacity:0;
  clip-path:polygon(47% 0,66% 0,100% 100%,0 100%);
  background:
    linear-gradient(173deg,rgba(255,224,160,.36),rgba(255,238,203,.17) 54%,rgba(255,246,225,0));
  filter:blur(6px);
  transform-origin:57% 0;
  transition:opacity .72s ease;
}
#monthlyPage.report-lamp-on .monthly-lamp-beam{opacity:1}

/* ----------------- report content reveal -----------------
   OFF = data area is effectively invisible/dark.
   Layout height stays intact, so normal scrolling behavior is preserved.
*/
#monthlyPage .monthly-report{
  transition:background .8s ease;
}
#monthlyPage.report-lamp-off .monthly-report{
  background:
    linear-gradient(rgba(11,10,9,.91),rgba(9,8,7,.95)),
    url('luxury-wave.jpg') center top / cover fixed no-repeat!important;
}
#monthlyPage.report-lamp-off .report-section{
  opacity:.018!important;
  filter:brightness(.08) grayscale(.75) blur(1.2px);
  transform:translateY(9px);
  pointer-events:none;
  box-shadow:none!important;
  transition:opacity .58s ease,filter .68s ease,transform .68s ease!important;
}
#monthlyPage.report-lamp-on .monthly-report{
  background:transparent!important;
}
#monthlyPage.report-lamp-on .report-section{
  opacity:1!important;
  filter:none;
  transform:none;
  pointer-events:auto;
  transition:opacity .65s ease,filter .72s ease,transform .72s ease!important;
}
/* Soft staged reveal after switching on. */
#monthlyPage.report-lamp-on .report-section:nth-of-type(1){transition-delay:.06s!important}
#monthlyPage.report-lamp-on .report-section:nth-of-type(2){transition-delay:.10s!important}
#monthlyPage.report-lamp-on .report-section:nth-of-type(3){transition-delay:.14s!important}
#monthlyPage.report-lamp-on .report-section:nth-of-type(4){transition-delay:.18s!important}
#monthlyPage.report-lamp-on .report-section:nth-of-type(5){transition-delay:.22s!important}
#monthlyPage.report-lamp-on .report-section:nth-of-type(6){transition-delay:.26s!important}
#monthlyPage.report-lamp-on .report-section:nth-of-type(7){transition-delay:.30s!important}
#monthlyPage.report-lamp-on .report-section:nth-of-type(8){transition-delay:.34s!important}

/* Accessibility: users asking for reduced motion still get the light state without animation. */
@media(prefers-reduced-motion:reduce){
  #monthlyPage .monthly-cover,
  #monthlyPage .monthly-cover-content,
  #monthlyPage .monthly-lamp,
  #monthlyPage .monthly-lamp-shade,
  #monthlyPage .monthly-lamp-bulb,
  #monthlyPage .monthly-lamp-beam,
  #monthlyPage .report-section{transition:none!important;animation:none!important}
}

/* Responsive: lamp remains in the cover and never becomes fixed/sticky. */
@media(max-width:1180px){
  #monthlyPage .monthly-cover-content{width:68%}
  #monthlyPage .monthly-lamp-zone{right:3%;transform:scale(.88);transform-origin:center}
}
@media(max-width:820px){
  #monthlyPage .monthly-cover{
    min-height:560px!important;
    padding-bottom:210px!important;
  }
  #monthlyPage .monthly-cover-content{width:100%}
  #monthlyPage .monthly-lamp-zone{
    top:auto;
    bottom:2px;
    right:50%;
    transform:translateX(50%) scale(.68);
    transform-origin:bottom center;
  }
  #monthlyPage .monthly-lamp-beam{
    top:auto;bottom:-20px;right:10%;width:80%;height:320px;
    clip-path:polygon(42% 0,58% 0,100% 100%,0 100%);
  }
}


/* =========================================================
   V16 — CLICK FIX
   The decorative header circle extends outside .topbar because
   overflow is intentionally visible for the More menu.
   It must never intercept clicks on page action buttons below.
   ========================================================= */
.topbar::after{
  pointer-events:none!important;
}