/* Decorative terminal shell; all screen content is live application UI. */
:is(#recOv,#rewEditOv,#recLogOv,#rewExtraOv){padding:8px;background:rgba(24,39,54,.48);backdrop-filter:blur(7px)!important}
.rec-terminal{position:relative;width:min(1440px,calc((100dvh - 16px) * 1.333333),calc(100vw - 16px));aspect-ratio:4/3;background:url('/assets/optimized/entry-terminal.webp') center/100% 100% no-repeat;flex:none}
:is(#recOv,#rewEditOv,#recLogOv,#rewExtraOv) :is(#recBox,#rewEditBox,#recLogBox,#rewExtraBox){position:absolute;left:20.1%;top:10.86%;width:56.22%!important;height:56.72%!important;max-width:none!important;max-height:none!important;min-width:0!important;border:1px solid #52636c;border-radius:0!important;background:#dce3e5;box-shadow:0 0 0 2px #34414b,0 0 6px 3px #18273180;overflow:hidden!important;backdrop-filter:none}
/* Fixed glass shading never intercepts controls. */
:is(#recOv,#rewEditOv,#recLogOv,#rewExtraOv) :is(#recBox,#rewEditBox,#recLogBox,#rewExtraBox)::after{content:"";position:absolute;inset:0;z-index:20;pointer-events:none;border-radius:inherit;box-shadow:inset 0 0 5px 2px #12232b8c,inset 0 0 22px 5px #162a3533;background:linear-gradient(115deg,#ffffff07,transparent 35%,#1e344409)}
:is(#recBox,#rewEditBox,#recLogBox,#rewExtraBox) .rewHead{padding:10px 20px;background:linear-gradient(100deg,#355b7b,#62849a)!important;border:0;min-height:56px;gap:8px;flex-wrap:nowrap;flex:none}
:is(#recBox,#rewEditBox,#recLogBox,#rewExtraBox) .rewHead>b{font-size:clamp(19px,1.8vw,27px);color:#fff;display:flex;align-items:center;gap:12px;white-space:nowrap}
:is(#recBox,#rewEditBox,#recLogBox,#rewExtraBox) .rewHead>b img{width:28px;height:28px;filter:brightness(0) invert(1)}
:is(#recBox,#rewEditBox,#recLogBox,#rewExtraBox) .rewHead>div{flex-wrap:nowrap}
:is(#recBox,#rewEditBox,#recLogBox,#rewExtraBox) button{border:1px solid #b1c2cc;border-radius:9px;background:linear-gradient(#e8edec,#d6e0e4);color:#274a62;font-size:13px;min-height:32px;box-shadow:inset 0 1px #fff}
:is(#recBox,#rewEditBox,#recLogBox,#rewExtraBox) #recRuleBtn{background:#d4e0e5;color:#284c66}
:is(#recBox,#rewEditBox,#recLogBox,#rewExtraBox) #recTop{padding:12px 20px 8px;background:#dce3e5;border:0}
#recTop .rwTop{grid-template-columns:minmax(120px,1.2fr) minmax(190px,1.15fr) minmax(160px,1fr);gap:14px}
#recTop .rwTopItem{gap:6px}
#recTop .rwTopItem label{color:#123d75;font-weight:700;font-size:14px}
#recTop select,#recTop input{background:#e4e9e8;border:1px solid #aebfc8;color:#073574;font-size:16px;box-shadow:inset 0 1px #fff;height:40px}
#recTop .rwTopTotal{background:#ccdce2;border-color:#b9cbd4;color:#123d75;font-size:13px;font-weight:600;padding:8px 12px 8px 42px;position:relative}
#recTop .rwTopTotal::before{content:'';position:absolute;left:10px;top:50%;width:25px;height:30px;transform:translateY(-50%);background:url('/assets/icons/coin.svg') center/contain no-repeat;filter:invert(66%) sepia(96%) saturate(1729%) hue-rotate(1deg)}
#recTop #recTotal{font-size:25px;color:#b63238}
:is(#recBox,#rewEditBox,#recLogBox,#rewExtraBox) #recBody{padding:6px 18px 14px;gap:10px;background:#dce3e5}
#recBody .rwCard{border:1px solid #b6c7cd;border-radius:14px;box-shadow:0 3px 10px #147cdf08;background:#e7ecea}
#recBody .rwCardHead{padding:8px 14px;background:linear-gradient(100deg,#d1dfe3,#c5d6de);border-bottom:0;gap:10px;min-height:40px}
#recBody .rwName{font-size:19px;color:#002963;display:flex;align-items:center;gap:12px}
#recBody .rwName::before{content:'';display:inline-block;width:24px;height:25px;flex:none;background:url('/assets/icons/briefcase-fill.svg') center/contain no-repeat;filter:invert(35%) sepia(99%) saturate(3625%) hue-rotate(195deg)}
#recBody .rwCard:nth-child(2) .rwName::before{background-image:url('/assets/icons/coin.svg')}
#recBody .rwCard:nth-child(3) .rwName::before{background-image:url('/assets/icons/pencil-square.svg')}
#recBody .rwCard:nth-child(4) .rwName::before{background-image:url('/assets/icons/bar-chart-fill.svg')}
#recBody .rwCardHead button{color:#2b65a8;background:#dce5e7;border-color:#b1c4ce;min-height:26px}
#recBody .rwCardBody{padding:0 14px 9px}
#recBody .rwRule{grid-template-columns:minmax(0,1fr) minmax(160px,36%);padding:9px 4px 3px;gap:3px 14px;border:0}
#recBody .rwRuleInfo b{font-size:16px;color:#0a3067;margin-bottom:0}
#recBody .rwRuleInfo>span{font-size:11px;padding:2px 8px;background:#d5e1e5;color:#3c6fac}
#recBody .rwRuleInput{background:#dfe7e8;border-color:#b7c8ce;border-radius:10px}
#recBody .rwRuleInput input{height:38px;font-size:19px;color:#153e72}
#recBody .rec-input-unit{color:#4269a7;font-size:13px}
#recBody .rec-rule-details{font-size:12px;color:#426a9f}
#recBody .rec-rule-details summary{padding:3px 0;color:#3263a2}
#recBody .rwTotal{margin-top:3px;padding:6px 12px;min-height:38px;background:#d1dfe4;border-radius:10px;color:#4f6fa2;font-size:12px;justify-content:center}
#recBody .rwTotal b{font-size:23px;color:#b63238}
#recBody .rwTotal [id^=recpen_]{font-size:13px;color:#ce2531}
:is(#recBox,#rewEditBox,#recLogBox,#rewExtraBox) #recFoot{padding:8px 16px;gap:8px;border-top:1px solid #b3c5ce;background:#dce5e7;flex-wrap:nowrap}
:is(#recBox,#rewEditBox,#recLogBox,#rewExtraBox) #recFoot button{font-size:13px;min-height:34px;white-space:nowrap}
#recFoot button:nth-child(2){background:#e4e9e8;color:#134f9f;border-color:#aebfc8}
:is(#recBox,#rewEditBox,#recLogBox,#rewExtraBox) #recConfirmBtn{background:linear-gradient(#4c7996,#345e7c);border-color:#345e7c;font-weight:700;padding:8px 18px;min-height:34px;color:white}
@media(max-width:850px),(max-height:650px){
 .rec-terminal{width:calc(100vw - 16px);height:calc(100dvh - 16px);aspect-ratio:auto;background-size:cover}
 :is(#recOv,#rewEditOv,#recLogOv,#rewExtraOv) :is(#recBox,#rewEditBox,#recLogBox,#rewExtraBox){left:3%;top:3%;width:94%!important;height:94%!important;border:7px solid #373a36;box-shadow:0 0 0 5px #c5bca9;border-radius:0!important}
 :is(#recBox,#rewEditBox,#recLogBox,#rewExtraBox) .rewHead{padding:10px 12px;min-height:48px;flex-wrap:wrap}
 :is(#recBox,#rewEditBox,#recLogBox,#rewExtraBox) .rewHead>b{font-size:20px}
 :is(#recBox,#rewEditBox,#recLogBox,#rewExtraBox) .rewHead>div{margin-left:auto}
 :is(#recBox,#rewEditBox,#recLogBox,#rewExtraBox) #recTop{padding:10px 14px}
 #recTop .rwTop{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}
 #recTop .rwTopTotal{grid-column:1/-1;flex-direction:row;align-items:center;justify-content:space-between}
}
@media(max-width:600px){
 #recTop .rwTop{grid-template-columns:minmax(0,1fr)}
 :is(#recBox,#rewEditBox,#recLogBox,#rewExtraBox) #recBody{padding:8px 10px 12px}
 #recBody .rwCardHead{padding:10px}
 #recBody .rwName{font-size:18px;gap:8px}
 #recBody .rwCardBody{padding:0 10px 10px}
 #recBody .rwRule{grid-template-columns:minmax(0,1fr);gap:6px}
 #recBody .rwRuleInput{grid-column:1}
 :is(#recBox,#rewEditBox,#recLogBox,#rewExtraBox) #recFoot{padding:8px;flex-wrap:wrap}
 :is(#recBox,#rewEditBox,#recLogBox,#rewExtraBox) #recFoot button{font-size:12px}
 :is(#recBox,#rewEditBox,#recLogBox,#rewExtraBox) #recConfirmBtn{padding:8px 12px;margin-left:auto}
}

/* Rule editor uses the same physical terminal and fixed screen geometry. */
body:has(#rewEditOv.show) #recOv{visibility:hidden}
#rewEditBox,#rewEditBox *{font-family:Arial,sans-serif!important}
#rewEditBody{background:#dce3e5;padding:14px 18px;gap:12px;overflow-x:hidden;scrollbar-width:none}
#rewEditBody::-webkit-scrollbar{display:none}
#rewEditBox .rweTip{background:#d1dfe4;border:1px solid #b6c7cd;border-radius:9px;color:#395569;padding:10px 12px;line-height:1.6;font-size:13px}
#rewEditBox .rweSec{background:#e7ecea;border:1px solid #b6c7cd;border-radius:12px;padding:12px;box-shadow:none;backdrop-filter:none}
#rewEditBox .rweSecHead{background:#cbdbe1;margin:-12px -12px 12px;padding:10px 12px;border-radius:11px 11px 0 0}
#rewEditBox .rweRule{background:#dce5e7;border-color:#b6c7cd}
#rewEditBox :is(.rweRow,.rweRuleHead,.rweDyn){color:#284a60;line-height:1.5}
#rewEditBox :is(input:not([type=checkbox]),select){background:#e8edec;border:1px solid #adbec7;border-radius:7px;color:#23465e;min-height:32px;max-width:100%;box-sizing:border-box}
#rewEditBox input[type=number]{color:#b63238}
#rewEditBox .rwe-version-pill.on{background:#436c86;color:white;border-color:#436c86}
#rewEditBox .rwePenCond{flex-wrap:wrap;background:#dde2df}
#rewEditBox .rwePenTargets{min-width:0;flex-basis:100%;grid-template-columns:repeat(3,minmax(0,1fr))}
#rewEditBox .rweTierRow{flex-wrap:wrap}
#rewEditBox .rweSecHead>input{min-width:0;flex:1 1 160px}
#rewEditBox #rewEditFoot{background:#dce5e7;border-top:1px solid #b3c5ce;padding:8px 16px;gap:8px}
#rewEditFoot button:last-child{background:linear-gradient(#4c7996,#345e7c);border-color:#345e7c;color:white;font-weight:700}
@media(max-width:600px){#rewEditBody{padding:10px}#rewEditBox .rwePenTargets{grid-template-columns:repeat(2,minmax(0,1fr))}#rewEditBox .rweRow>input{min-width:0!important}#rewEditBox .rweDyn>span{flex-wrap:wrap}#rewEditBox .rweSecHead{gap:6px}}

/* Nested entry views occupy exactly the same terminal screen. */
body:has(#recLogOv.show) #recOv,body:has(#rewExtraOv.show) :is(#recOv,#rewEditOv){visibility:hidden}
:is(#recLogBox,#rewExtraBox),:is(#recLogBox,#rewExtraBox) *{font-family:Arial,sans-serif!important}
:is(#recLogBody,#rewExtraBody){flex:1;min-height:0;background:#dce3e5;padding:14px 18px;overflow:auto;scrollbar-width:none}
:is(#recLogBody,#rewExtraBody) ::-webkit-scrollbar,:is(#recLogBody,#rewExtraBody)::-webkit-scrollbar{display:none}
#recLogBox .rewHead{flex-wrap:wrap}
#recLogBox .rewHead>div{flex-wrap:wrap;margin-left:auto}
#recLogBox #recLogMonth{background:#e0e8ea!important;color:#284a60;border:1px solid #adbec7!important}
#recLogBox .recLogSec,#rewExtraBox .rweRule{background:#e7ecea;border:1px solid #b6c7cd;border-radius:10px;box-shadow:none}
#recLogBox .recLogSec h4{background:#cbdbe1;color:#284a60;padding:12px}
#recLogBox .usTable{background:#e7ecea;color:#284a60;font-size:13px}
#recLogBox .usTable th{background:#cbdbe1;color:#284a60}
#recLogBox .usTable td{color:#b63238;border-color:#becdd2}
#recLogBox .usTable td:first-child{color:#284a60}
#recLogBox .recLogSec>div{scrollbar-width:none;overscroll-behavior-x:contain}
#rewExtraBox :is(input:not([type=checkbox]),select){background:#e8edec;border:1px solid #adbec7;color:#284a60;border-radius:7px;max-width:100%;min-width:0;box-sizing:border-box}
#rewExtraBox .rweRow,#rewExtraBox .rweDyn{color:#284a60;flex-wrap:wrap}
#rewExtraBox .rweDyn>span,#rewExtraBox .rweTierRow{flex-wrap:wrap}
#rewExtraBox #rewExtraFoot{background:#dce5e7;border-top:1px solid #b3c5ce;padding:8px 16px}
#rewExtraFoot button{background:linear-gradient(#4c7996,#345e7c);color:white}
body:has(:is(#recOv,#recLogOv,#rewEditOv,#rewExtraOv).show) #dlgBox{left:48%!important;top:40%!important;transform:translate(-50%,-50%)!important;max-height:45dvh;background:#dce5e7;color:#284a60;border:1px solid #adbec7;border-radius:10px;font-family:Arial,sans-serif;cursor:default}
@media(max-width:600px){:is(#recLogBody,#rewExtraBody){padding:10px}#recLogBox .rewHead>div{gap:5px!important}body:has(:is(#recOv,#recLogOv,#rewEditOv,#rewExtraOv).show) #dlgBox{left:50%!important;top:50%!important}}
