/* TK Hijau: staff-led AI initiative + clearly labelled, local-only portal prototype. */
.nav{height:auto;min-height:70px;gap:15px}.nav-links{gap:10px}.nav a.lnk{font-size:.82rem}.nav .btn{font-size:.82rem;padding:11px 15px}.brand{font-size:1rem}
.ai-feature{background:#e8f1e8;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.ai-feature-grid{display:grid;grid-template-columns:1.12fr .88fr;gap:64px;align-items:center}.ai-feature h2{margin:16px 0 20px;max-width:640px}.ai-feature p{color:var(--ink-soft);margin-top:14px}.ai-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}.ai-small{font-size:.82rem;color:var(--ink-soft);line-height:1.65}.ai-showcase{background:#fff;border:1px solid #c8decd;border-radius:22px;padding:28px}.ai-showcase h3{font-size:1.35rem;margin:12px 0}.ai-showcase .route-list{margin-top:20px}.ai-showcase .route-list a{padding:16px 0}.ai-showcase .route-list b{font-size:1rem}.ai-showcase .route-list small{font-size:.84rem}.ai-kicker{font-size:.73rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--deep)}
.ai-intro{padding:45px 0 62px}.ai-intro-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:64px;align-items:center}.ai-intro h1{font-size:clamp(2.4rem,4.5vw,3.5rem);letter-spacing:-.03em;margin:20px 0}.ai-intro p{color:var(--ink-soft);margin-top:16px}.ai-sheet{background:#fff;border:1px solid var(--line);border-radius:20px;padding:20px;transform:rotate(2deg);box-shadow:0 14px 32px #173b2c0c}.ai-sheet img{height:285px;width:100%;object-fit:contain}.ai-sheet figcaption{font-size:.77rem;text-align:center;color:var(--ink-soft);margin-top:12px}.ai-usecases{background:#fff}.ai-usecases h2{max-width:760px}.ai-usecase{display:grid;grid-template-columns:70px 1fr 1fr;gap:28px;padding:34px 0;border-bottom:1px solid var(--line)}.ai-usecase:first-of-type{margin-top:22px;border-top:1px solid var(--line)}.ai-usecase .number{font-family:var(--font-head);font-size:2rem;color:#61836b}.ai-usecase h3{font-size:1.45rem;margin-bottom:12px}.ai-usecase p{color:var(--ink-soft);font-size:.95rem}.ai-usecase ul{padding-left:20px;color:var(--ink-soft);display:grid;gap:10px;font-size:.93rem}.ai-flow{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin:32px 0}.ai-flow article{padding-top:18px;border-top:2px solid #91b89b}.ai-flow h3{font-size:1.12rem;margin:8px 0}.ai-flow p{color:var(--ink-soft);font-size:.87rem}.ai-policy{display:grid;grid-template-columns:1fr 1fr;gap:55px}.ai-policy ul{padding-left:22px;color:var(--ink-soft);display:grid;gap:12px;margin-top:20px}.ai-policy p{margin-top:18px;color:var(--ink-soft)}.ai-policy .btn{margin-top:20px}
.demo-banner{background:#f6edd6;border:1px solid #e5d2a6;border-radius:12px;padding:15px 20px;color:#665025;font-size:.88rem;line-height:1.65}.demo-banner strong{color:#533d16}.demo-banner a{color:#533d16;font-weight:800}.demo-entry{padding:35px 0 64px}.demo-entry h1{font-size:clamp(2.2rem,4vw,3.1rem);margin:22px 0 14px}.demo-entry>div>p{color:var(--ink-soft);max-width:680px}.role-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin:32px 0}.role-card{padding:32px;border:1px solid var(--line);background:#fff;border-radius:20px}.role-card h2{font-size:2rem;margin:12px 0}.role-card p{color:var(--ink-soft)}.role-card ul{padding-left:20px;margin:22px 0;display:grid;gap:10px;color:var(--ink-soft)}.role-card .btn{margin-top:10px}.demo-footer-note{border-top:1px solid var(--line);padding-top:22px;color:var(--ink-soft);font-size:.87rem}
.portal-page{padding:25px 0 60px;background:#f3f6f0}.portal-page .wrap{max-width:1220px}.portal-greet{display:flex;justify-content:space-between;gap:20px;align-items:center;margin:26px 0}.portal-greet h1{font-size:2.3rem;letter-spacing:-.02em}.portal-greet p{font-size:.9rem;color:var(--ink-soft);margin-top:7px}.portal-greet a{color:var(--deep);font-size:.85rem;font-weight:800;white-space:nowrap}.portal-shell{display:grid;grid-template-columns:205px minmax(0,1fr);gap:24px;align-items:start}.portal-side{padding:18px 12px;background:#e4eee3;border:1px solid #d3e0d1;border-radius:15px;position:sticky;top:92px}.portal-side .side-label{font-size:.7rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;margin:0 10px 15px;color:var(--ink-soft)}.portal-side nav{display:grid;gap:5px}.portal-side button{padding:13px 12px;min-height:46px;display:flex;align-items:center;gap:9px;border:0;text-align:left;border-radius:8px;background:none;font:700 .88rem var(--font-body);color:var(--ink-soft);cursor:pointer}.portal-side button[aria-pressed=true]{background:var(--deep);color:#fff}.portal-side button:hover{background:#d4e3d2;color:var(--ink)}.portal-side button[aria-pressed=true]:hover{background:#195c3c;color:#fff}.portal-side button span{font-size:.72rem;opacity:.75}.portal-side .side-foot{margin:20px 10px 0;padding-top:16px;border-top:1px solid #c4d5c3;font-size:.77rem;color:var(--ink-soft)}.portal-main{min-width:0}.portal-view{padding:0}.portal-view[hidden],[hidden]{display:none!important}.work-panel{background:#fff;border:1px solid var(--line);border-radius:15px;padding:25px;margin-bottom:20px;min-width:0}.work-panel h2{font-size:1.55rem}.work-panel h3{font-size:1.15rem;margin-bottom:10px}.work-panel p{color:var(--ink-soft);font-size:.91rem;margin-top:10px}.panel-title{display:flex;justify-content:space-between;gap:15px;align-items:start;margin-bottom:20px}.demo-chip{font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;padding:5px 10px;border:1px solid #c5d7c4;border-radius:20px;background:#edf5eb;color:var(--deep);white-space:nowrap}.work-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:20px}.work-list{display:grid;gap:0;list-style:none;margin-top:14px}.work-list li{padding:15px 0;border-bottom:1px solid var(--line)}.work-list li:last-child{border-bottom:0}.work-list b{display:block;font-size:.94rem}.work-list small{display:block;font-size:.82rem;color:var(--ink-soft);margin-top:5px}.work-panel .btn{margin-top:18px;border-radius:10px;box-shadow:none;font-size:.87rem;min-height:44px}.work-panel .btn.secondary{background:#edf4ea;color:var(--deep)}.work-panel .btn.secondary:hover{background:#dcebd7}.portal-note{font-size:.8rem;color:var(--ink-soft);padding:5px 0 14px}.portal-note a{color:var(--deep)}.portal-form{display:grid;gap:17px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}.portal-form label{display:grid;gap:7px;font-size:.85rem;font-weight:800;color:var(--ink)}.portal-form select,.portal-form textarea,.attendance-select{border:1px solid #b7cdbb;background:#fff;border-radius:8px;padding:11px 12px;font:400 .93rem var(--font-body);color:var(--ink);min-height:46px;max-width:100%;width:100%}.portal-form textarea{resize:vertical;min-height:130px}.portal-form .btn{justify-content:center;margin:0;justify-self:start}.portal-form select:focus,.portal-form textarea:focus,.attendance-select:focus{outline:2px solid var(--green);outline-offset:2px}.draft-output{background:#f4f7ef;padding:23px;border:1px solid #d4e2cc;border-radius:12px;margin-top:23px}.draft-output h3{margin:8px 0 15px}.draft-output ol,.draft-output ul{padding-left:22px;display:grid;gap:11px;font-size:.9rem;color:var(--ink-soft)}.draft-output p{white-space:pre-line}.draft-output .ai-small{font-size:.77rem}.result-status{min-height:22px;font-size:.84rem;color:var(--deep);margin-top:14px;font-weight:700}.worksheet-preview{height:230px;width:100%;object-fit:contain;background:#fafaf7;border:1px solid var(--line);border-radius:9px;margin-top:17px}.attendance-summary{display:flex;flex-wrap:wrap;gap:8px 18px;margin:15px 0 20px;font-size:.86rem;color:var(--ink-soft)}.attendance-summary strong{color:var(--deep)}.table-scroll{overflow-x:auto;width:100%}table.demo-table{border-collapse:collapse;width:100%;font-size:.88rem}table.demo-table th,table.demo-table td{text-align:left;padding:13px 8px;border-bottom:1px solid var(--line)}table.demo-table th{font-size:.75rem;color:var(--ink-soft);font-weight:800}table.demo-table td:first-child{min-width:140px}.attendance-select{font-size:.82rem;min-width:140px;padding:8px 10px}.journal-entry{padding:18px 0;border-bottom:1px solid var(--line)}.journal-entry h3{font-size:1.03rem}.journal-entry .demo-chip{display:inline-flex;margin-bottom:9px}.faq-options{display:flex;gap:9px;flex-wrap:wrap;margin-top:20px}.faq-options button{border:1px solid #b8cbb7;border-radius:9px;background:#fff;color:var(--deep);font:700 .85rem var(--font-body);padding:10px 13px;min-height:44px;cursor:pointer}.faq-options button:hover{background:#eaf2e6}.demo-dialog{max-width:600px;width:calc(100% - 36px);padding:28px;border-radius:18px;border:1px solid var(--line);color:var(--ink);margin:auto;box-shadow:0 20px 70px #0003}.demo-dialog::backdrop{background:#173b2c99}.demo-dialog h2{font-size:1.6rem}.demo-dialog p{white-space:pre-wrap;margin:18px 0;color:var(--ink-soft);font-size:.92rem}.dialog-actions{display:flex;gap:12px;flex-wrap:wrap}.dialog-actions .btn{margin-top:0;border-radius:9px}.portal-main .btn:disabled{opacity:.6;cursor:wait;transform:none}.portal-public-links{display:flex;gap:20px;flex-wrap:wrap;font-size:.85rem;margin-top:22px}.portal-public-links a{color:var(--deep);font-weight:800}
@media(max-width:1000px){.ai-feature-grid,.ai-intro-grid{gap:35px}.portal-shell{grid-template-columns:180px minmax(0,1fr)}.work-grid{grid-template-columns:1fr}.portal-greet h1{font-size:2rem}}
@media(max-width:760px){.ai-feature-grid,.ai-intro-grid,.ai-policy,.role-grid{grid-template-columns:1fr;gap:28px}.ai-feature{padding:48px 0}.ai-showcase{padding:24px}.ai-intro{padding:30px 0 40px}.ai-intro h1{font-size:2.55rem}.ai-sheet{max-width:410px;transform:none}.ai-usecase{grid-template-columns:36px 1fr;gap:18px}.ai-usecase ul{grid-column:2}.ai-usecase .number{font-size:1.5rem}.ai-flow{grid-template-columns:1fr 1fr}.portal-shell{grid-template-columns:1fr;gap:18px}.portal-side{position:static;padding:12px}.portal-side nav{grid-template-columns:1fr 1fr;gap:7px}.portal-side .side-label{margin-bottom:9px}.portal-side .side-foot{display:none}.portal-greet{align-items:start}.portal-greet h1{font-size:1.9rem}.portal-greet a{font-size:.77rem}.portal-page{padding:20px 0 40px}.portal-page .wrap{padding:0 17px}.work-panel{padding:21px}.work-panel h2{font-size:1.35rem}.demo-banner{padding:13px 15px;font-size:.81rem}.role-card{padding:26px}.role-card h2{font-size:1.7rem}.demo-entry h1{font-size:2.3rem}.form-row{grid-template-columns:1fr}.panel-title{flex-wrap:wrap}.portal-main .btn{white-space:normal;text-align:center}.ai-actions .btn{font-size:.85rem}.portal-greet .ai-kicker{font-size:.64rem}}
@media(prefers-reduced-motion:reduce){.ai-sheet{transform:none}}
