/* Quiet, short interactions; no perpetual motion or simulated status lights. */
:root{--ease-out:cubic-bezier(.2,.75,.25,1);--ease-in-out:cubic-bezier(.4,0,.2,1)}
button,a,summary,input,textarea,select{transition:color 160ms ease,background-color 180ms ease,border-color 180ms ease,box-shadow 220ms ease,filter 180ms ease,transform 180ms var(--ease-out)}
button:disabled{cursor:not-allowed;transform:none;filter:none}
.primary,.secondary,.ghost,.archive-card,.icon-button{position:relative}
.primary:focus-visible,.secondary:focus-visible,.archive-card:focus-visible,.folder-link:focus-visible,.nav-link:focus-visible,.faction-button:focus-visible{outline:2px solid var(--t-title);outline-offset:3px}
.nav-link>span:first-child,.archive-icon,.faction-mark,.holonet-mark{transition:transform 240ms var(--ease-out),filter 240ms ease,color 180ms ease}
.holocron-scene :is(img,svg){transition:transform 500ms var(--ease-out),filter 350ms ease}
.user-card,.settings-card{transition:border-color 200ms ease,background-color 200ms ease,box-shadow 200ms ease}
.access-note{margin-top:19px;font-size:11px;line-height:1.6;color:var(--t-muted);letter-spacing:.15px}
.record-body{border-top:1px solid var(--t-line);margin-top:5px;padding-top:19px}
.reader-panel .section-line{margin-bottom:12px}
.settings-fixed{border-left:2px solid var(--t-gold)}
.settings-card>summary{border-radius:2px}
.rich-tabs [role=tab]{transition:color 150ms ease,background-color 180ms ease,border-color 180ms ease}
.rich-tabs [role=tabpanel]:not([hidden]){animation:content-in 180ms var(--ease-out) both}
@media(hover:hover) and (pointer:fine){
  .primary:not(:disabled):hover{transform:translateY(-1px);filter:brightness(1.13);box-shadow:inset 0 1px rgba(var(--t-rgb),.7),0 3px 12px rgba(var(--t-rgb),.18)}
  .secondary:not(:disabled):hover,.ghost:not(:disabled):hover,.icon-button:not(:disabled):hover{transform:translateY(-1px);filter:brightness(1.12)}
  .archive-card:hover{transform:translateY(-2px);box-shadow:inset 0 1px rgba(var(--t-rgb),.35),0 4px 14px #0006;filter:brightness(1.08)}
  .archive-card:hover .archive-icon{transform:translateY(-1px);filter:drop-shadow(0 0 4px rgba(var(--t-rgb),.4))}
  .faction-button:hover,.nav-link:hover,.folder-link:hover,.record-row:hover{background-color:rgba(var(--t-rgb),.09);color:var(--t-ink)}
  .nav-link:hover>span:first-child{transform:translateX(2px)}
  .faction-button:hover .faction-mark,.faction-button:hover .holonet-mark{transform:scale(1.06)}
  .record-row:hover{box-shadow:inset 2px 0 rgba(var(--t-rgb),.55)}
  .folder-link:hover{border-color:var(--t-line)}
  .faction-heading:hover .holocron-scene :is(img,svg){transform:translateY(-3px)}
  .user-card:hover{background-color:rgba(var(--t-rgb),.035)}
  .settings-card:hover{border-color:var(--t-metal)}
  .settings-card>summary:hover{color:var(--t-title);background-color:rgba(var(--t-rgb),.045)}
}
button:not(:disabled):active{transform:translateY(1px);transition-duration:70ms}
.archive-card:not(:disabled):active{transform:translateY(0);filter:brightness(.97)}
.filter-reset:active,.record-row:active,.folder-link:active{transform:none}
@keyframes content-in{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
@keyframes row-in{from{opacity:0;transform:translateY(3px)}to{opacity:1;transform:none}}
@keyframes notification-in{from{opacity:0;transform:translate(-50%,6px)}to{opacity:1;transform:translate(-50%,0)}}
#main>.page-heading,#main>.archive-switcher,#main>.archive-workspace,#main>.user-list,#main>.structure-tools,#main>.structure-layout,#main>.settings-content{animation:content-in 240ms var(--ease-out) both}
#main>.archive-workspace,#main>.structure-layout{animation-delay:35ms}
#record-preview>.record-heading,#record-preview>.record-folder-path,#record-preview>.record-properties,#record-preview>.record-body{animation:content-in 180ms var(--ease-out) both}
.record-row{animation:row-in 180ms var(--ease-out) both}
.record-row:nth-child(2){animation-delay:20ms}.record-row:nth-child(3){animation-delay:40ms}.record-row:nth-child(4){animation-delay:60ms}
.login-screen:not([hidden]){animation:content-in 260ms var(--ease-out) both}
.notification:not([hidden]){animation:notification-in 180ms var(--ease-out) both}
dialog{opacity:0;transform:translateY(8px) scale(.99);transition:opacity 160ms ease,transform 200ms var(--ease-out),display 200ms allow-discrete,overlay 200ms allow-discrete}
dialog[open]{opacity:1;transform:none}
dialog::backdrop{transition:background-color 180ms ease,display 200ms allow-discrete,overlay 200ms allow-discrete}
dialog:not([open])::backdrop{background-color:transparent}
@starting-style{dialog[open]{opacity:0;transform:translateY(8px) scale(.99)}dialog[open]::backdrop{background-color:transparent}}
@media(max-width:620px){.access-note{font-size:10px;margin-top:13px;max-width:190px;padding-bottom:28px}.record-body{padding-top:14px}}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .archive-card:hover,.primary:hover,.secondary:hover,.ghost:hover,.icon-button:hover,.faction-heading:hover .holocron-scene :is(img,svg),.faction-button:hover .faction-mark,.faction-button:hover .holonet-mark,.nav-link:hover>span:first-child{transform:none!important}
}

/* Use the viewport instead of a fixed 1500px window. Text grows gently on
   large displays, while article line lengths stay comfortable to read. */
:root{font-size:clamp(16px,calc(12px + .25vw),22px);--page-gap:clamp(12px,1.5vw,48px)}
body{padding:calc(var(--page-gap) + 8px) var(--page-gap) var(--page-gap);font-size:1rem}
.app{width:100%;max-width:none;min-height:calc(100svh - 2 * var(--page-gap) - 8px);grid-template-columns:clamp(220px,15vw,320px) minmax(0,1fr);grid-template-rows:minmax(2.4rem,auto) 1fr;gap:.6rem;padding:0 .6rem .6rem}
.topbar{margin:0 -.6rem;padding:.35rem .65rem;min-height:2.2rem;flex-wrap:wrap}
.breadcrumb,#account-button{font-size:.75rem}.breadcrumb{white-space:normal;flex-wrap:wrap}
#account-button{max-width:min(28vw,20rem)}.logout,.icon-button{width:1.8rem;height:1.8rem;font-size:1.15rem;line-height:1}
.sidebar{padding:.6rem}.sidebar .brand{font-size:1.25rem;margin:1rem .2rem 1.6rem;gap:.6rem}.sidebar .brand small{font-size:.6rem;letter-spacing:.08rem}.sidebar .brand-symbol{width:2rem;height:2.4rem;font-size:1.7rem}
.sidebar-label,.section-line h2{font-size:.8rem}.sidebar-label,.section-line{min-height:2rem;padding:.45rem .6rem}
.faction-button{padding:.85rem .4rem;gap:.6rem}.faction-button strong,.nav-link{font-size:.875rem;line-height:1.45}.faction-button small{font-size:.7rem}
.nav-link{min-height:2.7rem;padding:.65rem .4rem}.nav-link>span:first-child{font-size:1rem;width:1.2rem}
.primary,.secondary,.ghost{font-size:.875rem;min-height:2.25rem;padding:.4rem .85rem;line-height:1.4}
.page-heading{padding:1rem;gap:1rem}.page-heading h1{font-size:1.7rem}.page-heading p{font-size:.875rem}
.faction-heading{min-height:clamp(190px,12vw,260px);padding:1.4rem;gap:1rem}.faction-heading h1{font-size:2.2rem}.faction-heading .eyebrow{font-size:.75rem}.faction-heading p,.access-note{font-size:.875rem}.hero-copy{padding-right:clamp(180px,15vw,300px)}
.hero-insignia{margin-top:1rem}.seal{width:3.8rem;height:3.8rem}.holocron-scene{width:clamp(190px,15vw,300px);height:clamp(150px,10vw,205px);right:1.3rem;top:.5rem}.holocron-scene :is(img,svg){height:80%;top:.2rem}.hero-actions{right:1.3rem;bottom:1rem}
.archive-grid{gap:.6rem;padding:.4rem}.archive-card{min-height:4.2rem;padding:.7rem 1rem;gap:.6rem}.archive-name{font-size:1rem}.archive-name small{font-size:.65rem;letter-spacing:.07rem}.count{font-size:.75rem;padding:.2rem .4rem}
.archive-workspace{grid-template-columns:clamp(300px,25vw,580px) minmax(0,1fr);gap:.8rem;min-height:30rem}.inset-panel{padding:.6rem}
.record-toolbar{gap:.5rem}.record-toolbar input,.record-toolbar select{font-size:.875rem;min-height:2.25rem;height:auto;padding:.45rem .6rem}.filter-reset{font-size:.75rem}
.record-row{padding:1rem .65rem;min-height:5rem}.record-title strong{font-size:1rem}.record-title small,.record-count,.tag,.date,.minor{font-size:.75rem}.record-row-meta{flex-wrap:wrap;gap:.4rem}
.record-heading h2{font-size:1.8rem}.record-heading .eyebrow{font-size:.75rem}.record-summary,.record-properties strong{font-size:.875rem}.record-properties span{font-size:.75rem}.record-body{font-size:1rem;line-height:1.8}.read-only{font-size:.8rem}
#record-preview{width:100%;max-width:90ch;margin-inline:auto;padding-inline:clamp(.4rem,1.2vw,1.8rem)}
.empty{font-size:.9rem;padding:2rem 1rem}.empty strong{font-size:1rem}.reader-panel .empty{max-width:26rem}
.folder-heading{gap:.5rem;flex-wrap:wrap}.folder-heading strong,.folder-link,.folder-prompt,.folder-location,.record-folder-path{font-size:.8rem}.folder-heading .secondary{font-size:.7rem;min-height:1.9rem;padding:.35rem .5rem}.folder-link{min-height:2.2rem}.folder-link small{font-size:.7rem}
.pagination span,.pagination button{font-size:.8rem}.pagination button{min-height:2rem;min-width:2rem}
label,.check,legend,.small,.form-error,.user-card p,.user-activity,.audit-row,.login-panel label,.login-help{font-size:.875rem}.user-card h3{font-size:1.15rem}.user-activity dt,.user-activity dd,.user-activity small{font-size:.75rem}
input,textarea,select{font-size:1rem;min-height:2.4rem;padding:.5rem .65rem}input[type=checkbox]{min-height:0}
dialog{width:50rem;max-width:calc(100vw - 24px);max-height:92svh;padding:2.5rem 1.2rem 1.2rem}.narrow{width:32rem}dialog:before{font-size:.7rem;height:1.6rem;padding:.35rem .6rem}.modal-heading h2{font-size:1.5rem}
.login-screen{max-width:66rem}.login-panel h1{font-size:2rem}.intro{font-size:1rem}.login-panel input,.login-panel .primary{min-height:2.6rem}
.demo-banner,footer,footer>span:last-child{font-size:.65rem}.demo-banner{padding:.4rem .6rem}footer{padding:.7rem .3rem .2rem}
@media(max-width:1100px){
  .archive-workspace{grid-template-columns:minmax(260px,38%) minmax(0,1fr)}
  .hero-insignia{display:none}.faction-heading h1{font-size:1.9rem}
  .record-properties{grid-template-columns:1fr}.record-heading h2{font-size:1.6rem}
}
@media(max-width:900px){
  .app{grid-template-columns:1fr;grid-template-rows:auto auto 1fr}.sidebar{display:block}.sidebar .brand,.sidebar-label{display:none}
  .factions{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:.5rem}.faction-button{flex:1 1 160px;border:1px solid var(--t-line);padding:.6rem}.faction-button strong{white-space:normal}
  .navigation{display:flex;flex-wrap:wrap;gap:.4rem}.nav-link{flex:1 1 130px;justify-content:center;border:1px solid var(--t-line)}.nav-arrow{display:none}
}
@media(max-width:620px){
  :root{font-size:16px;--page-gap:8px}.app{gap:.4rem;padding:0 .35rem .4rem}.topbar{margin:0 -.35rem;gap:.4rem}.breadcrumb{font-size:.65rem}#account-button{font-size:.75rem;max-width:48vw}
  .factions{display:grid;grid-template-columns:1fr}.faction-button{min-height:2.6rem}.faction-button span:last-child{flex-wrap:wrap;gap:.3rem .6rem}.faction-button small{font-size:.7rem}
  .nav-link{font-size:.8rem;min-height:2.5rem}.faction-heading{min-height:185px;padding:1rem .7rem}.faction-heading h1{font-size:1.65rem}.hero-copy{padding-right:88px}.faction-heading p,.access-note{font-size:.8rem}.holocron-scene{width:100px;height:105px;right:0;top:1rem}.hero-actions{right:.7rem;bottom:.7rem}.hero-actions .primary{font-size:.875rem;padding:.4rem .7rem}
  .archive-card{padding:.6rem;min-height:4rem}.archive-name{font-size:.875rem}.archive-name small{font-size:.6rem}
  .archive-workspace{grid-template-columns:1fr;min-height:0}.record-toolbar{grid-template-columns:1fr}.record-toolbar input,.record-toolbar select{font-size:1rem;min-height:2.6rem}
  .record-title strong{font-size:1rem}.entries-panel #records-container{max-height:24rem}.record-properties{grid-template-columns:1fr 1fr}.record-heading h2{font-size:1.5rem}.record-body{font-size:1rem}.reader-panel{min-height:24rem}
  .folder-link{min-height:2.5rem}.folder-heading .secondary{font-size:.75rem;min-height:2.2rem}.inset-panel{padding:.45rem}#record-preview{padding:0 .25rem}
  .login-screen{margin-top:.8rem}.login-panel{padding:1.5rem 1rem}.login-panel label,.login-help{font-size:.875rem}
}
