.mar-wrap{padding:22px 18px 100px;color:#493523}.mar-head{text-align:center;margin:4px 0 24px}.mar-head small{color:#a57b43;letter-spacing:.2em;font-size:11px}.mar-head h2{font:600 30px/1.4 var(--serif,serif);color:#882b20;margin:10px 0}.mar-head p{font-size:12px;color:#89715a;line-height:1.7}.mar-modes{display:flex;padding:4px;background:#eee3d0;border-radius:14px;margin-bottom:22px}.mar-modes button{flex:1;border:0;border-radius:11px;padding:13px 6px;background:transparent;color:#796248;font:600 14px var(--sans,sans-serif)}.mar-modes button[aria-selected=true]{background:#fffdf7;color:#982e22;box-shadow:0 2px 10px #80602a12}.mar-person{min-width:0;margin:0 0 18px;padding:18px;border:1px solid #dbc7a5;border-radius:16px;background:#fffdf7}.mar-person legend{padding:0 9px;font:600 17px var(--serif,serif);color:#8e3024}.mar-person p{font-size:12px;color:#927e67;margin:0 0 14px}.mar-date{display:grid;grid-template-columns:1.15fr 1fr 1fr;gap:10px}.mar-person label,.mar-filters label{font-size:12px;color:#7a654e;display:block}.mar-page input,.mar-page select{box-sizing:border-box}.marriage-page input[type=number],.marriage-page select{display:block;width:100%;min-width:0;margin-top:7px;min-height:44px;border:1px solid #ddceb8;border-radius:9px;background:#fff;color:#493523;font:14px var(--sans,sans-serif);padding:10px 8px}.mar-time{margin-top:15px}.mar-person .mar-leap{display:flex;align-items:center;gap:7px;margin-top:12px}.mar-leap input{width:16px;height:16px;accent-color:#9c3927}.mar-filters{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:18px}.mar-filters p{grid-column:1/-1;font-size:12px;line-height:1.6;margin:0;color:#8d765c}.mar-submit{width:100%;min-height:48px;border:0;border-radius:12px;background:linear-gradient(110deg,#8d3023,#ba6031);color:#fff8e9;font:600 15px var(--sans,sans-serif);box-shadow:0 7px 18px #81381e22}.mar-submit:disabled{opacity:.6}.mar-cancel,.mar-more{width:100%;padding:12px;border:1px solid #d8bc8c;border-radius:10px;color:#834e28;background:#fff9ec;margin-top:10px}.mar-note,.mar-rule p{font-size:11px;color:#96816a;line-height:1.8}.mar-rule{font-size:12px;margin:16px 0;color:#8c6944}.mar-rule summary{cursor:pointer;padding:8px 0}.mar-error{color:#a22625;background:#fff0eb;padding:12px;border-radius:9px;font-size:13px}.mar-status{font-size:12px;color:#875c34;line-height:1.7}.mar-results{outline:none}.mar-results>h3{font:600 18px var(--serif,serif);margin:22px 0 14px}.mar-board{border:1px solid #d8bd8f;border-radius:14px;padding:18px 14px;background:linear-gradient(135deg,#fffdf5,#fff4dd);margin:14px 0}.mar-board h3{font-size:13px;color:#8b6e4c;margin:0 0 16px}.mar-numbers{display:flex;justify-content:space-around;gap:6px}.mar-numbers b{font:600 clamp(22px,6vw,36px) var(--serif,serif);color:#8e3024}.mar-board p{font-size:13px;margin:16px 0 6px}.mar-board small{font-size:11px;color:#917b60;line-height:1.6}.mar-scores{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin:18px 0}.mar-scores>div{text-align:center;padding:15px 3px;border-radius:12px;background:#f4e8d2}.mar-scores strong,.mar-scores span,.mar-scores small{display:block}.mar-scores strong{font-size:22px;color:#943b25}.mar-scores span{font-size:12px;margin:8px 0}.mar-scores small{font-size:10px;color:#99815d}.mar-perfect{font-size:13px;color:#8f3825;background:#faecd3;border-radius:10px;padding:14px;line-height:1.6}.mar-table-wrap{overflow-x:auto}.mar-table-wrap table{width:100%;border-collapse:collapse;font-size:12px;white-space:nowrap}.mar-table-wrap caption{text-align:left;font-weight:600;margin:15px 0}.mar-table-wrap th,.mar-table-wrap td{padding:12px 5px;border-bottom:1px solid #e5d7c2;text-align:center}.mar-table-wrap th{color:#8f7150}.mar-candidate{background:#fffdf7;border:1px solid #e0cfb1;border-radius:12px;padding:16px;margin:12px 0}.mar-candidate h4{margin:0;font-size:15px}.mar-candidate p{font-size:11px;color:#9a8265}.mar-candidate button{display:flex;justify-content:space-between;width:100%;border:0;border-top:1px solid #eee4d4;background:transparent;padding:12px 0;color:#82472f;font-size:13px}.mar-candidate button span{color:#a5865e;font-size:11px}.mar-entry{display:flex;align-items:center;gap:13px;width:100%;padding:17px 16px;margin:17px 0;border:1px solid #d9ba83;border-radius:14px;background:linear-gradient(115deg,#fffaf0,#f5e7cb);text-align:left;color:#673d22;cursor:pointer}.mar-entry-icon{display:grid;place-items:center;width:42px;height:42px;border:1px solid #c99c5c;border-radius:50%;font:600 24px var(--serif,serif);color:#9c3927}.mar-entry strong,.mar-entry small{display:block}.mar-entry strong{font-size:16px}.mar-entry small{font-size:11px;margin-top:6px;color:#967651}.mar-entry>span:last-child{margin-left:auto;font-size:24px}.marriage-page [hidden]{display:none!important}.marriage-page :focus-visible,.mar-entry:focus-visible{outline:2px solid #b45b31;outline-offset:3px}
/* Shared date picker and compact entry, aligned with chart form. */
.mar-entry{box-sizing:border-box;min-height:76px;padding:14px 16px;gap:12px;border-radius:13px;border-color:#dcc8a5;background:linear-gradient(115deg,#fffcf5,#f8eedc);box-shadow:0 4px 12px rgba(103,66,24,.035)}
.mar-entry-icon{width:36px;height:36px;border-radius:10px;border:0;background:#f1e3c9;font-size:21px;color:#9a4b28;flex:0 0 36px}
.mar-entry strong{font-size:15px;font-weight:600;letter-spacing:.06em}.mar-entry small{font-size:11px;line-height:1.5;margin-top:4px}.mar-entry>span:last-child{font-size:20px;color:#a58a63}
[data-page="chart"]>#chartForm+.mar-entry{width:calc(100% - 36px);margin:16px 18px 22px}
.mar-birth-date .birth-date-trigger{width:100%;box-sizing:border-box;text-align:left}
.mar-year-label{display:block;font-size:13px;color:#7a5434}.mar-year-info{font-size:12px;line-height:1.6;color:#92795d}.mar-date-line{display:block!important;min-width:0;width:100%;white-space:nowrap!important;font-size:13px;text-align:left;line-height:1.8}.mar-date-line>span{display:inline-block;white-space:nowrap!important;color:#734128!important;font-size:inherit!important}.mar-candidate button.mar-candidate-choice{display:block;width:100%;min-width:0;padding:12px 0;text-align:left}.mar-choice-meta{display:flex!important;justify-content:space-between;align-items:center;margin-top:5px}.mar-choice-meta b{font-size:12px;font-weight:500;color:#956e43}.mar-candidate .mar-date-line{color:#734128}.mar-candidate p{margin-top:0}

/* Keep touch/wheel scrolling without a visible side rail on marriage pages. */
html:has(.marriage-page.active),body:has(.marriage-page.active),.pages:has(.marriage-page.active),.marriage-page,.marriage-page *{scrollbar-width:none}
html:has(.marriage-page.active)::-webkit-scrollbar,body:has(.marriage-page.active)::-webkit-scrollbar,.pages:has(.marriage-page.active)::-webkit-scrollbar,.marriage-page::-webkit-scrollbar,.marriage-page *::-webkit-scrollbar{display:none;width:0;height:0}

/* Match-level chooser: existing goldsand palette, shared 8px gaps / 12px corners. */
.mar-level-trigger{display:block;box-sizing:border-box;width:100%;min-height:44px;margin-top:7px;padding:10px 8px;border:1px solid #ddceb8;border-radius:12px;background:#fffdf7;color:#493523;font:14px var(--sans,sans-serif);text-align:left;cursor:pointer}
.mar-level-dialog{box-sizing:border-box;width:calc(100% - 32px);max-width:420px;max-height:85vh;overflow:auto;padding:16px;border:1px solid #dcc8a5;border-radius:12px;background:#fff9ed;color:#493523;box-shadow:0 16px 48px #673d2233}
.mar-level-dialog::backdrop{background:#30251570}.mar-level-dialog header{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}.mar-level-dialog h3{margin:0;font:600 22px var(--serif,serif);color:#982e22}.mar-level-dialog header button{min-width:44px;min-height:44px;border:0;border-radius:12px;background:#f1e3c9;color:#673d22;font-size:24px;cursor:pointer}.mar-level-options{display:grid;gap:8px}.mar-level-options button{min-height:56px;padding:12px;border:1px solid #dcc8a5;border-radius:12px;background:#fffdf7;color:#493523;font:16px var(--sans,sans-serif);cursor:pointer}.mar-level-options button[aria-pressed=true]{color:#982e22;border-color:#982e22;background:#faecd3}.mar-level-dialog button:focus-visible{outline:2px solid #b45b31;outline-offset:2px}.mar-level-dialog button:active{transform:translateY(1px)}

.mar-degree-trigger:disabled{opacity:1;color:#982e22;background:#faecd3;cursor:default}

/* Leave room for the focus outline between stacked form fields. */
.marriage-page .mar-person>label{height:auto;min-width:0}
.marriage-page .mar-person>label+p{margin-top:8px!important;line-height:1.6}
.marriage-page .mar-person select,.marriage-page .mar-person .birth-date-trigger{box-sizing:border-box;max-width:100%;height:auto;line-height:1.5}

.marriage-page .mar-year-label{display:flex;flex-direction:column;align-items:stretch;gap:8px;margin-bottom:8px}.marriage-page .mar-year-label select,.marriage-page .mar-year-label .birth-time-trigger{width:100%;box-sizing:border-box;margin:0;min-height:44px}

.mar-year-buttons{display:grid;grid-template-columns:repeat(auto-fit,minmax(88px,1fr));gap:8px;margin:8px 0}.mar-year-buttons button{min-height:44px;padding:10px 8px;border:1px solid #dcc8a5;border-radius:12px;background:#fffdf7;color:#734128;font:14px var(--sans,sans-serif);cursor:pointer}.mar-year-buttons button[aria-pressed=true]{border-color:#982e22;color:#982e22;background:#faecd3}