/* Sharp UK brand colours */
        :root {
            --cnc-blue:  #005398;
            --cnc-navy:  #011451;
            --cnc-light: #f2f2f2;
            --cnc-white: #ffffff;
            --cnc-text:  #232323;
            --cnc-bg:    #ffffff;
            --cnc-accent: #4DBBC6;
        }

        * { box-sizing: border-box; }

        body {
            background: var(--cnc-bg);
            font-family: 'Noto Sans', 'Segoe UI', Arial, "Helvetica Neue", Helvetica, sans-serif;
            color: var(--cnc-text);
            margin: 0;
            min-height: 100vh;
            display: flex;
            flex-direction: column;
        }

        /* -- Header --------------------------------------------------- */
        .cnc-header {
            background: var(--cnc-navy);
            border-bottom: none;
        }
        .cnc-header-inner {
            padding: .75rem 1.5rem;
            display: flex;
            align-items: center;
        }
        .cnc-header img.logo {
            height: 50px;
            width: auto;
            max-width: 100%;
            object-fit: contain;
            display: block;
        }

        /* -- Page ------------------------------------------------------ */
        .page-wrap {
            flex: 1;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 2.5rem 1rem;
        }
        .login-outer { width: 100%; max-width: 460px; }

        /* -- Card ------------------------------------------------------ */
        .cnc-card { background: #fff; box-shadow: 0 2px 12px rgba(0,0,0,.1); border-radius: 6px; overflow: hidden; }

        .cnc-card-header {
            background: var(--cnc-navy);
            color: #fff;
            padding: 1.25rem 1.75rem 1.1rem;
        }
        .cnc-card-header h2 {
            font-size: 1.2rem;
            font-weight: 700;
            margin: 0 0 .2rem;
        }
        .cnc-card-header p {
            margin: 0;
            font-size: .83rem;
            color: rgba(255,255,255,.7);
        }
        .cnc-blue-rule { width: 36px; height: 3px; background: var(--cnc-accent); margin-bottom: .65rem; border-radius: 2px; }

        .cnc-card-body { padding: 1.75rem; }

        /* -- Form ------------------------------------------------------ */
        .form-label {
            font-weight: 700;
            font-size: .85rem;
            color: var(--cnc-text);
            margin-bottom: .3rem;
        }
        .form-control, .form-select {
            border-radius: 4px;
            border: 2px solid #bbb;
            font-size: .9rem;
        }
        .form-control:focus, .form-select:focus {
            border-color: var(--cnc-blue);
            box-shadow: 0 0 0 3px rgba(0,83,152,.18);
        }
        .input-group-text {
            border-radius: 4px 0 0 4px;
            border: 2px solid #bbb;
            border-right: none;
            background: var(--cnc-light);
            color: var(--cnc-navy);
        }
        .input-group .form-control {
            border-left: none;
        }
        .form-select:disabled, .form-control:disabled {
            background-color: #e9ecef; color: #495057; opacity: 1; cursor: wait;
        }
        .form-check-input:checked { background-color: var(--cnc-blue); border-color: var(--cnc-blue); }
        .form-check-input:focus { border-color: var(--cnc-blue); box-shadow: 0 0 0 3px rgba(0,83,152,.18); }
        /* -- Primary button -------------------------------------------- */
        .btn-cnc {
            background: var(--cnc-blue);
            color: #fff;
            border: none;
            border-radius: 4px;
            font-weight: 700;
            font-size: .95rem;
            padding: .65rem 1.5rem;
            transition: background .15s;
        }
        .btn-cnc:hover, .btn-cnc:active, .btn-cnc:focus-visible { background: var(--cnc-navy); color: #fff; }
        .btn-cnc:focus-visible { outline: 3px solid var(--cnc-blue); outline-offset: 3px; }
        .btn-cnc:disabled { background: #495057; color: #fff; opacity: 1; cursor: wait; }

        /* -- Footer ---------------------------------------------------- */
        .cnc-footer {
            background: var(--cnc-navy);
            color: rgba(255,255,255,.8);
            font-size: .78rem;
            padding: .9rem 1.5rem;
            text-align: center;
            border-top: 4px solid var(--cnc-accent);
        }
        .cnc-footer a { color: var(--cnc-accent); text-decoration: none; }
        .cnc-footer a:hover { text-decoration: underline; }
        .cnc-footer a:focus-visible { outline: 2px solid var(--cnc-accent); outline-offset: 3px; }