/* ศูนย์รวมระบบสารสนเทศ (applications.php). Uses assets/tokens.css. */
.pt{color:var(--c-ink);font-family:var(--font-sans);font-size:var(--fs-base);line-height:var(--lh-base)}
.pt ::selection{background:var(--c-primary-200);color:var(--c-ink)}
.pt svg{display:block;flex-shrink:0}
.pt .sb-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.pt [hidden]{display:none!important}
.pt :is(a,button):focus-visible{outline:none;box-shadow:var(--ring)}
.pt>*+*{margin-top:var(--sp-7)}
.pt>.auth-alert+*{margin-top:var(--sp-5)}
.pt-ico{width:20px;height:20px}

/* Shared: section reveal */
.pt-welcome,.pt-quick,.pt-catalog,.pt-block,.pt-help,.pt-guest{animation:pt-fade var(--dur-3) var(--ease-out) backwards}
.pt-quick{animation-delay:40ms}.pt-catalog{animation-delay:80ms}.pt-block{animation-delay:120ms}
@keyframes pt-fade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* ---------- Welcome ---------- */
.pt-welcome{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:var(--sp-5) var(--sp-7);padding:var(--sp-2) var(--sp-1) 0}
.pt-eyebrow{margin:0 0 var(--sp-1);color:var(--c-primary-ink);font-size:var(--fs-sm);font-weight:var(--fw-semibold)}
.pt-welcome h1{margin:0;font-size:var(--fs-2xl);font-weight:var(--fw-semibold);line-height:var(--lh-tight);letter-spacing:-.01em;text-wrap:balance}
.pt-lead{margin:6px 0 0;color:var(--c-muted);font-size:var(--fs-md)}
.pt-stats{display:flex;gap:2px;margin:0;padding:4px;border:1px solid var(--c-line);border-radius:var(--r-lg);background:var(--c-surface);box-shadow:var(--sh-1)}
.pt-stats div{display:flex;flex-direction:column-reverse;min-width:104px;padding:8px 16px;border-radius:var(--r-md)}
.pt-stats div+div{border-left:1px solid var(--c-line);border-radius:0}
.pt-stats dt{color:var(--c-muted);font-size:var(--fs-xs);white-space:nowrap}
.pt-stats dd{margin:0;font-size:var(--fs-xl);font-weight:var(--fw-semibold);line-height:1.25;font-variant-numeric:tabular-nums}

/* ---------- Guest notice ---------- */
.pt-guest{display:flex;align-items:center;gap:var(--sp-5);padding:var(--sp-5) var(--sp-6);border:1px solid var(--c-primary-200);border-radius:var(--r-xl);background:linear-gradient(120deg,var(--c-primary-50),var(--c-surface) 70%)}
.pt-guest-icon{display:grid;place-items:center;width:48px;height:48px;flex-shrink:0;border-radius:var(--r-md);background:var(--c-surface);color:var(--c-primary-ink);box-shadow:var(--sh-1)}
.pt-guest h2{margin:0;font-size:var(--fs-md);font-weight:var(--fw-semibold)}
.pt-guest p{margin:4px 0 0;color:var(--c-muted);font-size:var(--fs-sm);max-width:70ch}
.pt-guest .pt-btn{margin-left:auto;flex-shrink:0}

/* ---------- Buttons, badges, counts, links ---------- */
.pt-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;padding:0 18px;border:1px solid transparent;border-radius:var(--r-md);font:var(--fw-semibold) var(--fs-sm)/1.2 var(--font-sans);text-decoration:none;white-space:nowrap;cursor:pointer;
  transition:background var(--dur-1) var(--ease-std),border-color var(--dur-1) var(--ease-std),color var(--dur-1) var(--ease-std),box-shadow var(--dur-2) var(--ease-std),transform var(--dur-1) var(--ease-std)}
.pt-btn:active{transform:scale(.97)}
.pt-btn-primary{background:var(--c-primary-600);color:#fff;box-shadow:0 1px 2px rgba(13,129,120,.3)}
.pt-btn-primary:hover{background:var(--c-primary-700);box-shadow:0 6px 16px -6px rgba(13,129,120,.55)}
.pt-btn-ghost{background:var(--c-surface);border-color:var(--c-line-strong);color:var(--c-ink-2)}
.pt-btn-ghost:hover{background:var(--c-primary-50);border-color:var(--c-primary-300);color:var(--c-primary-800)}
.pt-count{display:inline-grid;place-items:center;min-width:24px;height:22px;padding:0 7px;border-radius:var(--r-full);background:var(--c-surface-3);color:var(--c-muted);font-size:var(--fs-xs);font-weight:var(--fw-semibold);line-height:1;font-variant-numeric:tabular-nums}
.pt-badge{display:inline-flex;align-items:center;height:24px;padding:0 9px;border-radius:var(--r-full);background:var(--c-surface-3);color:var(--c-muted);font-size:11.5px;font-weight:var(--fw-semibold);white-space:nowrap}
.pt-badge.is-admin{background:var(--c-primary-100);color:var(--c-primary-800)}
.pt-link{color:var(--c-primary-ink);font-size:var(--fs-sm);font-weight:var(--fw-medium);text-decoration:none;border-radius:6px;padding:4px 6px;margin:-4px -6px;transition:background var(--dur-1) var(--ease-std)}
.pt-link:hover{background:var(--c-primary-50)}
.pt-sub{margin:2px 0 0;color:var(--c-muted);font-size:var(--fs-sm)}

/* ---------- Category tiles ---------- */
.pt-tile{display:grid;place-items:center;width:44px;height:44px;flex-shrink:0;border-radius:var(--r-md);transition:transform var(--dur-2) var(--ease-out)}
.pt-tile .pt-ico{width:22px;height:22px}
.pt-tile-sm{width:34px;height:34px;border-radius:10px}
.pt-tile-sm .pt-ico{width:18px;height:18px}
.tone-teal{background:var(--tone-teal-bg);color:var(--tone-teal-fg)}
.tone-slate{background:var(--tone-slate-bg);color:var(--tone-slate-fg)}
.tone-sky{background:var(--tone-sky-bg);color:var(--tone-sky-fg)}
.tone-rose{background:var(--tone-rose-bg);color:var(--tone-rose-fg)}

/* ---------- Favorite button ---------- */
.pt-fav-form{margin:0}
.pt-fav{position:relative;z-index:2;display:grid;place-items:center;width:36px;height:36px;padding:0;border:1px solid transparent;border-radius:var(--r-full);background:transparent;color:var(--c-faint);cursor:pointer;
  transition:background var(--dur-1) var(--ease-std),color var(--dur-1) var(--ease-std),border-color var(--dur-1) var(--ease-std)}
.pt-fav:hover{background:var(--c-star-soft);color:var(--c-star)}
.pt-fav .pt-star{width:20px;height:20px;transition:transform var(--dur-2) var(--ease-pop),fill var(--dur-1) var(--ease-std)}
.pt-fav:active .pt-star{transform:scale(.85)}
.pt-fav[aria-pressed="true"]{color:var(--c-star)}
.pt-fav[aria-pressed="true"] .pt-star{fill:currentColor}
.pt-fav.is-popping .pt-star{animation:pt-star-pop 360ms var(--ease-pop)}
.pt-fav.is-popping::after{content:'';position:absolute;inset:4px;border-radius:50%;border:2px solid var(--c-star);opacity:0;animation:pt-star-ring 420ms var(--ease-out)}
.pt-fav-sm{width:32px;height:32px}
.pt-fav-sm .pt-star{width:17px;height:17px}
.pt-fav[aria-busy="true"]{pointer-events:none}
@keyframes pt-star-pop{0%{transform:scale(1)}40%{transform:scale(1.28)}100%{transform:scale(1)}}
@keyframes pt-star-ring{0%{opacity:.5;transform:scale(.6)}100%{opacity:0;transform:scale(1.35)}}

/* ---------- Quick access ---------- */
.pt-quick{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sp-5)}
.pt[data-view="favorites"] .pt-quick,.pt[data-view="recent"] .pt-quick{grid-template-columns:minmax(0,1fr)}
.pt-panel{display:flex;flex-direction:column;min-width:0;padding:var(--sp-4) var(--sp-4) var(--sp-3);border:1px solid var(--c-line);border-radius:var(--r-xl);background:var(--c-surface);box-shadow:var(--sh-1)}
.pt-panel-head{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);padding:2px 6px 10px}
.pt-panel-head h2{display:flex;align-items:center;gap:10px;margin:0;font-size:var(--fs-md);font-weight:var(--fw-semibold)}
.pt-panel-icon{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:var(--c-surface-3);color:var(--c-muted)}
.pt-panel-icon .pt-ico{width:17px;height:17px}
.pt-panel-icon.is-star{background:var(--c-star-soft);color:var(--c-star)}
.pt-panel-icon.is-star .pt-ico{fill:currentColor}
.pt-quick-list{display:grid;grid-template-columns:minmax(0,1fr);gap:2px;margin:0;padding:0;list-style:none}
.pt[data-view="favorites"] .pt-quick-list,.pt[data-view="recent"] .pt-quick-list{grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:6px}
.pt-quick-item{position:relative;display:flex;align-items:center;gap:4px;border-radius:var(--r-md);transition:background var(--dur-1) var(--ease-std)}
.pt-quick-item:hover{background:var(--c-surface-2)}
.pt-quick-item.is-entering{animation:pt-item-in var(--dur-3) var(--ease-out)}
.pt-quick-item.is-leaving{animation:pt-item-out var(--dur-2) var(--ease-std) forwards}
@keyframes pt-item-in{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
@keyframes pt-item-out{to{opacity:0;transform:scale(.98)}}
.pt-quick-link{display:flex;align-items:center;gap:12px;flex:1;min-width:0;min-height:56px;padding:8px 6px 8px 8px;border-radius:var(--r-md);color:inherit;text-decoration:none}
.pt-quick-link .pt-tile{width:38px;height:38px;border-radius:10px}
.pt-quick-link .pt-tile .pt-ico{width:19px;height:19px}
.pt-quick-text{display:flex;flex-direction:column;min-width:0;flex:1;line-height:1.4}
.pt-quick-text strong{font-size:14px;font-weight:var(--fw-semibold);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pt-quick-text span{color:var(--c-muted);font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pt-quick-go{width:16px;height:16px;color:var(--c-faint);opacity:0;transform:translate(-4px,4px);transition:opacity var(--dur-1) var(--ease-std),transform var(--dur-2) var(--ease-out),color var(--dur-1)}
.pt-quick-link:hover .pt-quick-go,.pt-quick-link:focus-visible .pt-quick-go{opacity:1;transform:none;color:var(--c-primary-600)}
.pt-quick-link:hover .pt-tile{transform:scale(1.05)}
.pt-quick-link.is-disabled{opacity:.6}
.pt-quick-item .pt-fav-form{padding-right:4px}

/* ---------- Empty states ---------- */
.pt-empty{display:flex;flex-direction:column;align-items:center;gap:6px;padding:var(--sp-7) var(--sp-5);border:1px dashed var(--c-line-strong);border-radius:var(--r-xl);background:var(--c-surface);text-align:center}
.pt-empty h3{margin:6px 0 0;font-size:var(--fs-md);font-weight:var(--fw-semibold)}
.pt-empty p{max-width:52ch;margin:0;color:var(--c-muted);font-size:var(--fs-sm);line-height:1.7}
.pt-empty .pt-btn{margin-top:10px}
.pt-empty-art{position:relative;display:grid;place-items:center;width:56px;height:56px;border-radius:18px;background:var(--c-surface-3);color:var(--c-muted)}
.pt-empty-art::before{content:'';position:absolute;inset:-6px;border-radius:22px;border:1px dashed var(--c-line-strong)}
.pt-empty-art .pt-ico{width:24px;height:24px}
.pt-empty-art.is-star{background:var(--c-star-soft);color:var(--c-star)}
.pt-empty-sm{flex-direction:row;align-items:center;gap:var(--sp-4);padding:var(--sp-4);margin:2px 0 4px;border-radius:var(--r-lg);background:var(--c-surface-2);text-align:left}
.pt-empty-sm .pt-empty-art{width:44px;height:44px;border-radius:14px;flex-shrink:0}
.pt-empty-sm .pt-empty-art::before{inset:-4px;border-radius:17px}
.pt-empty-sm .pt-empty-art .pt-ico{width:20px;height:20px}
.pt-empty-sm p strong{display:block;color:var(--c-ink);font-weight:var(--fw-semibold);font-size:14px}
.pt-empty-ico{color:var(--c-faint)}

/* ---------- Catalog ---------- */
.pt-catalog-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:var(--sp-3) var(--sp-5);margin-bottom:var(--sp-5);padding:0 var(--sp-1)}
.pt-catalog-head h2,.pt-block-head h2{display:flex;align-items:center;gap:8px;margin:0;font-size:var(--fs-lg);font-weight:var(--fw-semibold);line-height:var(--lh-tight)}
.pt-filter{display:flex;gap:6px;max-width:100%;overflow-x:auto;padding:4px;margin:-4px;scrollbar-width:none;-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 24px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 24px),transparent)}
.pt-filter::-webkit-scrollbar{display:none}
.pt-filter::after{content:'';flex:0 0 16px}
.pt-chip{display:inline-flex;align-items:center;gap:8px;min-height:38px;padding:0 8px 0 14px;border:1px solid var(--c-line);border-radius:var(--r-full);background:var(--c-surface);color:var(--c-ink-2);font-size:var(--fs-sm);font-weight:var(--fw-medium);text-decoration:none;white-space:nowrap;
  transition:background var(--dur-2) var(--ease-std),border-color var(--dur-2) var(--ease-std),color var(--dur-2) var(--ease-std),transform var(--dur-1) var(--ease-std)}
.pt-chip:hover{border-color:var(--c-line-strong);background:var(--c-surface-2)}
.pt-chip:active{transform:scale(.97)}
.pt-chip-n{min-width:22px;height:22px;padding:0 6px;border-radius:var(--r-full);background:var(--c-surface-3);color:var(--c-muted);font-size:11.5px;font-weight:var(--fw-semibold);line-height:22px;text-align:center;font-variant-numeric:tabular-nums;transition:background var(--dur-2),color var(--dur-2)}
.pt-chip[aria-current="true"]{background:var(--c-primary-700);border-color:var(--c-primary-700);color:#fff}
.pt-chip[aria-current="true"] .pt-chip-n{background:rgba(255,255,255,.18);color:#fff}

.pt-cat+.pt-cat{margin-top:var(--sp-7)}
.pt-cat-head{display:flex;align-items:center;gap:10px;margin:0 0 var(--sp-3);padding:0 var(--sp-1)}
.pt-cat-head h3{margin:0;font-size:var(--fs-md);font-weight:var(--fw-semibold)}
.pt-cat.is-entering,.pt-noresult.is-entering{animation:pt-fade var(--dur-3) var(--ease-out)}

/* Grid: 3 / 2 / 1 columns by the width of the content area */
.pt-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-4)}
@container (max-width:900px){.pt-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.pt-quick{grid-template-columns:minmax(0,1fr)}}
@container (max-width:560px){.pt-grid{grid-template-columns:minmax(0,1fr)}}

/* ---------- Application card ---------- */
.pt-card{position:relative;display:flex;flex-direction:column;min-height:196px;padding:var(--sp-5);border:1px solid var(--c-line);border-radius:var(--r-xl);background:var(--c-surface);box-shadow:var(--sh-1);
  transition:transform var(--dur-2) var(--ease-out),box-shadow var(--dur-2) var(--ease-std),border-color var(--dur-2) var(--ease-std);animation:pt-card-in var(--dur-3) var(--ease-out) backwards;animation-delay:calc(var(--i,0) * 35ms)}
@keyframes pt-card-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.pt-card:not(.is-disabled):hover{transform:translateY(-3px);border-color:var(--c-primary-200);box-shadow:var(--sh-3)}
.pt-card:not(.is-disabled):active{transform:translateY(-1px)}
.pt-card:not(.is-disabled):hover .pt-tile{transform:scale(1.06) rotate(-3deg)}
.pt-card:focus-within{border-color:var(--c-primary-300)}
.pt-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--sp-3);margin-bottom:var(--sp-4)}
.pt-card-flags{display:flex;align-items:center;gap:6px;margin:-4px -6px 0 0}
.pt-card-title{margin:0;font-size:var(--fs-md);font-weight:var(--fw-semibold);line-height:1.45;overflow-wrap:anywhere}
.pt-card-link{color:inherit;text-decoration:none;border-radius:4px}
.pt-card-link::after{content:'';position:absolute;inset:0;z-index:1;border-radius:var(--r-xl)}
.pt-card-link:focus-visible{box-shadow:none}
.pt-card-link:focus-visible::after{box-shadow:var(--ring)}
.pt-card-desc{margin:6px 0 0;color:var(--c-muted);font-size:var(--fs-sm);line-height:1.65;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pt-card-foot{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);margin-top:auto;padding-top:var(--sp-4)}
.pt-card-cat{min-width:0;color:var(--c-faint);font-size:var(--fs-xs);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pt-card-cta{display:inline-flex;align-items:center;gap:6px;flex-shrink:0;height:32px;padding:0 12px;border-radius:var(--r-full);background:var(--c-primary-50);color:var(--c-primary-ink);font-size:var(--fs-sm);font-weight:var(--fw-semibold);
  transition:background var(--dur-2) var(--ease-std),color var(--dur-2) var(--ease-std)}
.pt-card-cta svg{width:15px;height:15px;transition:transform var(--dur-2) var(--ease-out)}
.pt-card:hover .pt-card-cta{background:var(--c-primary-600);color:#fff}
.pt-card:hover .pt-card-cta svg{transform:translate(2px,-2px)}
.pt-card.is-disabled{background:var(--c-surface-2);box-shadow:none}
.pt-card.is-disabled .pt-tile{filter:grayscale(1);opacity:.7}
.pt-warn{display:block;padding:8px 12px;border-radius:var(--r-sm);background:#fdeced;color:#a02f37;font-size:var(--fs-sm);line-height:1.55}

/* ---------- Request access / other systems ---------- */
.pt-block-head{margin-bottom:var(--sp-3);padding:0 var(--sp-1)}
.pt-list{margin:0;padding:0;list-style:none;border:1px solid var(--c-line);border-radius:var(--r-xl);background:var(--c-surface);box-shadow:var(--sh-1);overflow:hidden}
.pt-item{display:flex;align-items:center;gap:var(--sp-4);min-height:68px;padding:12px 18px}
.pt-item+.pt-item{border-top:1px solid var(--c-line)}
.pt-item-text{flex:1;min-width:0}
.pt-item-text strong{display:block;font-size:14.5px;font-weight:var(--fw-semibold);overflow-wrap:anywhere}
.pt-item-text span{display:block;color:var(--c-muted);font-size:12.5px;line-height:1.6}
.pt-item form{margin:0;flex-shrink:0}
.pt-pending{flex-shrink:0;padding:4px 11px;border-radius:var(--r-full);background:var(--c-warn-soft);color:var(--c-warn);font-size:var(--fs-xs);font-weight:var(--fw-semibold);white-space:nowrap}
.pt-pending.is-muted{background:var(--c-surface-3);color:var(--c-muted)}

/* ---------- Help ---------- */
.pt-help{display:flex;gap:14px;padding:var(--sp-4) var(--sp-5);border:1px solid var(--c-line);border-radius:var(--r-lg);background:var(--c-surface-2)}
.pt-help>svg{width:20px;height:20px;margin-top:2px;color:var(--c-primary-600)}
.pt-help h2{margin:0;font-size:14px;font-weight:var(--fw-semibold)}
.pt-help p{max-width:80ch;margin:4px 0 0;color:var(--c-muted);font-size:var(--fs-sm);line-height:1.75}

/* ---------- Small screens ---------- */
@container (max-width:560px){
  .pt>*+*{margin-top:var(--sp-6)}
  .pt-welcome h1{font-size:var(--fs-xl)}
  .pt-lead{font-size:var(--fs-base)}
  .pt-stats{width:100%}
  .pt-stats div{flex:1;min-width:0;padding:8px 10px}
  .pt-stats dt{white-space:normal;line-height:1.35}
  .pt-guest{flex-direction:column;align-items:flex-start;padding:var(--sp-5)}
  .pt-guest .pt-btn{margin-left:0;width:100%}
  .pt-card{min-height:0;padding:var(--sp-4)}
  .pt-card-desc{-webkit-line-clamp:3}
  .pt-item{flex-wrap:wrap;padding:14px 16px}
  .pt-item form,.pt-item .pt-btn{width:100%}
  .pt-item .pt-pending{margin-left:50px}
  .pt-panel{padding:var(--sp-3) var(--sp-2) var(--sp-2)}
  .pt-fav{width:44px;height:44px}
  .pt-fav-sm{width:40px;height:40px}
  .pt-catalog-head{flex-direction:column;align-items:stretch}
}
/* Guest page has no container on <main>; fall back to viewport width. */
@media (max-width:900px){.auth-public .pt-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.auth-public .pt-grid{grid-template-columns:minmax(0,1fr)}.auth-public .pt-guest{flex-direction:column;align-items:flex-start}.auth-public .pt-guest .pt-btn{margin-left:0;width:100%}}
@media (hover:none){.pt-quick-go{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.pt *,.pt{animation:none!important;transition:none!important}}
