.lp-page{background:#fff;border:1px solid #c3d4b6;border-radius:8px;overflow:hidden;min-width:0;color:#1b2814}
.lp-period-status{display:flex;flex-wrap:wrap;gap:6px;padding:7px 12px;background:#f8fbf4;font-size:11px}.lp-period-status>span{display:flex;align-items:center;gap:6px;padding:5px 8px;border:1px solid #d4e2c8;border-radius:4px}.lp-period-loaded{background:#e7f2da;color:#30541e}.lp-period-pending{background:#f3f4f1;color:#61695b}
.lp-context{display:flex;align-items:end;gap:14px;flex-wrap:wrap;padding:12px 15px;background:#f5f8f1;border-bottom:1px solid #d5e2cb;font-size:12px}.lp-context label{display:grid;gap:4px;font-weight:600}.lp-context select{min-width:190px;max-width:330px;padding:7px 9px;font-size:12px}.lp-context>span{margin:auto 0}.lp-context .btn{margin-left:auto}
.lp-header{display:grid;grid-template-columns:minmax(340px,1fr) 130px 160px;gap:24px;align-items:center;padding:12px 14px;background:#fff}
.lp-selector{max-width:580px;border:2px solid #76a945;border-radius:9px;padding:8px;background:#fafcf7}.lp-selector h1{font:700 13px/1.4 Arial,sans-serif;text-align:center;text-transform:uppercase;text-decoration:underline;color:#182414;margin:0 0 9px}.lp-level-row{display:flex;gap:10px;align-items:center;margin:5px 0}.lp-level-label{flex:0 0 91px;padding:6px 7px;background:#b6d69b;border:1px solid #799e61;border-radius:4px;text-transform:uppercase;font:bold 11px Arial,sans-serif}.lp-grade-buttons{display:flex;flex:1;gap:5px}.lp-grade-buttons button{flex:1;min-width:0;padding:6px 3px;border:1px solid #8fa27e;background:#e5efd9;border-radius:4px;font:bold 11px Arial,sans-serif;color:#1f3018;cursor:pointer;white-space:nowrap}.lp-grade-buttons button[aria-pressed=true]{background:#ffcb13;border-color:#c08c00;color:#172108;box-shadow:inset 0 0 0 1px #fff4ae}.lp-grade-buttons button:disabled{background:#f1f3ec;color:#909b88;border-color:#d1d9ca;cursor:not-allowed}.lp-grade-buttons button:not(:disabled):hover{border-color:#366b1c;box-shadow:0 0 0 1px #578d32}
.lp-back{display:flex;align-items:center;flex-direction:column;gap:4px;background:none;border:0;color:#999;cursor:pointer}.lp-back span{width:100%;padding:8px 12px;border:1px solid #555;border-radius:5px;background:linear-gradient(#ececec,#939393);box-shadow:inset 0 1px 2px #fff,0 2px 2px #0003;color:#191919;font:12px Arial,sans-serif}.lp-board{display:flex;flex-direction:column;gap:5px;background:none;border:0;padding:0;cursor:pointer}.lp-board img{width:100%;height:83px;object-fit:cover;border:1px solid #888;border-radius:5px;padding:5px}.lp-board span{padding:8px 6px;border:1px solid #23416c;border-radius:4px;color:white;background:linear-gradient(#365988,#173663);box-shadow:inset 0 0 0 2px #7892b455,0 2px 4px #0003;text-transform:uppercase;font:bold 10px/1.3 Arial,sans-serif}.lp-board:disabled{opacity:.45;cursor:not-allowed}
.lp-selection{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;padding:7px 13px;background:#edf5e5;color:#385929;font-size:11px;border-top:1px solid #d0dfc5}.lp-table-scroll{max-width:100%;max-height:72vh;overflow:auto;scrollbar-color:#73994e #f0f5e9}.lp-table{border-collapse:separate;border-spacing:0;table-layout:fixed;min-width:1200px;width:100%;font:11px/1.25 Arial,sans-serif;color:#182313}.lp-col-year{width:42px}.lp-col-level{width:67px}.lp-col-grade{width:45px}.lp-col-area{width:125px}.lp-col-competency{width:310px}.lp-col-count{width:30px}
.lp-table th,.lp-table td{border-right:1px solid #9dc373;border-bottom:1px solid #9dc373;padding:4px 3px;white-space:normal;overflow-wrap:break-word}.lp-table thead{position:sticky;top:0;z-index:3}.lp-table thead th{background:#548130;color:#fff;text-align:center;text-transform:uppercase;font-size:10px;font-weight:700;letter-spacing:0}.lp-table thead .lp-vertical{writing-mode:vertical-rl;transform:rotate(180deg)}.lp-table tbody th{font-weight:400;text-align:left;color:inherit;text-transform:none;letter-spacing:0;font-size:11px}.lp-table tbody td{text-align:center}.lp-table td.lp-area{text-align:left}.lp-table tbody tr:nth-child(even){background:#f3f8ec}.lp-table .lp-count.lp-cut-tint{background:#e5efd9}.lp-table .lp-count.lp-final{background:#fbfdf8;font-weight:700}.lp-table .lp-group-start{border-left:1px solid #679546}.lp-table .lp-competency{position:sticky;left:0;z-index:1;background:#fff}.lp-table tbody tr:nth-child(even) .lp-competency{background:#f3f8ec}.lp-table thead .lp-competency{background:#548130;z-index:4}.lp-table tbody tr:hover td,.lp-table tbody tr:hover th{background:#fff8d6!important}.lp-note{margin:0;padding:10px 14px;background:#f7faf4;font-size:11px;line-height:1.5;color:#53684a;border-top:1px solid #d1dfc6}.lp-empty{padding:40px 20px;text-align:center;color:#526749}.lp-page button:focus-visible,.lp-table-scroll:focus-visible{outline:3px solid #eeaf00;outline-offset:2px}
@media(max-width:1150px){.lp-header{grid-template-columns:minmax(300px,1fr) 80px 105px;gap:10px}.lp-selector{max-width:none}.lp-selector h1{font-size:11px}.lp-level-label{flex-basis:70px;font-size:10px;}.lp-board img{height:58px}.lp-back svg{height:42px}.lp-context select{max-width:100%}}
@media(max-width:820px){.lp-header{grid-template-columns:minmax(0,1fr) 80px 110px}.lp-selector{grid-column:1/-1}.lp-back{grid-column:2}.lp-board{grid-column:3}}
@media(max-width:600px){.lp-header{padding:10px;gap:8px}.lp-level-label{flex-basis:75px;font-size:10px;padding:6px 4px}.lp-level-row{gap:5px}.lp-grade-buttons{gap:3px}.lp-grade-buttons button{font-size:10px;padding:7px 1px}.lp-context{padding:10px;gap:10px}.lp-context label{width:100%;min-width:0}.lp-context select{width:100%;min-width:0}.lp-selector h1{font-size:12px}}