:root{color-scheme:light;--ink:#152b4a;--muted:#506581;--paper:#fff;--border:#d8e4f3;--accent:#174fd1;--accent-soft:#e4edff;--wash:#f4f8ff;font-family:system-ui,"Malgun Gothic","Apple SD Gothic Neo",sans-serif;color:var(--ink);background:var(--wash)}
*{box-sizing:border-box}
body{margin:0;font-size:16px;line-height:1.55}
[hidden]{display:none!important}
button,input,select,textarea{font:inherit}
button{min-height:44px;border:1px solid var(--border);border-radius:10px;padding:9px 15px;background:#fff;color:var(--ink);font-weight:700;cursor:pointer}
button:hover{border-color:var(--accent)}
button:disabled{opacity:.55;cursor:wait}
:focus-visible{outline:3px solid #2761d9;outline-offset:2px}
.primary{background:var(--accent);border-color:var(--accent);color:#fff}
.primary:hover{background:#103fb3;border-color:#103fb3}
.danger{color:#9d352e}
.shell{width:min(1130px,calc(100% - 40px));margin:auto}
.top{background:var(--paper);border-bottom:1px solid var(--border);color:var(--ink)}
.top-inner,.brand{display:flex;align-items:center;gap:12px}
.top-inner{justify-content:space-between;min-height:76px}
.brand strong,.brand span{display:block}
.brand span{font-size:12px;color:var(--muted)}
.brand img{border-radius:11px}
.ready{font-size:12px;font-weight:700;background:#d9f8ed;color:#075b46;border-radius:30px;padding:6px 10px;text-align:center}
.layout{display:grid;grid-template-columns:205px minmax(0,1fr);gap:26px;padding-block:28px 56px}
nav{display:grid;gap:8px}
nav button{text-align:left;border-color:transparent;background:transparent}
nav [aria-current]{background:var(--accent-soft);color:#123fa8}
.local-note{margin-top:22px;border-top:1px solid var(--border);padding:16px 12px;font-size:14px;font-weight:700}
.local-note span,.muted{color:var(--muted);font-weight:400}
main{min-width:0}
h1,h2,h3,p{margin:0}
h1{font-size:clamp(25px,4vw,38px);line-height:1.25;letter-spacing:-.045em;overflow-wrap:anywhere}
h2{font-size:19px}
h3{font-size:16px}
.eyebrow{font-weight:800;font-size:13px;color:var(--accent);margin-bottom:8px}
.hero{border-radius:19px;background:linear-gradient(120deg,#e2ecff,#e7fbfb);padding:clamp(20px,5vw,42px);border:1px solid #cbdcf9}
.hero p:not(.eyebrow){color:var(--muted);margin:12px 0 21px}
.hero .primary{box-shadow:0 4px 10px #174fd126}
.section-title,.heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 16px}
.section-title{margin-top:23px}
#count,#save-state{font-size:13px;color:var(--muted);text-align:right}
.card,.report-row,.empty{background:var(--paper);border:1px solid var(--border);border-radius:15px;padding:clamp(15px,3vw,24px);margin-bottom:13px}
.card h2{margin-bottom:12px}
.card h2 span{margin-left:5px}
.card p{margin-bottom:14px}
.report-row{width:100%;text-align:left;display:grid;gap:4px;overflow-wrap:anywhere}
.report-row span,.empty{color:var(--muted);font-size:14px}
.view-nav,.save-help{margin-bottom:14px}
.archive-filters{margin-top:16px}
.archive-group{margin-bottom:18px}
.archive-group h3{margin-bottom:9px;overflow-wrap:anywhere}
.archive-entry{padding:12px;margin-bottom:10px;border:1px solid var(--border);border-radius:15px;background:var(--paper)}
.archive-entry .report-row{margin-bottom:8px}
#history-name,#backup-files,#restore-status{overflow-wrap:anywhere}
.fields,.photo-groups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:12px}
.wide{grid-column:1/-1}
label{display:block;font-weight:700;font-size:14px;min-width:0}
label em{font-style:normal;color:var(--accent);font-size:12px}
input,select,textarea{display:block;width:100%;min-width:0;min-height:44px;margin-top:6px;border:1px solid #9aafce;border-radius:9px;padding:9px 10px;color:var(--ink);background:#fff;font-size:16px;font-weight:400}
textarea{resize:vertical}
input[type=color]{padding:5px}
input[type=file]{padding:5px}
input::file-selector-button{background:var(--accent-soft);border:0;border-radius:5px;color:var(--ink);padding:5px 8px;font:inherit}
.photo-group{min-width:0;background:#eef5ff;border-radius:12px;padding:13px}
.photo-group h3{margin-bottom:9px}
.photo-picker,.actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.photo-picker label{cursor:pointer;border:1px solid var(--border);background:#fff;border-radius:9px;padding:10px;min-height:44px}
.photo-picker label:focus-within{outline:3px solid #2761d9}
.sr-only{position:absolute;width:1px;height:1px;min-height:0;clip-path:inset(50%);padding:0}
.photo{margin-top:10px;background:white;border-radius:10px;padding:8px}
.photo img{display:block;width:100%;height:135px;object-fit:contain;background:var(--wash);border-radius:7px}
.photo button{margin-top:6px}
.logo-preview img{max-height:80px;max-width:100%;object-fit:contain}
#import{margin-top:10px}
.storage-warning{background:#fff7e5;border:1px solid #eddfbb;border-radius:10px;color:#574517;font-size:14px;padding:10px 12px;margin-block:12px}
#backup-progress,#backup-files{margin:10px 0 0}
#backup-progress:empty,#backup-files:empty{display:none}
#backup-files{list-style:none;padding:0;display:grid;gap:10px}
#backup-files li{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.file-help{padding-inline-start:22px}
#restore-status{margin:10px 0 0}
#layout-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.layout-card{display:grid;grid-template-rows:auto 1fr auto auto;align-items:start;gap:8px;min-width:0;padding:10px;text-align:left}
.layout-card[aria-pressed=true]{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent);background:var(--accent-soft)}
.layout-card[aria-pressed=true] .layout-count::after{content:' · 선택됨'}
.layout-card strong{font-size:15px;overflow-wrap:anywhere}
.layout-sheets{display:flex;align-items:center;justify-content:center;gap:4px;background:var(--wash);padding:8px;border-radius:7px;min-height:140px}
.layout-sheets img{width:min(100%,116px);height:auto;border:1px solid var(--border);box-shadow:0 1px 4px #152b4a26}
.layout-sheets img:not(:only-child){width:min(calc(50% - 2px),116px)}
.layout-summary,.layout-count,#layout-status{font-size:13px;color:var(--muted)}
.layout-summary{font-weight:400;word-break:keep-all;overflow-wrap:anywhere}
.layout-picker #layout-status{margin:12px 0 0}
#pages img{display:block;width:min(100%,760px);height:auto;margin:0 auto 15px;background:white;box-shadow:0 2px 12px #152b4a26}
.message{position:fixed;z-index:2;bottom:18px;left:50%;transform:translateX(-50%);width:max-content;max-width:calc(100% - 30px);border-radius:11px;padding:12px 17px;background:var(--ink);color:#fff;box-shadow:0 3px 18px #152b4a40;pointer-events:none}
.message.error{background:#88372e}
@media(max-width:680px){
  .shell{width:calc(100% - 24px)}
  .layout{display:block;padding-top:12px}
  nav{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:14px}
  nav button{font-size:14px;padding-inline:8px}
  .local-note{display:none}
  .fields,.photo-groups{grid-template-columns:1fr}
  .top-inner{min-height:62px}
  #layout-options{gap:6px}
  .layout-card{padding:6px;gap:5px}
  .layout-card strong{font-size:13px}
  .layout-sheets{min-height:80px;padding:4px;flex-direction:column}
  .layout-sheets img:not(:only-child){width:min(100%,116px)}
  .layout-summary,.layout-count{font-size:12px}
}