/* UIkitとDesignReferenceをつなぐアプリ固有のレイアウト。色はReferenceのトークンを使う。 */
html { min-height:100%; }
:not(pre) > code { color:var(--color-text); background:var(--color-bg); }
[role="status"],.uk-alert-danger { padding:var(--space-4); margin-bottom:var(--space-4); border-radius:var(--radius-md); }
body { min-height:100vh; }
.app-header.uk-navbar-container { background:var(--color-primary); color:var(--color-on-fill); border-bottom:1px solid var(--color-primary-edge); }
.app-header .uk-navbar { padding:0 var(--space-6); gap:var(--space-4); }
.app-header .uk-navbar-left,.app-header .uk-navbar-right { gap:var(--space-4); align-items:center; }
.app-brand.uk-navbar-item { min-height:72px; padding:0; gap:var(--space-4); color:var(--color-on-fill); font-family:var(--font-heading); font-weight:700; font-size:var(--fs-lg); text-decoration:none; }
.app-brand img { width:130px; height:28px; object-fit:contain; }
.app-header form { margin:0; }
.app-header .uk-button-default { color:var(--color-on-fill); border-color:var(--color-on-fill); background:transparent; }
.app-header .uk-button-default:hover,.app-header .uk-button-default:focus { background:var(--color-primary-hover); color:var(--color-on-fill); }
.app-header :focus-visible { outline-color:var(--color-on-fill); }
.app-account { font-size:var(--fs-sm); }
.app-shell { display:grid; grid-template-columns:240px minmax(0,1fr); min-height:calc(100vh - 73px); }
.app-sidebar { background:var(--color-surface); border-right:1px solid var(--color-border); padding:var(--space-6) var(--space-4); }
.app-sidebar .uk-nav-default > li > a,.app-drawer .uk-nav-default > li > a { padding:var(--space-3); border-left:3px solid transparent; color:var(--color-text); }
.app-sidebar .uk-nav-default > li.uk-active > a,.app-drawer .uk-nav-default > li.uk-active > a { background:var(--color-primary-subtle); border-left-color:var(--color-primary-text); color:var(--color-primary-text); font-weight:700; }
.app-sidebar .uk-nav-default > li > a:hover,.app-drawer .uk-nav-default > li > a:hover { background:var(--color-bg); }
.app-sidebar .uk-nav-header,.app-drawer .uk-nav-header { color:var(--color-text-muted); font-size:var(--fs-xs); padding-left:var(--space-3); }
.app-sidebar .uk-nav-divider,.app-drawer .uk-nav-divider { border-color:var(--color-border); }
.app-main { min-width:0; padding:var(--space-8); max-width:1440px; width:100%; box-sizing:border-box; }
.app-main > h1 { margin-bottom:var(--space-6); }
.app-login-shell { display:grid; place-items:start center; padding:var(--space-12) var(--space-4); }
.app-login-shell .app-main { padding:0; max-width:460px; }
.app-form-card { max-width:680px; }
.uk-card { border:1px solid var(--color-border); box-shadow:var(--shadow-sm); }
.uk-card-title { font-size:var(--fs-lg); }
.uk-form-label { color:var(--color-text); font-size:var(--fs-sm); font-weight:700; margin-bottom:var(--space-2); }
.uk-input,.uk-select,.uk-textarea { border-color:var(--color-border-strong); color:var(--color-text); background:var(--color-surface); font-family:var(--font-sans); }
.uk-button { text-transform:none; font-size:var(--fs-sm); font-weight:700; }
.uk-table th { color:var(--color-text-muted); font-size:var(--fs-sm); text-transform:none; }
.uk-table tbody th { color:var(--color-text); font-weight:400; }
.uk-table td,.uk-table th { white-space:nowrap; }
.uk-label { text-transform:none; font-size:var(--fs-xs); }
.app-row-actions { display:flex; align-items:center; flex-wrap:wrap; gap:var(--space-2); }
.app-row-actions form { margin:0; }
.app-validation,.validation-summary-errors { padding:var(--space-4); border-radius:var(--radius-md); }
.validation-summary-errors ul { margin:0; padding-left:var(--space-6); }
.validation-summary-valid { display:none; }
.input-validation-error { border-color:var(--color-danger-text); }
.uk-modal-dialog,.app-drawer.uk-offcanvas-bar { background:var(--color-surface); color:var(--color-text); border-radius:var(--radius-md); }
.uk-modal-title { color:var(--color-text); font-size:var(--fs-lg); }
.app-drawer.uk-offcanvas-bar { border-radius:0; padding-top:80px; }
.app-drawer .uk-offcanvas-close { top:var(--space-4); right:var(--space-4); }
.app-drawer .uk-button-default { color:var(--color-text); border-color:var(--color-border-strong); background:var(--color-surface); }
@media (max-width:959px) { .app-shell { display:block; } .app-main { padding:var(--space-6) var(--space-4); } }
@media (max-width:639px) { .app-header .uk-navbar { padding:0 var(--space-3); flex-wrap:wrap; justify-content:space-between; padding-bottom:var(--space-3); gap:var(--space-2); } .app-brand.uk-navbar-item { min-height:64px; font-size:var(--fs-md); } .app-brand img { display:none; } .app-header .uk-navbar-left,.app-header .uk-navbar-right { gap:var(--space-2); } .app-login-shell { padding-top:var(--space-6); } .uk-card-body { padding:var(--space-6); } }