/* Bunian silk UI: source slices use pixels, rendered borders retain fixed corners. */
/* Progress images are separately sliced so animated percentage widths never stretch the corners. */
:root{--silk-progress-track:url('assets/ui/bunian-progress/progress-track.png');--silk-progress-gold:url('assets/ui/bunian-progress/progress-gold.png');--silk-progress-jade:url('assets/ui/bunian-progress/progress-jade.png')}
.policy-panel .policy-meter,.track{background:none;border:3px solid transparent;border-left-width:5px;border-right-width:5px;border-image-source:var(--silk-progress-track);border-image-slice:20 28 fill;border-image-width:3px 5px;border-image-repeat:stretch;border-radius:0;box-shadow:none;overflow:hidden;height:16px}
.policy-panel .policy-meter{min-width:45px}
.policy-panel .policy-meter i,.track i{min-width:0;background:none;border:0 solid transparent;border-image-slice:20 28 fill;border-image-width:1px 3px;border-image-repeat:stretch;box-sizing:border-box}
.policy-panel .policy-meter i.policy-fill-left,.track i{border-image-source:var(--silk-progress-gold)}
.policy-panel .policy-meter i.policy-fill-right{border-image-source:var(--silk-progress-jade)}
/* Only the outer caps are painted; the center seam stays continuous. */
.policy-panel .policy-meter i.policy-fill-left{border-image-width:1px 0 1px 3px}
.policy-panel .policy-meter i.policy-fill-right{border-image-width:1px 3px 1px 0}
.policy-panel .policy-meter i[style="width:0%"]{visibility:hidden}
@media(max-width:650px){.policy-panel .policy-meter,.policy-panel .track{height:14px;border-width:2px 4px;border-image-width:2px 4px}}
:root{--silk-ink:#362e24;--silk-muted:#685a43;--silk-line:#897557;--silk-popup:url('assets/ui/bunian-ui-v1/popup.png');--silk-button:url('assets/ui/bunian-ui-v1/button-idle.png');--silk-focus:url('assets/ui/bunian-ui-v1/button-focus.png')}

/* Overlay windows share one nine-slice source; event artwork remains full and uncropped. */
.overlay .dialog,.overlay .dialog:has(.event-illustration),.overlay .dialog:has(.war-result){background:none;color:var(--silk-ink);border:24px solid transparent;border-image-source:var(--silk-popup);border-image-slice:56 fill;border-image-width:24px;border-image-outset:0;border-image-repeat:stretch;padding:18px 20px;box-shadow:0 16px 60px #0007}
.overlay .dialog:has(.event-illustration){padding:12px 16px}
.overlay .dialog h2,.overlay .dialog h3{color:#463629;text-shadow:none}
.overlay .dialog small,.overlay .dialog .muted,.overlay .dialog .log{color:var(--silk-muted)}
.overlay .dialog .log{border-color:#89755755}
.overlay .dialog img.event-illustration{border-color:#8d7657}
.overlay .dialog input{accent-color:#954b36}
.overlay .dialog .war-result-country{background:#b59c6a20;border-color:#89755766}
.overlay .dialog .war-result.is-defeat>h2,.overlay .dialog .delta-loss{color:#913d2b}
.overlay .dialog .delta-gain{color:#3d622d}
.overlay .dialog .delta-flat,.overlay .dialog .war-result-note,.overlay .dialog .war-result th:first-child,.overlay .dialog .war-result thead th{color:var(--silk-muted)}
.overlay .dialog .war-result td,.overlay .dialog .war-result th{border-color:#89755744}

/* Text buttons use the same geometry for hover, focus and selected states. */
.home button,.screen .top>button,.start>button,.overlay .dialog button,.chronicle-button,.mapwrap .cancel-attack,.tabs:not(.difficulty-tabs)>button{background:none;border:3px solid transparent;border-image-source:var(--silk-button);border-image-slice:20 28 fill;border-image-width:12px 16px;border-image-outset:0;border-image-repeat:stretch;color:#fff0d2;box-shadow:0 2px 5px #0003;border-radius:0;padding:12px 20px;min-height:44px;line-height:1.45;transform:none;transition:color .15s,box-shadow .15s}
.home button:not(:disabled):hover,.screen .top>button:not(:disabled):hover,.start>button:not(:disabled):hover,.overlay .dialog button:not(:disabled):hover,.chronicle-button:not(:disabled):hover,.mapwrap .cancel-attack:not(:disabled):hover,.home button:focus-visible,.screen .top>button:focus-visible,.start>button:focus-visible,.overlay .dialog button:focus-visible,.chronicle-button:focus-visible,.mapwrap .cancel-attack:focus-visible,.tabs:not(.difficulty-tabs)>button.active{border-image-source:var(--silk-focus);color:#fff4cf;transform:none;box-shadow:0 0 8px #a75d3433}
.home button:focus-visible,.screen .top>button:focus-visible,.start>button:focus-visible,.overlay .dialog button:focus-visible,.chronicle-button:focus-visible,.mapwrap .cancel-attack:focus-visible{outline:2px solid #a65c3b;outline-offset:3px}
.overlay .dialog button small,.overlay .dialog button p{color:inherit}
.overlay .dialog:has(.event-illustration)>button{padding:9px 15px;margin:4px 0}
.overlay .dialog .secondary-action{font-size:14px}
.chronicle-button{height:44px;padding:6px 15px}
.mapwrap .cancel-attack{padding:10px 18px}

/* Draw the resource strip behind layout rather than stretching the complete image. */
#app>header.battle-header{padding:8px 40px}
#app>header.battle-header:before{background:none;border:20px solid transparent;border-left-width:40px;border-right-width:40px;border-image-source:url('assets/ui/bunian-ui-v1/topbar.png');border-image-slice:56 112 fill;border-image-width:20px 40px;border-image-repeat:stretch;box-shadow:0 3px 12px #0004}
.battle-header .hud-resource{color:var(--silk-ink);border-right-color:#89755755}
.battle-header .hud-resource:hover{background:#855e2c10;color:var(--silk-ink)}
.battle-header .hud-resource small,.battle-header .hud-date small{color:var(--silk-muted)}
.battle-header .hud-resource b,.battle-header .hud-date strong{color:var(--silk-ink);text-shadow:none}
.hud-resource .resource-symbol{flex-basis:34px;width:34px;height:36px}
.hud-resource:nth-child(1) .resource-symbol{background-image:url('assets/ui/bunian-ui-v1/icon-wealth.png')}
.hud-resource:nth-child(2) .resource-symbol{background-image:url('assets/ui/bunian-ui-v1/icon-people.png')}
.hud-resource:nth-child(3) .resource-symbol{background-image:url('assets/ui/bunian-ui-v1/icon-authority.png')}
.hud-resource.stability .resource-symbol{background-image:url('assets/ui/bunian-ui-v1/icon-stability.png')}
.battle-header .skill-button{position:relative;background-image:url('assets/ui/bunian-ui-v1/icon-skill-points.png');background-size:42px 42px;background-position:center top;padding:0}
.battle-header .skill-point-count{position:absolute;right:-2px;top:0;min-width:18px;padding:0 3px;border:1px solid #866d46;border-radius:3px;color:#fff0d2;background:#8e4936;font-size:13px;line-height:17px;font-weight:400}
.battle-header .skill-button small{position:absolute;bottom:0;left:0;right:0;color:var(--silk-ink)}

/* The same silk panel also frames policies and the selected-country information. */
.policy-panel{left:0;width:380px;padding:8px 10px;border:16px solid transparent;border-image-source:var(--silk-popup);border-image-slice:56 fill;border-image-width:16px;border-image-repeat:stretch;background:none;color:var(--silk-ink)}
.policy-panel .eyebrow{color:#745535}
.policy-panel .policy{gap:5px;margin:10px 0}
.policy-panel .policy>span{min-width:77px}
.policy-label{display:inline-flex;align-items:center;gap:2px;white-space:nowrap}
.policy-label-right{justify-content:flex-end}
.policy-label.is-policy-gain{color:#365f2c}.policy-label.is-policy-loss{color:#8e3e2a}
.policy-panel .realm-summary{display:flex;flex-wrap:wrap;gap:5px 10px;color:var(--silk-muted);border-color:#89755755}
.realm-summary>span{display:inline-flex;align-items:center;gap:2px;white-space:nowrap}
.silk-icon{display:inline-block;flex-shrink:0;vertical-align:middle;width:22px;height:22px;background:center/contain no-repeat}
.silk-icon-territory{background-image:url('assets/ui/bunian-ui-v1/icon-territory.png')}
.silk-icon-relics{background-image:url('assets/ui/bunian-ui-v1/icon-relics.png')}
.silk-icon-power{background-image:url('assets/ui/bunian-ui-v1/icon-power.png')}
.silk-icon-agriculture{background-image:url('assets/ui/bunian-ui-v1/icon-agriculture.png')}
.silk-icon-education{background-image:url('assets/ui/bunian-ui-v1/icon-education.png')}
.silk-icon-military{background-image:url('assets/ui/bunian-ui-v1/icon-military.png')}
.silk-icon-welfare{background-image:url('assets/ui/bunian-ui-v1/icon-welfare.png')}
.silk-icon-technology{background-image:url('assets/ui/bunian-ui-v1/icon-technology.png')}
.silk-icon-religion{background-image:url('assets/ui/bunian-ui-v1/icon-religion.png')}
#target.target-card{background:none!important;border:20px solid transparent!important;border-image:var(--silk-popup) 56 fill / 20px / 0 stretch!important;padding:10px 12px!important;color:var(--silk-ink)}
#target.target-card small{color:var(--silk-muted)}

@media(max-width:1200px){.policy-panel{width:350px}.hud-resource .resource-symbol{flex-basis:28px;width:28px;height:32px}.battle-header .hud-resources{gap:0}.battle-header .hud-resource{gap:5px;padding:5px 6px}.battle-header .hud-date{min-width:175px;gap:8px}}
@media(max-width:650px){#app>header.battle-header{padding:8px 16px;height:118px}#app>header.battle-header:before{border-width:16px 22px;border-image-width:16px 22px}.battle-header .hud-resource{gap:3px;padding:3px 4px}.battle-header .hud-resource b{font-size:16px}.hud-resource .resource-symbol{flex-basis:25px;width:25px;height:28px}.battle-header .hud-tools{gap:10px}.battle-header .skill-button{background-size:30px 30px}.battle-header .skill-point-count{font-size:11px;line-height:14px;min-width:15px}.policy-panel{top:132px;left:0;width:296px;max-width:100%;padding:6px;border-width:13px;border-image-width:13px}.policy-panel .policy>span{min-width:66px}.policy-panel .silk-icon{width:18px;height:18px}.policy-panel .policy{gap:3px;margin:9px 0}.overlay .dialog,.overlay .dialog:has(.event-illustration),.overlay .dialog:has(.war-result){border-width:18px;border-image-width:18px;padding:12px}.overlay .dialog:has(.event-illustration){padding:8px}.chronicle-button{font-size:11px;min-height:37px;height:37px}.overlay .dialog .relic-choice{width:100%;margin:6px 0}}
@media(prefers-reduced-motion:reduce){.home button,.start>button,.overlay .dialog button,.chronicle-button{transition:none}}

@media(max-width:380px){.battle-header .hud-resource{padding:3px;gap:2px}.battle-header .hud-resource b{font-size:14px}.hud-resource .resource-symbol{width:22px;height:25px;flex-basis:22px}.battle-header .hud-date{min-width:160px}.battle-header .hud-date strong{font-size:17px}}

/* All game return actions use one image, with their destination retained as an accessible name. */
.game-back-button,.screen .top>button.game-back-button,.overlay .dialog button.game-back-button{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:48px;height:48px;min-width:48px;min-height:48px;padding:0;margin:6px 12px 6px 0;border:3px solid transparent;border-image-source:var(--silk-button);border-image-slice:20 28 fill;border-image-width:8px 10px;border-image-repeat:stretch;border-radius:0;background:none;box-shadow:0 2px 5px #0004;vertical-align:middle;letter-spacing:0;line-height:1;transition:transform .18s,filter .18s}
.game-back-button .back-icon{display:block;width:38px;height:38px;pointer-events:none;background:url('assets/ui/bunian-controls/icon-back.png') center/contain no-repeat}
.game-back-button:hover,.screen .top>button.game-back-button:hover,.overlay .dialog button.game-back-button:hover,.game-back-button:focus-visible,.screen .top>button.game-back-button:focus-visible,.overlay .dialog button.game-back-button:focus-visible{border:3px solid transparent;border-image-source:var(--silk-focus);border-image-slice:20 28 fill;border-image-width:8px 10px;border-image-repeat:stretch;background:none;box-shadow:0 2px 6px #0004;color:inherit;transform:scale(1.06);filter:drop-shadow(0 0 4px #b68a4055)}
.game-back-button:focus-visible,.screen .top>button.game-back-button:focus-visible,.overlay .dialog button.game-back-button:focus-visible{outline:2px solid #9b5937;outline-offset:3px}
@media(max-width:650px){.game-back-button,.screen .top>button.game-back-button,.overlay .dialog button.game-back-button{width:44px;height:44px;min-width:44px;min-height:44px}.game-back-button .back-icon{width:34px;height:34px}}
@media(prefers-reduced-motion:reduce){.game-back-button,.screen .top>button.game-back-button,.overlay .dialog button.game-back-button{transition:none}}

/* Fit the complete realm beside the HUD; keep flags and lettering at display resolution. */
.map-country-marker{position:absolute;z-index:2;display:flex;align-items:center;justify-content:center;gap:3px;transform:translate(-50%,-50%);pointer-events:none;color:#302b21;text-shadow:0 1px 2px #fff2cd,0 0 5px #fff2cd;font-size:28px;line-height:1}
.map-country-marker .faction-flag{width:34px;height:51px;filter:drop-shadow(0 1px 1px #46341d66)}
#app>header.battle-header{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)}
.battle-header .hud-date{position:relative;left:auto;top:auto;transform:none;min-width:0;justify-content:center;text-align:center;grid-column:2;grid-row:1}
.battle-header .hud-date .hud-portrait{position:absolute;right:calc(100% + 12px)}
.battle-header .hud-tools{grid-column:3;grid-row:1;justify-self:end}
.battle-header .hud-resources{gap:0}
.battle-header .hud-resource{padding:5px 8px;gap:5px}
.battle-header .hud-resource.national-power .resource-symbol{background-image:url('assets/ui/bunian-ui-v1/icon-power.png')}
@media(min-width:651px) and (max-width:1400px){
  #app>header.battle-header{height:132px;row-gap:4px}
  .battle-header .hud-resources{grid-column:1/-1;grid-row:2;justify-content:center}
  .policy-panel{top:146px}
  .faction-standard{top:144px}
}
@media(max-width:900px){.battle-header .hud-resource b{font-size:15px}.battle-header .hud-resource{padding:4px;gap:3px}.battle-header .hud-date small{letter-spacing:1px}}
@media(max-width:650px){
  #app>header.battle-header{column-gap:4px;row-gap:2px}
  .battle-header .hud-resources{grid-column:1/-1;grid-row:2}
  .battle-header .hud-resources{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));width:100%}
  .battle-header .hud-resource{min-width:0;padding:3px 2px;gap:2px}
  .battle-header .hud-resource b{font-size:13px;letter-spacing:0}
  .battle-header .hud-resource small{font-size:9px;letter-spacing:1px}
  .battle-header .hud-resource .resource-symbol{width:18px;height:23px;flex-basis:18px}
  .map-country-marker{font-size:20px;gap:1px}
  .map-country-marker .faction-flag{width:24px;height:36px}
}
@media(max-width:450px){
  .battle-header .hud-tools{gap:4px}
  .battle-header .system-button,.battle-header .skill-button{width:28px;height:38px;background-size:28px 28px}
  .battle-header .hud-date small{font-size:8px;letter-spacing:0}
  .battle-header .hud-date strong{font-size:17px}
  .battle-header .hud-date .hud-portrait{right:calc(100% + 8px)}
}
