.box-model-card-preview{gap:8px}.box-model-card-stack{color:#7d5d2c;background:#fff7e6;border:1px dashed #cdb48a;border-radius:7px;place-items:center;padding:9px 7px 11px;display:grid}.box-model-card-layer{text-align:center;place-items:center;display:grid}.box-model-card-layer.is-margin{width:92%;padding:6px}.box-model-card-layer.is-border{color:#6e4f22;background:#fff;border:3px solid #c8932f;border-radius:5px;width:92%;padding:6px}.box-model-card-layer.is-padding{color:#44567f;background:#eef2fa;border:2px solid #8c9dc4;border-radius:4px;width:90%;padding:7px}.box-model-card-layer.is-padding strong{color:#1f6a3a;font-size:11px!important}.box-model-card-layer span{font-size:9px!important}.box-model-card-verdict{background:#fff;border:1px solid #e3e3e8;border-radius:6px;gap:4px;padding:8px 9px;display:grid}.box-model-card-tag{color:#6e4f22;background:#f1ead7;border-radius:999px;width:fit-content;padding:2px 7px;font-weight:800;font-size:9px!important}.box-model-card-verdict p{color:#4a4a53;margin:0;line-height:1.5;font-size:11px!important}.term-interactive-demo.box-model-interaction-demo{border-color:var(--line);background:var(--color-white)}.box-model-interaction-demo button:hover{border-color:var(--ink);background:var(--soft);color:var(--ink)}.box-model-interaction-demo button:focus-visible{outline:2px solid var(--ink);outline-offset:2px}.box-model-sizing-toggle{border:1px solid var(--line);background:var(--soft);border-radius:8px;flex-wrap:wrap;align-self:start;gap:6px;padding:4px;display:inline-flex}.term-interactive-demo.box-model-interaction-demo .box-model-sizing-toggle button{min-height:30px;color:var(--muted);background:0 0;border:1px solid #0000;border-radius:6px;padding:6px 12px;font-weight:700}.term-interactive-demo.box-model-interaction-demo .box-model-sizing-toggle button[aria-pressed=true]{border-color:var(--ink);background:var(--color-white);color:var(--ink)}.box-model-stage{gap:6px;display:grid}.box-model-track-rail{color:var(--muted);justify-content:space-between;align-items:center;gap:8px;font-size:11px;font-weight:750;display:flex}.box-model-rail-right{color:#84848d}.box-model-track{border:1px solid var(--line);background:var(--color-white);border-radius:8px;padding:22px 12px 16px;position:relative}.box-model-track:before{content:"轨道右边界";color:#84848d;background:#f1eff4;border-radius:5px;padding:2px 6px;font-size:10px;font-weight:700;position:absolute;top:4px;right:10px}.box-model-track:after{content:"";pointer-events:none;border-right:2px dashed #c4c4cc;width:0;position:absolute;top:22px;bottom:16px;right:12px}.box-model-track.is-overflow:after{border-right-color:#a83a44}.box-model-occupied{box-sizing:border-box;position:relative}.box-model-margin-tag{color:#7d5d2c;margin-bottom:5px;font-size:10px;font-weight:750;display:block}.box-model-box{box-sizing:border-box;border:3px solid var(--ink);width:100%;color:var(--ink);text-align:center;background:#f4f2ec;border-radius:6px;justify-items:center;gap:5px;padding:12px 8px;transition:width .14s ease-out,padding .14s ease-out,border-width .14s ease-out,background-color .14s ease-out;display:grid}.box-model-box.is-content-box{background:#fbf1d8;border-color:#b9821b}.box-model-box.is-border-box{border-color:var(--ink);background:#eeedea}.box-model-box strong{color:#1f6a3a;font-size:13px}.box-model-box-width{color:#5a5a64;font-size:10px;font-weight:750}.box-model-overflow-badge{background:var(--color-rausch-600);color:#fff;border-radius:999px;padding:3px 9px;font-size:11px;font-weight:800;box-shadow:0 1px #a3082e}.box-model-fit-badge{color:#1f6a3a;background:#e6f7ec;border:1px solid #bfe3cd;border-radius:999px;padding:3px 9px;font-size:11px;font-weight:800}.box-model-dimension-controls{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 16px;display:grid}.box-model-dimension-controls label{gap:4px;display:grid}.box-model-control-label{color:var(--ink);font-size:12px;font-weight:700}.box-model-control-value{color:var(--ink);font-variant-numeric:tabular-nums;font-size:12px;font-weight:800}.box-model-demo-status{border:1px solid var(--line);background:var(--soft);color:#3c3c44;border-radius:7px;margin:0;padding:10px 12px;font-size:13px;line-height:1.55}.box-model-reset{align-self:start}.box-model-knowledge-list,.box-model-when-list{gap:8px;margin:0;padding:0;list-style:none;display:grid}.box-model-knowledge-list li,.box-model-when-list li{border:1px solid var(--line);background:var(--soft);color:#4a4a53;border-radius:7px;padding:10px 12px;font-size:13px;line-height:1.6}.box-model-knowledge-list b,.box-model-when-list b{color:var(--ink)}.box-model-how-list{color:#4a4a53;gap:6px;margin:0;padding-left:18px;font-size:13px;line-height:1.6;display:grid}.box-model-how-list li::marker{color:var(--ink)}.box-model-example-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}.box-model-example-grid article{border:1px solid var(--line);background:var(--soft);border-radius:8px;gap:6px;padding:13px 14px;display:grid}.box-model-example-grid article.is-good{background:#f4faf6;border-left:4px solid #1f6a3a}.box-model-example-grid article.is-bad{background:#fdf3f4;border-left:4px solid #a83a44}.box-model-example-grid article strong{color:var(--ink);font-size:13px}.box-model-example-grid article.is-good strong{color:#1f6a3a}.box-model-example-grid article.is-bad strong{color:#a83a44}.box-model-example-spec{color:#5a5a64;font-family:var(--font-geist-mono), ui-monospace, monospace;margin:0;font-size:12px}.box-model-example-grid article p:not(.box-model-example-spec){color:#4a4a53;margin:0;font-size:13px;line-height:1.6}@media (max-width:640px){.box-model-dimension-controls,.box-model-example-grid{grid-template-columns:1fr}.box-model-track-rail{flex-wrap:wrap}}@media (prefers-reduced-motion:reduce){.box-model-box{transition:none}}.term-card .term-preview.box-model-card-preview{color:#143b40;background:linear-gradient(145deg,#edf9f5,#f9f1de);border-color:#b9d8d3}.box-model-card-stack{background:#dff2eb;border-color:#91c6bd}.box-model-card-layer.is-margin{color:#477b78;background:repeating-linear-gradient(135deg,#0000 0 5px,#477b7821 5px 6px)}.box-model-card-layer.is-border{color:#145a55;background:#fdfcf5;border-color:#16766e}.box-model-card-layer.is-padding{color:#774a13;background:#fff0ce;border-color:#d99a39}.box-model-card-layer.is-padding strong{color:#123f43}.box-model-card-verdict{background:#fffdf7;border-color:#bedbd4}.box-model-card-tag{color:#f4fffc;background:#146e68}.box-model-card-verdict p{color:#36585b}.box-model-card-verdict b{color:#0d615c}.term-interactive-demo.box-model-interaction-demo{--box-ink:#103f43;background:linear-gradient(135deg,#e9f7f2,#f9f2df);border-color:#99c6bf}.box-model-interaction-demo .box-model-track{background:#fffdf7;border-color:#8bbeb6;box-shadow:6px 7px #186c651f}.box-model-interaction-demo .box-model-track:before{color:#165954;background:#d7eeea}.box-model-interaction-demo .box-model-track:after{border-right-color:#32958a}.box-model-interaction-demo .box-model-track.is-overflow:after{border-right-color:#a73936}.box-model-interaction-demo .box-model-track-rail,.box-model-interaction-demo .box-model-rail-right,.box-model-interaction-demo .box-model-control-label,.box-model-interaction-demo .box-model-control-value{color:#255c5c}.box-model-interaction-demo .box-model-margin-tag{color:#447978}.box-model-interaction-demo .box-model-box{color:#103f43;background:#e6f6f1;border-color:#16766e}.box-model-interaction-demo .box-model-box.is-content-box{background:#fff0ce;border-color:#c07a22}.box-model-interaction-demo .box-model-box.is-border-box{background:#e3f4ef;border-color:#126b65}.box-model-interaction-demo .box-model-box strong{color:#105d58}.box-model-interaction-demo .box-model-box-width{color:#315b5e}.box-model-interaction-demo .box-model-fit-badge{color:#145d4e;background:#e0f5e9;border-color:#80c6ad}.box-model-interaction-demo .box-model-overflow-badge{background:#a73936;box-shadow:0 1px #6c2728}.term-interactive-demo.box-model-interaction-demo button{color:#164f50;background:#fffdf7;border-color:#76aaa3}.term-interactive-demo.box-model-interaction-demo button:hover{color:#0c4e4a;background:#d9efea;border-color:#0f6761}.term-interactive-demo.box-model-interaction-demo button:focus-visible{outline-offset:3px;outline:3px solid #e38b35}.term-interactive-demo.box-model-interaction-demo .box-model-sizing-toggle{background:#dff1ec;border-color:#99c6bf}.term-interactive-demo.box-model-interaction-demo .box-model-sizing-toggle button[aria-pressed=true]{color:#fffdf7;background:#126b65;border-color:#0f6761}.box-model-interaction-demo input[type=range]{accent-color:#126b65}.box-model-advanced-controls{color:#1f5757;background:#fffdf7b8;border:1px dashed #80b9b0}.box-model-advanced-controls>div{padding:2px 10px 10px}.box-model-demo-status{color:#315b5e;background:#fffdf7;border-color:#a8d0c8}.box-model-demo-status b{color:#12635c}.box-model-demo-status.is-overflow b{color:#a73936}.box-model-task{color:#255c5c;background:#fff8e9;border-left:3px solid;border-radius:6px;margin:0;padding:10px 12px;font-size:13px;line-height:1.55}@media (max-width:780px){.box-model-card-stack{padding:7px}.box-model-card-layer.is-margin,.box-model-card-layer.is-border,.box-model-card-layer.is-padding{padding:5px}.box-model-card-layer span{font-size:8px!important}}.box-model-advanced-controls{border:1px dashed;border-radius:8px;padding:0 10px 10px}.box-model-advanced-controls summary{cursor:pointer;padding:9px 0;font-weight:800}