/* What the pages compiled from the Claude Design mockups add to them (the mockups'
 * own styles are in each page's CSS, generated by rapoarte/site-design-complet/dc2jinja.py).
 * The "Soon" note (mission, "Ce se face" 6): the blue bracketed note of the mockups
 * (Courier Prime, #38566B, scaleX .9, letter-spacing -.04em) on the paper colour, with the
 * shadow of the mockups' menu panels. */
.dc-soon{position:absolute;z-index:2147483000;padding:8px 14px 7px;background:#F4EBD7;box-shadow:0 8px 18px rgba(0,0,0,.35);pointer-events:auto}
.dc-soon>span{display:block;font:400 15px/1.15 'Courier Prime',monospace;letter-spacing:-.04em;color:#38566B;transform:scaleX(.9);white-space:nowrap}
/* The site's short navigation (templates/public_design.html): hidden on the public
 * site, the operator's small bar on the test site. */
.dc-sitenav{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
html[data-dc-site="test"] .dc-sitenav{position:fixed;left:8px;bottom:8px;z-index:2147483000;width:auto;height:auto;margin:0;padding:4px 8px;clip:auto;background:#1B1814;font:400 12px/1.2 'Courier Prime',monospace}
html[data-dc-site="test"] .dc-sitenav a{color:#F3EADB;margin-right:8px}
html[data-dc-site="test"] .dc-sitenav strong{color:#F3EADB;margin-right:8px}
/* W26 (mission site-design-reparatii-v2, point 13): the magnifier, the dark square at the
 * bottom right of a content image. The square keeps the ink erosion of the mockups
 * (ink-mask-150, 450 x 200 px, RULES "GLOBAL: zoom (magnifier) buttons") on a layer of its
 * own under the icon; the icon itself is under no mask (the mockups masked the whole
 * button, the icon included) and has its viewBox (dc-globals.js zoom). Unlayered
 * !important: beats the mask the page CSS (@layer helmet) gives [aria-hidden] elements and
 * the dark buttons; the blend stays normal (RULES r227, the page CSS). */
[data-zoom]{-webkit-mask-image:none!important;mask-image:none!important;background:transparent!important}
[data-zoom]::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:#1B1814;-webkit-mask-image:url(/static/design/assets/mask/_f/ink-mask-150-900.webp?v=6d805388);mask-image:url(/static/design/assets/mask/_f/ink-mask-150-900.webp?v=6d805388);-webkit-mask-size:450px 200px;mask-size:450px 200px;-webkit-mask-repeat:repeat;mask-repeat:repeat}

/* W30 (mission site-design-reparatii-v2, point 15): the logo is served at the sizes it is
 * shown (data.design_logo_sizes, srcset 1x / 2x); its box keeps the proportions of the
 * mockup's file, so a height rounded to whole pixels in a reduced file moves nothing. */
img[data-logo="masthead-full"]{aspect-ratio:2005/806}
img[data-logo="masthead-simple"]{aspect-ratio:1600/372}
img[data-logo="mark-square"]{aspect-ratio:1024/639}

/* Mission site-corecturi-design, point 6 (the operator's correction B1, 27.10): the ornament
 * separator between the rubrics of the paper (rapoarte/site-corecturi-design/patches.py _orn).
 * The element [data-orn] keeps the box of the rule it replaces; its row (left end, body,
 * centre, body, right end) is centred on that box, so the spacing of the page does not move.
 * Height: 18 px on desktop, 16 on the tablet, 14 on the phone (the source is about 2x; a
 * reversible judgement). The body repeats in whole tiles of three dots (round). */
[data-orn]>[data-orn-row]{position:absolute;left:0;right:0;top:50%;display:flex;align-items:stretch;height:18px;margin-top:-9px;pointer-events:none}
[data-orn]>[data-orn-row]>img{display:block;flex:none;height:100%;width:auto;max-width:none;margin:0;padding:0}
[data-orn]>[data-orn-row]>[data-orn-b]{display:block;flex:1 1 0;min-width:0}
@media (min-width:640px) and (max-width:1199px){[data-orn]>[data-orn-row]{height:16px;margin-top:-8px}}
@media (max-width:639px){[data-orn]>[data-orn-row]{height:14px;margin-top:-7px}}

/* Mission site-corecturi-design, point 6 (the phone points): on the phone the double line of
 * the footer goes and the eagle grows to the width of the footer (its wing tips where the
 * line's ends were; the file's wings reach its edges), its top where it was (the line's box
 * was 37.44 px high, the eagle 40.5 px above its bottom). Desktop and tablet keep the line,
 * aligned with the wings. !important: the runtime writes the mockup's static styles as
 * style attributes. */
@media (max-width:639px){
footer [data-orn29]{display:none!important}
footer a[data-home]{width:100%}
footer a[data-home] img{width:100%!important;margin-top:-3px!important}
}

/* Mission site-corecturi-design, point 8 (the operator's correction D, 27.10): the footer's
 * links are never underlined, never on a coloured ground (the tap highlight of Android
 * included) and never overlap: no font boosting on a phone (text-size-adjust) for the page. */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
footer [data-footnav] a,footer [data-footnav] a:is(:hover,:focus,:active,:visited){text-decoration:none;background:none;-webkit-tap-highlight-color:transparent}

/* Mission site-corecturi-design, point 13 (the phone corrections, Ads & Cartoons): an image
 * taller than wide (data.is_tall, data-tall written on the phone variant only) is at most 2/3
 * of the width of its block, centred; its frame and magnifier go with its link. */
@media (max-width:639px){
figure[data-kind][data-tall="1"]>a{width:calc(200% / 3)!important;margin-left:auto!important;margin-right:auto!important}
}

/* Mission site-texte-imagini, point 2: a click anywhere on the scan of the article page opens
 * it, as its magnifier does. Its figure floats beside the text, whose paragraphs are scaled
 * (scaleX .95, a transform: each one a stacking context, painted over the float), so the box of
 * a paragraph that runs beside the scan covered it and took the click (a long text, 820 px and
 * wider: "President Is Strengthened by New Writ", 1926-10-28). Its link above them. */
figure[data-dcref="scanRef"]>a{z-index:1}