:root{font-family:"Yu Gothic UI","Meiryo","Hiragino Sans",system-ui,sans-serif;color:#182d36;background:#f2f6f6;line-height:1.55;--accent:#10615e;--deep:#103b40;--line:#d6e2e2;--sub:#456069}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{margin:0}
h1,h2,h3,p{margin:0}
button,input,select{font:inherit}
button{cursor:pointer;border:1px solid transparent;border-radius:.55rem;padding:.65rem .95rem;font-weight:700}
button:disabled{cursor:default;opacity:.5}
input,select{min-width:0;width:100%;min-height:44px;border:1px solid #aabfc2;border-radius:.45rem;background:white;padding:.52rem .63rem;color:#182d36}
:focus-visible{outline:3px solid #34a29b;outline-offset:2px}
input::placeholder{color:#667c80}
label{display:block;font-weight:700;margin:0 0 .35rem}
.top{background:var(--deep);color:white}
.bar,.shell,.footer{max-width:1120px;margin:0 auto;padding:0 24px}
.bar{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:76px}
.brand{display:flex;gap:12px;align-items:center}
.logo{display:grid;place-items:center;border:1px solid #649495;border-radius:10px;width:38px;height:38px;font-size:22px;color:#bce4de}
.brand small{display:block;font-size:.72rem;color:#cae4e1}
h1{font-size:1.25rem;line-height:1.3}
h2{font-size:clamp(1.45rem,3vw,2rem);line-height:1.3;letter-spacing:.02em}
h3{font-size:1.04rem}
.shell{padding-top:24px;padding-bottom:26px}
.card{background:white;border:1px solid var(--line);padding:20px;border-radius:14px}
.login{width:min(100%,450px);margin:36px auto}
.kicker{font-size:.75rem;font-weight:750;color:#11635f;letter-spacing:.08em;margin-bottom:.33rem}
.login p,.intro p{color:var(--sub);margin-top:.5rem}
.login form{margin-top:18px}
.login .primary{margin-top:12px;width:100%}
.ghost{color:white;background:transparent;border-color:#7b9e9e;font-size:.82rem}
.primary{color:white;background:var(--accent)}
.primary:hover:not(:disabled){background:#0c4c49}
.secondary{background:#fff;border-color:#adc5c6;color:var(--deep)}
.secondary:hover:not(:disabled){background:#edf5f5}
.small{padding:.4rem .7rem;font-size:.82rem}
.toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;border-bottom:1px solid var(--line)}
nav{display:flex;gap:4px;flex-wrap:wrap}
nav button{border-radius:.45rem .45rem 0 0;border-bottom:3px solid transparent;background:none;color:#435a62}
nav button[aria-current="page"]{color:#104e50;background:#e4f0ef;border-bottom-color:#177872}
.role{font-size:.78rem;color:var(--sub);white-space:nowrap}
.intro{margin:19px 0 17px}
.staff-grid{display:grid;grid-template-columns:minmax(320px,1.06fr) minmax(260px,1fr);gap:16px;align-items:start}
.entry #search{margin-bottom:14px}
.labelrow,.cardtop{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.cardtop{align-items:center}
.muted,.help{font-size:.82rem;color:var(--sub)}
.itemnote{padding:.55rem .68rem;margin:.45rem 0 .95rem;background:#edf5f5;border-radius:.35rem;color:var(--sub);min-height:2.5rem;font-size:.87rem}
.qtyrow{display:grid;grid-template-columns:1fr 1.35fr;gap:10px}
#other input{margin-bottom:12px}
#qty-help{margin:.4rem 0 1rem}
#save{width:100%}
.message{font-size:.9rem}
.global:not(:empty){margin-top:12px}
.message:not(:empty){padding:.55rem .7rem;border-radius:.4rem;background:#e7f3f0;color:#104e45}
.message[data-kind="error"]:not(:empty){background:#fcebe6;color:#802c19}
.list{margin:10px 0 0;padding:0;list-style:none}
.list li{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:.65rem 0;border-top:1px solid var(--line)}
.list .label{font-weight:700;overflow-wrap:anywhere}
.list .detail{color:var(--sub);font-size:.82rem}
.list button{flex-shrink:0}
.order-controls p,.recent p{margin-top:.45rem}
.controls{display:flex;align-items:end;gap:10px;flex-wrap:wrap;margin-top:.7rem}
#by-wrap{max-width:100%;width:240px}
.history-actions{margin-top:12px}
.history-actions p{margin-bottom:.55rem}
.preview{margin-top:17px}
.preview-label{display:flex;justify-content:space-between;align-items:center;margin-bottom:.45rem}
.preview-label span{font-size:.82rem;color:var(--sub)}
.pages{display:grid;gap:14px}
.sheet{width:100%;height:auto;display:block;background:white;border:1px solid var(--line);box-shadow:0 2px 8px #143e4112}
.sheet text{font-family:"Yu Gothic UI","Meiryo","Noto Sans CJK JP",sans-serif;fill:#101919}
.footer{padding-bottom:20px;color:#587179;font-size:.76rem}
@media(max-width:710px){.bar,.shell,.footer{padding-left:14px;padding-right:14px}.staff-grid{grid-template-columns:1fr}.card{padding:15px}.toolbar{align-items:flex-start}.role{margin-top:.65rem}.controls{align-items:stretch}.bar{min-height:64px}}
@page{size:A4 landscape;margin:0}
@media print{
  html,body{margin:0!important;padding:0!important;background:white!important;width:297mm}
  .top,.footer,#login-panel,.toolbar,#notice,.pane,.preview-label{display:none!important}
  .shell,.preview{margin:0!important;padding:0!important;max-width:none!important}
  .pages{display:block}
  .sheet{display:block;width:297mm;height:209.9mm;border:0;box-shadow:none;margin:0;break-inside:avoid}
  .sheet+.sheet{break-before:page;page-break-before:always}
  body:not(.print-ready) .preview{display:none!important}
}